1、html文件(负责网页的内容)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html> <head> <title> 欢迎来到梦之都 </title> <!--这是引入css文件的外联方式--> <link rel="stylesheet" type="text/css" href="dreamdu.css"> </head> <body> <h1>欢迎来到乐凡空间</h1> <p>这是我的第一个网页,在这里 <a href="http://www.dreamdu.com/css/"> 尽情学习CSS </a>吧! </p> </body> </html>
2、css(负责网页的布局和内容的样式,我们采用外联的方式引入)
/*段落样式*/ p { color: purple; font-size: 12px; } /*标题样式*/ h1 { color: olive; text-decoration: underline; } /*链接样式*/ /*这个选择器是设置了连接没有访问前的样式*/ a:link { color:#006486; } /*这个选择器是设置了连接访问后的样式*/ a:visited { color:#464646; } /*这个连接是鼠标悬停在上面的时候的样式*/ a:hover { color: #fff; background: #3080CB; } /*这个选择器是鼠标按下之后的样式*/ a:active { color:white; background: #3080CB ; }