前幾天遇到一個(gè)問(wèn)題,代碼是這樣一個(gè)層次:
復(fù)制代碼 代碼如下:
div class="province">
ul>
li>1/li>
li>2/li>
li>3/li>
/ul>
/div>
我設(shè)置了div的邊框,
要想ul的內(nèi)容在邊框內(nèi),
必須設(shè)置div高度。
但是,ul內(nèi)的內(nèi)容是變化的,內(nèi)容少的時(shí)候就不及div的高度。
不設(shè)高度的時(shí)候,ul的內(nèi)容就出現(xiàn)在邊框外了。
原來(lái)需要設(shè)置ul的邊框。想想也是,先設(shè)置與他關(guān)系最近的元素吧。
對(duì)于前端不是很專業(yè)的同僚來(lái)說(shuō),寫(xiě)css樣式表還是有個(gè)規(guī)則比較好:
指定css樣式要有層次:如上例,定義li的樣式 .province ul li{...}
寫(xiě)樣式有個(gè)大致順序:容器大?。╳idth,height......),容器位置(left,margin......),容器文本(color......),其他
這樣盡可能避免樣式覆蓋之類的問(wèn)題。
您可能感興趣的文章:- jQuery實(shí)現(xiàn)控制文字內(nèi)容溢出用省略號(hào)(…)表示的方法
- 文字溢出實(shí)現(xiàn)溢出的部分再放入一個(gè)新生成的div中具體代碼
- div中文字內(nèi)容溢出常見(jiàn)的解決方法