Dreamweaver是一款非常好用的網(wǎng)頁(yè)制作工具,其中使用CSS可以為網(wǎng)頁(yè)增加更多的樣式和效果。以下是如何在DW中使用CSS的介紹。
帶入CSS文件 <link rel="stylesheet" type="text/css" href="樣式文件路徑.css">
首先,在DW中打開(kāi)要制作的網(wǎng)頁(yè),并在頭部引用樣式文件,即在<head>標(biāo)簽內(nèi)部添加以下代碼:
接著,在style標(biāo)簽內(nèi)編寫(xiě)CSS代碼即可,例如:
body { font-family: Arial,Helvetica,sans-serif; font-size: 16px; color: #333; } h1 { font-size: 24px; color: orange; } p { line-height: 1.5; text-align: justify; }
以上CSS代碼的作用是將網(wǎng)頁(yè)的整體字體設(shè)置為Arial,字號(hào)為16px,顏色為#333;將h1標(biāo)題的字號(hào)設(shè)置為24px,顏色為橙色;將p段落的行間距設(shè)置為1.5,文本對(duì)齊方式設(shè)置為兩端對(duì)齊。
最后,在HTML代碼中為各個(gè)元素添加Class或ID,并在CSS代碼中編寫(xiě)對(duì)應(yīng)的樣式即可。例如:
<div class="container"> <h1 id="title">這是一個(gè)標(biāo)題</h1> <p>這是一個(gè)段落,測(cè)試文字內(nèi)容。</p> </div> .container { width: 800px; margin: 0 auto; } #title { background-color: #eee; padding: 10px; }
以上CSS代碼的作用是將class為container的div元素設(shè)置寬度為800px,水平居中對(duì)齊;將id為title的h1元素的背景色設(shè)置為淺灰色,內(nèi)邊距為10px。
以上是DW中使用CSS的基本介紹,通過(guò)熟練使用CSS,我們可以為網(wǎng)頁(yè)增加更多的樣式和效果,使網(wǎng)頁(yè)更加美觀(guān)和易讀。