html学习笔记(1)

一、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>

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值