<!DOCTYPE html><!-- 定义文档类型 -->
<html>
<head><!-- 定义网页头部 -->
<title>php中文网-视频教程</title>
<meta charset="utf-8"><!-- 设置字符集编码 -->
<link rel="stylesheet" type="text/css" href="static/style.css"><!-- 连接外部css样式表 -->
<link rel="shortcut icon" type="image/x-icon" href="images/footlogo.png">
<style type="text/css"> /*内部样式：只针对当前页面*/
body{}/*标签选择器*/
#box{width:100px;/*id选择器*/
height: 100px;
background: pink; }
.main{width:100px;/*类选择器*/
height: 100px;
background: green; }
a[href="http://www.php.cn"]{color: red;}
a{color: blue;}/*属性选择器*/
div a{color: black;}/*派生选择器 根据文档上下文关系来定义样式*/
</style>
</head>
<body >
<img src="">
<a href="http://www.baidu.com">百度</a><!-- 连接到外部网站 -->
<a href="http://www.php.cn">php中文网</a>
<a href="demo2.html">demo2</a><!-- 连接到内部文件 -->
<div id="box">
<a href="http://www.baidu.com">百度</a>
</div>
<div class="main"></div>
<div></div>
<div></div>
</html>
知识点：
1、html常用标签
<!DOCTYPE html><!-- 定义文档类型 -->
<head></head><!-- 定义网页头部 -->
<style></style>层叠样式表标签
<a></a>超连接标签
2、css选择器
body{}/*标签选择器*/
#box /*id选择器*/
.main /*类选择器*/
a[href="http://www.php.cn"]{color: red;} /*属性选择器*/
a{color: blue;}/*属性选择器*/
div a{color: black;}/*派生选择器 根据文档上下文关系来定义样式*/