|
|
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:\Users\ghost\Desktop\html\378463.PNG">
<img src="C:\Users\ghost\Desktop\html\627857834.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 |
|
|
QQ群⑧：
窥视卡
雷达卡
发表于 2017-6-21 17:41:14
提升卡
置顶卡
沉默卡
喧嚣卡
变色卡
千斤顶
显身卡