<!-- h1~h6标签 --> <h1>h1</h1> <h2>h2</h2> <h3>h3</h3> <h4>h4</h4>
<h5>h5</h5> <b>b:我里面的字体会变粗的</b><!-- 字体加粗标签 -->
<p>(p:段落标签，块级元素，独占一行)坚决打赢脱贫攻坚战，
让贫困人口和贫困地区同全国一道进入全面小康社会是我们党的庄严承诺。
党的十八大以来，习大大总书记的扶贫足迹遍布全国，对坚决打</p >
<br><!-- 换行标签 --> <br> <strong>（strong：加粗强调标签）php中文网</strong><!-- 加粗强调标签
strong 更具有语义化，对搜索引擎优化更友好--> <i>i：坚决打赢脱贫攻坚战</i> <em>em：定义着重字</em>
<del>del：定义删除字标签</del> <s>s：对搜索引擎优化更友好</s> <br> <pre>预格 式化 文本</pre>
<!-- 内部换行是可以输出的 --><!-- 空格也可以输出 -->
<p style="background: pink;width: 100px;height: 100px;">我是块级元素哦</p >
<!-- 块级元素： div h1~h6 p 独占一行的,自带换行符,默认宽度100%,对宽高属性值设置生效
<!-- 行内块元素：结合了块级以及行内的特点 -->
<!-- 行内块级相互转换: display:inline 讲块级元素转换为行内元素 display: inline-block 讲块级元素转换为行内块元素
display: block 讲行内元素转换为块级元素 -->
<div style="width: 100px;height: 100px;background: pink;display: inline;">块级转行内元素display:inline</div>
<div style="width: 100px;height: 100px;background: pink;display: inline-block;">块级元素转行内块元素display: inline-block</div>
<span style="width: 100px;height: 100px;background: pink;display: block;">内元素转换为块级元素display: block</span>
<span style="width: 100px;height: 100px;background: pink;display: inline-block;">行内元素转行内块元素display: inline-block;</span>
<span style="width: 100px;height: 100px;background: pink;display: inline-block;">行内元素转行内块元素display: inline-block;</span>
<h1 class="title">PHP中文网</h1> <br> <!-- 谷歌logo -->
<span class="logo" style="color: #0085FF;">G</span>
<span class="logo" style="color: rgb(246,26,35);">o</span>
<span class="logo" style="color: #FCE80F;">o</span>
<span class="logo" style="color: #0487F9;">g</span>
<span class="logo" style="color: #3EFF18;">l</span>
<span class="logo" style="color: #FF1428;">e</span>
<br> <!-- 图文混排 -->
<p class="imghp" style="width: 200px;height: 200px;display: inline-block;">
行内块级相互转换: <br> display:inline
讲块级元素转换为行内元素 <br> display: inline-block 讲块级元素转换为行内块元素
<br> display: block 讲行内元素转换为块级元素 </p >
<b class="hover">hover鼠标放上出，触发事件，隐藏部分文字，鼠标放上去，内容不会被修剪，元素会被呈现在元素框外</b>
</body> </html>
