一、CSS語(yǔ)法:
h1 {color:blue;font-size:12px;}
h1就是HTML的標(biāo)簽,又叫選被器,是被選擇樣式化的對(duì)象,color:blue;就是效果一,font-size:12px;效果二
二、來(lái)個(gè)例子:
p {color:red;text-align:center}
或者這樣,更方便讀取
p
{
color:red;
text-align:center;
}
放到HTML里的代碼就是:
<html>
<head>
<style type=”text/css”>
p
{
color:red;
text-align:center;
}
</style>
</head>
<body>
<p>Hello World!</p>
<p>This paragraph is styled with CSS.</p>
</body>
</html>
三、CSS注釋用/* 這里是被注釋的內(nèi)容 */
/*This is a comment*/
p
{
text-align:center;
/*This is another comment*/
color:black;
font-family:arial
}
四、CSS的id和Class選擇器來(lái)控制樣式
id可以用作樣式化一個(gè)單獨(dú)的對(duì)象,比如我們要對(duì)某一個(gè)P元素做個(gè)效果,而其他的默認(rèn)效果。
id在CSS中的定義方式就是:
#para1
{
text-align:center;
color:red
}
這里的para1就是HTML文件中某一個(gè)元素的id,看個(gè)例子
<html>
<head>
<style type=”text/css”>
#para1
{
text-align:center;
color:red
}
</style>
</head>
<body>
<p id=”para1″>Hello World!</p>
<p>This paragraph is not affected by the style.</p>
</body>
</html>
看效果圖,只有id為para1的P元素有效果。
Class也就是類(lèi)選擇器,可以表示一組元素的樣式,id只對(duì)一個(gè)有效
[code]
<html>
<style>
.cen {text-align: center}
</style>
<body>
<h1 class="cen">
This heading will be center-aligned
</h1>
<p class="cen">
This paragraph will also be center-aligned.
</p>
</body>
</html>
這樣h1和p的內(nèi)容都會(huì)自動(dòng)居中了
上一頁(yè)12 3 下一頁(yè) 閱讀全文
新聞熱點(diǎn)
疑難解答
圖片精選