這幾則CSS技巧都是從網絡收集來的,作為老手就當作溫故而知新,本文主要面對CSS新手朋友,有一些東西或許不是搞的很明白。而這十則CSS技巧能促進你的學習與編碼技巧,更多的知識瀏覽CSS教程頻道內容。希望大家能認真閱讀。
一、CSS字體屬性簡寫規則
一般用CSS設定字體屬性方法:
font-weight:bold;
font-style:italic;
font-varient:small-caps;
font-size:1em;
line-height:1.5em;
font-family:verdana,sans-serif;
可以把它們全部寫到一行上去:
font: bold italic small-caps 1em/1.5em verdana,sans-serif;
這樣看起來是不是簡單多了,只有一點要提醒的:這種簡寫方法只有在同時指定font-size和font-family屬性時才起作用。而且,如果你沒有設定font-weight, font-style, 以及font-varient,他們會使用缺省值,這點要記上。
二、CSS border的缺省值
通常可以設定邊界的顏色,寬度和風格,如:
border: 3px solid #000;
這位把邊界顯示成3像素寬,黑色,實線。但實際上這里只需要指定風格即可。
如果只指定了風格,其他屬性就會使用缺省值。一般地,Border的寬度缺省是medium,一般等于3到4個像素;缺省的顏色是其中文字的顏色。如果這個值正好合適的話,就不用設那么多了。
三、給元素同時使用兩個類
一般一個元素設定一個類(Class),但這并不意味著不能用兩個。事實上,你可以這樣:
<p class=”text side”>…</p>
同時給P元素兩個類,中間用空格格開,這樣所有text和side兩個類的屬性都會加到P元素上來。如果它們兩個類中的屬性有沖突的話,后設置的起作用,即在CSS文件中放在后面的類的屬性起作用。
補充:對于一個ID,不能這樣寫<p id=”text side”>…</p>也不能這樣寫
四、CSS用于文檔打印
許多網站上都有一個針對打印的版本,但實際上這并不需要,因為可以用CSS來設定打印風格。
也就是說,可以為頁面指定兩個CSS文件,一個用于屏幕顯示,一個用于打印:
<link type=”text/css” rel=”stylesheet” href=”stylesheet.css” media=”screen” />
<link type=”text/css” rel=”stylesheet” href=”printstyle.css” media=”print” />
第1行就是顯示,第2行是打印,注意其中的media屬性。
但應該在打印CSS中寫什么東西呢?你可以按設計普通CSS的方法來設定它。設計的同時就可以把這個CSS設成顯示CSS來檢查它的效果。也許你會使用display: none 這個命令來關掉一些裝飾圖片,再關掉一些導航按鈕等。
新聞熱點
疑難解答