包含大量**的網頁(比如文件或教程)在樣式上面對著無法迴避的挑戰。我們通常使用
和元素來顯示**,它們具有瀏覽器所賦予的預設樣式。這些預設樣式往往是:
pre, code pre
這遠不足以解決**展示所獨有的種種挑戰。這其中最大的乙個問題在於,即使 tab 非常適合用來縮排** ① ,但人們在網頁中卻常常有意避開tab。這是因為瀏覽器會把其寬度顯示為 8 個字元!看看下面第乙個圖就可以發現這麼寬的縮排是多麼難看、多麼浪費:這段**甚至已經裝不進這個容器了!
乙個新的 css 屬性 tab-size可以控制這個情況。這個屬性接受乙個數字(表示字元數)或者乙個長度值(這個不那麼實用)。我們通常希望把它設定為 4 (表示 4 個字元的寬度)或
2 ,後者是最近更為流行的縮排尺寸。
html主體部分:
// default tab sizewhile (true)
}
// tab-size: 2;
while (true)
}
// tab-size: 4;
while (true)
}
// tab-size: 0;
while (true)
}
css
pre pre:nth-of-type(2) pre:nth-of-type(3) pre:nth-of-type(4) code最後效果
如何使用 CSS3 偽類
在 這些新的 css3 偽類之前,先簡要回顧追溯一下這些在 web 應用中常常被誤解的 css 選擇器。在 1996 年,當 css1 的規範完成後,一些偽類選擇器已被囊括在內,其中許多你幾乎每天都在使用。例如 這些狀態都可以被應用到某個元素,通常是以 a 偽類名 css2 來了和 lang 新偽類...
如何使用 CSS3 新增投影
本主題將向你介紹如何使用 windows internet explorer 9 和 cascading style sheets,level 3 css3 向布局元素的外部或內部新增投影。你甚至可以為使用 internet explorer 9 中新提供的圓角支援所建立的圓角曲線新增陰影。本主題包...
CSS 3 漸變的使用
css3 漸變 gradients 可以讓您在兩個或多個指定的顏色之間顯示平穩的過渡。css3 定義了兩種型別的漸變 gradients 為了建立乙個線性漸變,您必須至少定義兩種顏色結點。顏色結點即您想要呈現平穩過渡的顏色。同時,您也可以設定乙個起點和乙個方向 或乙個角度 div 第乙個引數表示線性...