HTML
Hyper Text Markup Language超文本标记语言
W3C万维网联盟World Wide Web
W3C标准包括:
-
结构化标准语言(HTML,XML)
-
表现标准语言(CSS)
-
行为标准(DOM,ECMAScript)
网页基本信息
Ctrl+/注释<!-- -->
<!-- DOCTYPE:告诉浏览器,我们要使用什么规范-->
<!DOCTYPE html>
<html lang="en">
<!--head标签代表网页头部-->
<head>
<!-- meta描述性标签,它用来描述我们网站的一些信息-->
<!-- meta一般用来做SEO-->
<meta charset="UTF-8">
<meta name="keywords" content="苏苏">
<meta name="description" content="学习">
<!-- title网页标题-->
<title>苏苏的网页</title>
</head>
<!--body标签代表网页主体-->
<body>
Hello,World!
</body>
</html>
网页基本标签
P+Tab快捷键
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>基本标签学习</title>
</head>
<body>
<!--标题标签-->
<h1>一级标签</h1>
<h2>二级标签</h2>
<h3>三级标签</h3>
<h4>四级标签</h4>
<h5>五级标签</h5>
<h6>六级标签</h6>
<!--段落标签-->
<p></p>
<!--水平线标签-->
<hr/>
<!--换行标签-->
<br/>
<!--字体样式标签-->
粗体:<strong>fighting</strong><br/>
斜体:<em>fighting</em>
<br/>
<!--特殊符号-->
空 格<br/>
空 格<br/>
>
<<br/>
©版权所有苏苏
</body>
</html>
图像标签
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>图像标签学习</title>
</head>
<body>
<!--img学习
src:图片地址
绝对地址
相对地址
../ 上一级目录
alt:图片名字
-->
<img src="../resources/image/1.jpg" alt="hello开封" title="悬停文字" width="300" height="300">
</body>
</html>
链接标签
Ctrl+D复制到下一行
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>链接标签学习</title>
</head>
<body>
<!--使用name作为标记-->
<a name="top">顶部</a>
<!--使用id作为标记-->
<a href="top" id="top">顶部</a>
<!--a标签
herf:表示要跳转到哪个页面(必填)
target:表示窗口在哪里打开
_blank 在新标签中打开
_self 在自己的网页中打开
-->
<a href="1.我的第一个网页.html" target="_blank">跳转到页面1</a>
<a href="https://www.baidu.com" target="_self">跳转到百度</a>
<br/>
<a href="1.我的第一个网页.html">
<img src="../resources/image/1.jpg" alt="hello开封" title="悬停文字" width="300" height="300">
</a>
<p>
<a href="1.我的第一个网页.html">
<img src="../resources/image/1.jpg" alt="hello开封" title="悬停文字" width="300" height="300">
</a>
</p>
<p>
<a href="1.我的第一个网页.html">
<img src="../resources/image/1.jpg" alt="hello开封" title="悬停文字" width="300" height="300">
</a>
</p>
<p>
<a href="1.我的第一个网页.html">
<img src="../resources/image/1.jpg" alt="hello开封" title="悬停文字" width="300" height="300">
</a>
</p>
<p>
<a