1.HTML 文档 = 网页
Web 浏览器的作用是读取 HTML 文档,并以网页的形式显示出它们。浏览器不会显示 HTML 标签,而是使用标签来解释页面的内容
<html>
<meta charset="UTF-8">
<body>
<h1>我的第一个标题</h1>
<p>我的第一个段落。</p>
</body>
</html>
- <html> 与 </html> 之间的文本描述网页
- <body> 与 </body> 之间的文本是可见的页面内容
- <h1> 与 </h1> 之间的文本被显示为标题
- <p> 与 </p> 之间的文本被显示为段落
如果编写html的时候中文出现乱码,加入<meta charset="UTF-8">即可
2. HTML标签
- <h1>~<h6>
标题标签 - <p>
段落标签 - <a>
链接标签url
<a href="http://www.sunmingming.top">This is a link</a> - <img>
图片标签
<img src="w3school.jpg" width="104" height="142" /> - pre 标签对空行和空格进行控制。
<pre>
在pre标签之间的文字将会保留空格
</pre>
3. HTML元素
- HTML 元素指的是从开始标签(start tag)到结束标签(end tag)的所有代码。
- 大多数 HTML 元素可以嵌套(可以包含其他 HTML 元素)。
- HTML 文档由嵌套的 HTML 元素构成
HTML 标签对大小写不敏感:<P> 等同于 <p>。许多网站都使用大写的 HTML 标签。 - < br>标签表示换行
4. HTML 属性
- HTML 标签可以拥有属性。属性提供了有关 HTML 元素的更多的信息。
- 属性总是以名称/值对的形式出现,比如:name="value"。
- 属性总是在 HTML 元素的开始标签中规定
5. HTML水平线
<hr /> 标签在 HTML 页面中创建水平线。
6.HTML注释
7.HTML拆行
如果您希望在不产生一个新段落的情况下进行换行(新行),请使用 <br /> 标签
<p>This is<br />a para<br />graph with line breaks</p>
HTML 代码中的所有连续的空行(换行)也被显示为一个空格。
8.HTML样式
- style 属性的作用:提供了一种改变所有 HTML 元素的样式的通用方法
- 背景颜色
background-color 属性为元素定义了背景颜色
<html>
<body style="background-color:yellow">
<h2 style="background-color:red">This is a heading</h2>
<p style="background-color:green">This is a paragraph.</p>
</body>
</html>
- HTML 样式实例 - 字体、颜色和尺寸
font-family、color 以及 font-size 属性分别定义元素中文本的字体系列、颜色和字体尺寸
<html>
<body>
<h1 style="font-family:verdana">A heading</h1>
<p style="font-family:arial;color:red;font-size:20px;">A paragraph.</p>
</body>
</html>
9. HTML 样式实例 - 文本对齐
text-align 属性规定了元素中文本的水平对齐方式
10.HTML链接
**HTML链接分两种,一种是指向本网站的超链接。另一种是指向万维网的链接
- 指向本站的<a href="/index.html">本文本</a> 是一个指向本网站中的一个页面的链接。</p>
- 指向万维网的<p><a href="http://www.baidu.com/">本文本</a> 是一个指向万维网上的页面的链接。</p>