一、p标签和h标签在源代码中的换行
<p>标签以及<h1>…标签都是自带换行的标签,及当两个相同标签并排时,网页效果也会是换行处理
例:
<html>
<body>
<h2>这是段落。</h2><h2>这是段落。</h2><h2>这是段落。</h2><h2>这是段落。</h2>
<h2>这是段落。</h2>
<p>这是段落。</p><p>这是段落。</p><p>这是段落。</p><p>这是段落。</p>
<p>这是段落。</p>
<p>这是段落。</p>
<p>这是段落。</p>
<p>段落元素由 p 标签定义。</p>
</body>
</html>
效果如图:
可见<h2>标签和<p>标签的换行效果和其在源代码中是否换行无关。其标签自带换行效果
二、i标签和b标签在源代码中的换行效果
例:
<html>
<body>
<i>换行效果</i><i>换行效果</i><i>换行效果</i><i>换行效果</i>
<i>换行效果</i>
<i>换行效果</i>
<p>这是i标签和b标签分割符</p>
<b>换行效果</b>
<b>换行效果</b>
<b>换行效果</b>
<b>换行效果</b><b>换行效果</b><b>换行效果</b><b>换行效果</b><b>换行效果</b>
</body>
</html>
效果如图:
可见i标签与b标签的源代码内换行不会造成换行效果,但是会产生空格。
总结:p标签与h标签自带换行效果,代码内换行对展示效果没有影响
i标签与b标签没有自带换行效果,代码内换行会导致两个标签展示内容之间会出现一个空格,
三、<hr>标签的分割线作用
例:
<html>
<body>
<b>展示hr标签的分割线作用</b><br/>
<i>我和你是一排的<hr>你和我是一排的<i>
</body>
</html>