Html 行内标签和块标签
程序员文章站
2022-03-08 18:45:45
...
html一般具有行内标签和块标签
行内标签是指两个行内标签在一起不会分行 比如<strong><a>
标签等
<strong><a href="http://www.baidu.com" target:"_blank">百度一下</strong></a>
<strong><a href="http://www.baidu.com" target:"_blank">百度一下</strong></a>
可以看到,这两个标签在一起并没有换行
而块标签是指一个标签独占一行 比如<div><h1>
等
<div>块标签</div>
<div>块标签</div>
使用块标签可以看到2个标签并没有在同行,而是从上到下的顺序进行排列的
如果块标签要进行像行内标签一样从左到右或是从右到左的排列,就需要使用到浮动 <div style="float:left/right">块标签</div>
<div style="float:left/right">块标签</div>
浮动就是让块标签独占一行的性质消失让内容可以左右排列。
但是浮动需要满足所有浮动的标签不能超过总框的宽度,不然会出现在下一行。
浮动的框不算入行数内的,所以如果不解除浮动在浮动标签后面再写入一个新的框,会导致新的框会把浮动框的样式覆盖
这个时候就需要用到clear:both <div style="clear:both">
一般新建一个框写在浮动的框后面就可以了,这样会让之前浮动的框全部组成一个块标签。之前新写的框也就不会覆盖写过浮动的框而是在浮动完成后的框的下面排序的。