bootstrap清除浮动的类名是什么

bootstrap中清除浮动的类名是clearfix;clearfix是bootstrap中的一个辅助类,可以通过将“.clearfix”添加到父元素的方式来轻松清除浮点数,语法为“”。

bootstrap清除浮动的类名是什么

本教程操作环境:Windows10系统、bootstrap3.3.7版、DELL G3电脑

bootstrap清除浮动的类名是什么

我们知道,在静态页面的编写中,清除浮动是一件很繁琐的事情。

所以一般的CSS框架都会有用来清除浮动的样式。

在bootstrap中,这个样式叫 clearfix.

只要在需要清除浮动的元素的父元素加上clearfix就可以了。

Clearfix用于通过将.clearfix添加到父元素来轻松清除浮点数

语法类似:

...

登录后复制

示例如下:

新建一个html文件,命名为test.html,用于讲解bootstrap中清除浮动使用哪个类。使用link标签加载bootstrap.min.css文件。

在div标签内,再使用div创建两行文字。给外层div添加class属性,并通过class设置它的宽度为350px,高度为100px,背景颜色为灰色。

在内层两个div之前,再添加一个div,并给它添加清除浮动类名clearfix,实现上下两个div的浮动相互不影响。

nbsp;html>                Document                .mytest{            width:400px;            height:50px;            background:#ccc;        }        
        
测试一
        
        
测试二
    

登录后复制

在浏览器打开test.html文件,查看实现的效果。

30.png

相关推荐:bootstrap教程

以上就是bootstrap清除浮动的类名是什么的详细内容,更多请关注【创想鸟】其它相关文章!

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至253000106@qq.com举报,一经查实,本站将立刻删除。

发布者:PHP中文网,转转请注明出处:https://www.chuangxiangniao.com/p/2931419.html

(0)
上一篇 2025年3月11日 20:09:27
下一篇 2025年3月11日 20:09:38

AD推荐 黄金广告位招租... 更多推荐

相关推荐

  • bootstrap怎么让div隐藏

    在bootstrap中,可以利用设置div的类名来让div隐藏,使用hidden类名可以让div元素隐藏不可见,使用show类名可以让隐藏的div变成可见,语法为“div的内容”。 本教程操作环境:Windows10系统、bootstrap…

    2025年3月11日
    000
  • bootstrap中有弹出层吗

    bootstrap中有弹出层;可以利用Popover插件来实现弹出层,该插件可以根据要求生成指定的内容和标记,将生成的内容放置在指定元素触发的弹出框中,启用弹出框的语法为“元素对象.popover(options)”。 本教程操作环境:Wi…

    2025年3月11日
    200
  • bootstrap是国内开发的吗

    bootstrap不是国内开发的,而是美国Twitter公司的设计师“Mark Otto”和“Jacob Thornton”开发的;Bootstrap是基于HTML、css、JavaScript开发的用于快速开发web应用程序和网站的前端框…

    2025年3月11日
    200
  • 什么是bootstrap自适应

    在bootstrap中,自适应指的是根据屏幕大小把设备分为超小屏幕、中屏幕、中等屏幕、大屏幕四种,网页会根据设备屏幕不同,将网页分为12列,将浏览器以行列形式去划分实现自适应;自适应不管屏幕有多大,都尽量不换行,只是横向缩放。 本教程操作环…

    2025年3月11日
    200
  • 什么是bootstrap响应式

    在bootstrap中,响应式是指同一个页面在不同屏幕尺寸下有着不同的布局,可以兼容不同分辨率的设备,响应式web设计就是让用户通过各种尺寸的设备浏览网站获得良好的视觉效果的方法,可以利用栅格系统,将一行平均分成12个格子来实现。 本教程操…

    2025年3月11日
    200
  • 什么是bootstrap栅格化

    在bootstrap中,栅格化指的是将浏览器的一行分为12列,根据开发的页面需要再去分配相应元素所占据的列宽;也即根据设备的尺寸进行分段,每段宽度固定,通过百分比和媒体查询实现响应式布局。 本教程操作环境:Windows10系统、boots…

    2025年3月11日 编程技术
    200
  • bootstrap是免费的吗

    bootstrap是免费的;bootstrap是美国Twitter公司的设计师“Mark Otto”和“Jacob Thornton”合作基于HTML、CSS、JavaScript 开发的简洁、直观、强悍的前端开发框架,开发完成后在2011…

    2025年3月11日
    200
  • Bootstrap是web容器吗

    Bootstrap不是web容器;web容器是一种服务程序,在服务器一个端口就有一个提供相应服务的程序,web容器就是处理从客户端发出的请求,而Bootstrap是一个用于快速开发Web应用程序和网站的前端框架。 本教程操作环境:Windo…

    2025年3月11日
    200
  • bootstrap中caret代表什么

    在bootstrap中,caret代表三角符号图标;为元素添加“caret”类,就会给元素赋予一个三角符号图标,用来指示指定的元素具有下拉菜单的功能,并且在向上弹出的菜单中,三角符号会自动反向显示,语法为“”。 本教程操作环境:Window…

    2025年3月11日
    200
  • bootstrap的模态框在哪是什么

    bootstrap的模态框是覆盖在父窗体上的,是一个子窗体;模态框的目的是显示来自一个单独的源内容,可以在不离开父窗体的情况下有一些互动,子窗体可以提供信息交互等等,可以通过添加“.modal-sm”类来创建一个小模态框,添加“.modal…

    2025年3月11日
    200

发表回复

登录后才能评论