<!DOCTYPE html><!-- 这个就相当于一个申明,表明是一个html文件,也还有其他类型的文件,另外注释是选中你要注释的对象,然后Ctrl+/-->
<html><!-- 标签语言,一般都是成对出现的,简单理解为成对出现的为元素,没有结束标签的为空元素-->
<head><!-- 英语意思就是头部的意思,定义网页头部 -->
<title>Swisun的PHP学习之路</title><!-- 可以理解为定义网页的姓名 -->
<meta charset="utf-8"><!-- 编码格式,如果没有的话,会出现乱码 -->
<link rel="stylesheet" type="text/css" href="static/style.css"><!-- 调用一个外部的CSS样式文件。他是通过<link/>这个标签来调用的。
然后, href="static/style.css" 表示外部样式文件的路径,
rel="stylesheet"表示调用的是一种样式。告诉浏览器你将采用一个样式表文件
简单来说就是告诉浏览器你将采用什么编码来对下面的内容进行处理
最后,type="text/css" 就具体说明调用样式的文件类型为CSS样式!这个也是一个外部样式,为了共享 -->
<link rel="shortcut icon" type="image/x-icon" href="images/footlogo.png">
<!-- 这个就是给title引用一张图片 -->
<style type="text/css">
/*内部样式,只是针对当前页面
tag标签名、id名(名字前面加 #) class名 属性选择器*/
body{}
/*标记选择器*/
#box{width:100px;height: 100px;background: pink; }
/*id选择器*/
.main{width:100px;height: 100px;background: blue; }
/*class选择器 类 */
a{color: red;}
/*属性选择器*/
a[href="http://www.php.cn/"]{color:green; }
a[href="02.html"]{color:green;}/*派生选择器 根据文档上下文关系来定义样式*/
div a{color:#0000}
#box a{}
</style>
</head>
<body>
<img src="">
<a href="https://www.baidu.com">百度</a>
<a href="*">*</a>
<a href="02.html">02</a>
<!-- 这个链接到外部文件, -->
<a href="http://www.php.cn/">PHP中文网</a>
<div id="box">
<a href="https://www.baidu.com">BAIDU</a>
</div>
<div class="main"></div>
</body>
</html>
<!DOCTYPE html><!-- 这个就相当于一个申明,表明是一个html文件,也还有其他类型的文件,另外注释是选中你要注释的对象,然后Ctrl+/--> <html><!-- 标签语言,一般都是成对出现的,简单理解为成对出现的为元素,没有结束标签的为空元素--> <head><!-- 英语意思就是头部的意思,定义网页头部 --> <title>Swisun的PHP学习之路</title><!-- 可以理解为定义网页的姓名 --> <meta charset="utf-8"><!-- 编码格式,如果没有的话,会出现乱码 --> <link rel="stylesheet" type="text/css" href="static/style.css"><!-- 调用一个外部的CSS样式文件。他是通过<link/>这个标签来调用的。 然后, href="static/style.css" 表示外部样式文件的路径, rel="stylesheet"表示调用的是一种样式。告诉浏览器你将采用一个样式表文件 简单来说就是告诉浏览器你将采用什么编码来对下面的内容进行处理 最后,type="text/css" 就具体说明调用样式的文件类型为CSS样式!这个也是一个外部样式,为了共享 --> <link rel="shortcut icon" type="image/x-icon" href="images/footlogo.png"> <!-- 这个就是给title引用一张图片 --> <style type="text/css"> /*内部样式,只是针对当前页面 tag标签名、id名(名字前面加 #) class名 属性选择器*/ body{} /*标记选择器*/ #box{width:100px;height: 100px;background: pink; } /*id选择器*/ .main{width:100px;height: 100px;background: blue; } /*class选择器 类 */ a{color: red;} /*属性选择器*/ a[href="http://www.php.cn/"]{color:green; } a[href="02.html"]{color:green;}/*派生选择器 根据文档上下文关系来定义样式*/ div a{color:#0000} #box a{} </style> </head> <body> <img src=""> <a href="https://www.baidu.com">百度</a> <a href="*">*</a> <a href="02.html">02</a> <!-- 这个链接到外部文件, --> <a href="http://www.php.cn/">PHP中文网</a> <div id="box"> <a href="https://www.baidu.com">BAIDU</a> </div> <div class="main"></div> </body> </html>
手写代码
运行实例 »
点击 "运行实例" 按钮查看在线实例