小編給大家分享一下CSS3兩大實用屬性以及網(wǎng)頁制作技巧的示例分析,希望大家閱讀完這篇文章之后都有所收獲,下面讓我們一起去探討吧!
鄱陽網(wǎng)站制作公司哪家好,找創(chuàng)新互聯(lián)建站!從網(wǎng)頁設(shè)計、網(wǎng)站建設(shè)、微信開發(fā)、APP開發(fā)、成都響應(yīng)式網(wǎng)站建設(shè)公司等網(wǎng)站項目制作,到程序開發(fā),運(yùn)營維護(hù)。創(chuàng)新互聯(lián)建站2013年開創(chuàng)至今到現(xiàn)在10年的時間,我們擁有了豐富的建站經(jīng)驗和運(yùn)維經(jīng)驗,來保證我們的工作的順利進(jìn)行。專注于網(wǎng)站建設(shè)就選創(chuàng)新互聯(lián)建站。
CSS3兩大實用屬性,以及網(wǎng)頁制作技巧
一、使用 :not() 在菜單上應(yīng)用/取消應(yīng)用邊框
CSS3兩大實用屬性,以及網(wǎng)頁制作技巧
我們通常的做法是先給每個菜單項設(shè)置邊框,然后在設(shè)置最后一個菜單的邊框為零
不過不要這么做,使用 :not() 偽類來達(dá)到同樣的效果:
當(dāng)然,你也可以使用 .nav li + li 或者 .nav li:first-child ~ li ,但是 :not() 更加清晰,具有可讀性
二、使用:nth-child(n)選擇項目
(注:第一個子元素的下標(biāo)是 1)
:nth-child(3) 表示選擇列表中的第三個元素
:nth-child(2n)表示列表中的偶數(shù)標(biāo)簽,即選擇第2、第4、第6……標(biāo)簽
:nth-child(2n-1) 表示選擇列表中的奇數(shù)標(biāo)簽,即選擇 第1、第3、第5、第7……標(biāo)簽
:nth-child(n+3) 表示選擇列表中的標(biāo)簽從第3個開始到最后(>=3)
:nth-child(-n+3) 表示選擇列表中的標(biāo)簽從0到3,即小于3的標(biāo)簽(<=3)
:nth-last-child(3) 表示選擇列表中的倒數(shù)第3個標(biāo)簽
:nth-of-type(n) 匹配屬于父元素的特定類型的第 N 個子元素的每個元素
三、隱藏沒有靜音、自動播放的影片
再次,利用了:not()的優(yōu)點
CSS3兩大實用屬性,以及網(wǎng)頁制作技巧
四、IE 條件注釋
IE 中的條件注釋對 IE 的版本和 IE 非 IE 有優(yōu)秀的區(qū)分能力,是 Web 開發(fā)中常用的hack方法,能對 IE 系列產(chǎn)品進(jìn)行單獨的 HTML 代碼處理
五、固定表格table-layout:fixed;
通常搭配word-wrap:break-word;和word-break:break-all;使用
CSS3 word-wrap 屬性
word-wrap: normal|break-word;
CSS3兩大實用屬性,以及網(wǎng)頁制作技巧
CSS3 word-break 屬性
word-break: normal|break-all|keep-all;
看完了這篇文章,相信你對“CSS3兩大實用屬性以及網(wǎng)頁制作技巧的示例分析”有了一定的了解,如果想了解更多相關(guān)知識,歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道,感謝各位的閱讀!