HTML ，即Hyper Text Markup Language 超文本标记语言；
文本：纯字符，如window中的txt文本
超文本：在纯文本中嵌入样式，图片，音频，视频，链接等内容
HTML的基本结构：
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
</body>
</html>
HTML元素类型：
(1) 区块元素：
- 每个块级元素都从新的一行开始，并且其后的元素也要另起一行。（一个块级元素独占一行）。
- 元素的高度、宽度、行高以及顶和底边距都可设置。
- 元素宽度在不设置的情况下，是它本身父容器的100%（和父元素的宽度一致），除非设置了宽度
(2) 内联元素：
- 和其他元素都在同一行；
- 元素的高、宽、行高以及边距均不可设置
- 元素的高、宽均取决于它包含的文字或图片的大小
(3) 内联块：
- 和其他元素在同一行；
- 元素的高度、宽度、行高及边距可以设置
注意：元素的类型是可以改变的，通过display属性设置。
例如：
以下代码和图片的差别揭露不同类型标签元素之间的区别
|
<!DOCTYPE html> <html> <head> <meta charset=U"utf-8"> <title></title> <style> strong,em,a,img{ display:block; } h1,h2,p,hr,ul,ol,dl{ display: inline; } </style> </head> <body> <strong>天下无双</strong><strong>天下无双</strong> <em>海天一线</em><em>海天一线</em> <h1>永无止尽</h1><h1>永无止尽</h1> <h2>天涯海角</h2><h2>天涯海角</h2> <p>越狱</p><p>越狱</p> <hr><hr> <a>蓝天白云</a><a>蓝天白云</a> <img src="C:UsersghostDesktophtml378463.PNG"> <img src="C:UsersghostDesktophtml627857834.PNG"> <br><br> <ul><li>透破天幕</li></ul><ul><li>透破天幕</li></ul> <ol><li>接下黑暗的幕布</li></ol><ol><li>接下黑暗的幕布</li></ol> <dl> <dt>电脑</dt> <dd>联想</dd> <dd>惠普</dd> <dt>手机</dt> <dd>小米</dd> <dd>苹果</dd> </dl> <details> <summary></summary> </details> <details> <summary>123</summary> 天涯海角共几何，只为青山缘始终。 </details> </body> </html> |
未控制样式，各标签的默认显示方式，如图1
图1
是它们的显示样式相反，如图2
图2