• 技术文章 >web前端 >html教程

    html中的clear是什么意思

    醉折花枝作酒筹醉折花枝作酒筹2021-06-07 14:49:44原创65

    在html中,clear的意思是清除,只需要给浮动元素设置“clear:属性值”即可。clear属性定义了元素的哪边不允许出现浮动元素。会在元素外边距之上增加清除空间,而外边距本身并不改变。

    本教程操作环境:windows7系统、CSS3&&HTML5版、Dell G3电脑。

    css中clear的作用是清除元素的浮动效果。

    在 CSS1 和 CSS2 中,这是通过自动为清除元素(即设置了 clear 属性的元素)增加上外边距实现的。在 CSS2.1 中,会在元素上外边距之上增加清除空间,而外边距本身并不改变。

    不论哪一种改变,最终结果都一样,如果声明为左边或右边清除,会使元素的上外边框边界刚好在该边上浮动元素的下外边距边界之下。

    clear属性值:

    left 在左侧不允许浮动元素。

    right 在右侧不允许浮动元素。

    both 在左右两侧均不允许浮动元素。

    none 默认值。允许浮动元素出现在两侧。

    inherit 规定应该从父元素继承 clear 属性的值。

    示例:

    <html>
      <head>
        <style type="text/css">
          div {
            float: left;
            margin: 20px;
          }
          .three{
            clear: both;
          }
        </style>
      </head>
      <body>
        <div>
          <img src="images/1.jpg" />
        </div>
        <div>
          <img src="images/2.jpg" />
        </div>
        <div class="three">
          <img src="images/3.jpg" />
        </div>
      </body>
    </html>

    效果:

    YS_H_7PJ)4ASJ%BCK{{V)$O.png

    推荐学习:html视频教程

    以上就是html中的clear是什么意思的详细内容,更多请关注php中文网其它相关文章!

    声明:本文原创发布php中文网,转载请注明出处,感谢您的尊重!如有疑问,请联系admin@php.cn处理
    专题推荐:html clear
    上一篇:html如何实现播放和暂停 下一篇:html如何修改日期样式
    第16期线上培训班

    相关文章推荐

    • html有序列表怎么弄自定义• runat在html中表示什么意思• eclipse怎么设置html快捷键• HTML文档中第一个有效标记是什么• HTML格式文件怎么导入SQL

    全部评论我要评论

  • 取消发布评论发送
  • 1/1

    PHP中文网