css指的是層疊樣式表 樣式的定義html如何進行顯示.
樣式通常存儲在樣式表中,解決內容與表現分離的問題.
css語法
由選擇器 屬性和屬性值三部分構成.
p
{
color:red;
text-align:center;
}
css中的註釋位/*ccc*/ html中的註釋位<!--ccc-->
css中有id選擇器和class選擇器
#para1 { text-align:center; color:red; }
id爲單個元素的 class可以有多個元素的.
.center {text-align:center;}
也可以所有的p元素使用class = center
p.center {text-align:center;}
重點 插入樣式表有3中形式
外部樣式表 內部樣式表 和內聯樣式
外部樣式表通過link標籤鏈接到樣式表中 <link>標籤必須在文檔的head中
<head>
<link rel="stylesheet" type="text/css" href="mystyle.css">
</head>
內部樣式表 通過在head中包含style標籤來進行顯示
<head>
<style>
hr {color:sienna;}
p {margin-left:20px;}
body {background-image:url("images/back40.gif");}
</style>
</head>
內聯樣式 僅在該元素上使用一次時,可用該方法.
<p style="color:sienna;margin-left:20px">這是一個段落。</p>
一般情況下 加載優先級如下
內聯樣式 > 內部樣式 > 外部樣式 >瀏覽器默認樣式
注意:如果外部樣式放在內部樣式的後面,則外部樣式會覆蓋內部樣式.
文本的對齊方式,可以用text-align 進行實現 text-align:center;left;right;
文本修飾可用text-decoration 來實現
h1 {text-decoration:overline;}
文本轉換 將所有句子變成大寫或小寫字母,或首字母大寫.
p.uppercase {text-transform:uppercase;} p.lowercase {text-transform:lowercase;} p.capitalize {text-transform:capitalize;}
文本縮進:可用text-indent:10px來實現.
優先級: 標籤權重 1 如h1 類權重 10 如class id權重 100 如id 內聯樣式最高爲1000 如style=
style中修改樣式使用font-size = "" 這種風格 在js中修改樣式採用駝峯式風格,a.fontSize = 10px