浮动

问题:子元素设置了float后,脱离父元素,导致父元素无法撑开?(也就是子元素的高度没有过渡到父元素)

例子:

检查元素的效果:

(三种)常用的解决办法:

1》额外标签法,添加一个空的div(在最后一个标签后面,新加一个<div></div>,给其设置clear:both)(常用)

2》父元素增加overflow属性(这个用的比较少,因为正常功能会受到影响)

3》使用after伪类元素清除浮动(添加在css上,html上没加内容)(推荐)

前端面试题常考&必考之--清除浮动的方法的更多相关文章

  1. 前端面试题常考&必考之--用jquery写出当前元素的同辈元素的第二个结点的value值

    问题:用jquery写出当前元素的同辈元素的第二个结点的value值??? 分析:该题目有一个坑,那就是,如果当前元素没有第二个兄弟结点呢(坑坑坑) 解析: 一般我们可能会这样写: $(this).s ...

  2. 前端面试题常考&必考之--跨域的解决办法

    1.为啥出现跨域??? 在制定Html规则时,为了安全的考虑,一个源的脚本(网页,网站)不能与另一个源的资源进行交互, 所以就引发一个词叫做“同源策略”. 同源策略:同源策略是一种约定,它是浏览器最核 ...

  3. 前端面试题常考&必考之--http中的post和get的区别

    从字面上看,post是发送,则是提交数据,get是获得,则是获取数据,没毛病,我们可以就按字面来理解 具体就看图吧 吐槽:插入的表格不好用,不知道是自己不会用还是真不好用,变成了截图,修饰了下子

  4. 前端面试题常考&必考之--盒子模型和box-sizing(项目中经常使用)

    主要考察width的值,包括padding\border\content等属性??? box-sizing属性是css3特有的哦*** 1>当box-sizing:content-box;时,跟 ...

  5. 前端面试题-几个很实用的BOM属性对象方法?

    什么是Bom? Bom是浏览器对象.有哪些常用的Bom属性呢? (1)location对象 location.href-- 返回或设置当前文档的URL location.search -- 返回URL ...

  6. 整理的最全 python常见面试题(基本必考)

    整理的最全 python常见面试题(基本必考) python 2018-05-17 作者 大蛇王 1.大数据的文件读取 ① 利用生成器generator ②迭代器进行迭代遍历:for line in ...

  7. 史上最全前端面试题(含答案)-A篇

    HTML+CSS1.对WEB标准以及W3C的理解与认识标签闭合.标签小写.不乱嵌套.提高搜索机器人搜索几率.使用外 链css和js脚本.结构行为表现的分离.文件下载与页面速度更快.内容能被更多的用户所 ...

  8. 前端面试题总结(js、html、小程序、React、ES6、Vue、算法、全栈热门视频资源)

    写在前面 参考答案及资源在看云平台发布,如果大家想领取资源以及查看答案,可直接前去购买.一次购买永久可看,文档长期更新!有什么意见与建议欢迎您及时联系作者或留言回复! 文档描述 本文是关注微信小程序的 ...

  9. 金三银四,磨砺锋芒;剑指大厂,扬帆起航(2020年最全大厂WEB前端面试题精选)上

    金三银四,磨砺锋芒:剑指大厂,扬帆起航(2020年最全大厂WEB前端面试题精选)上 引言 元旦匆匆而过,2020年的春节又接踵而来,大家除了忙的提着裤子加班.年底冲冲冲外,还有着对于明年的迷茫和期待! ...

随机推荐

  1. Python学习之==>函数

    一.函数是什么: 函数是指将一组语句的集合通过一个名字(函数名)封装起来,要想执行这个函数,只需要调用函数名就行. 二.函数的作用: 1.简化代码 2.提高代码的复用性 3.代码可扩展 三.定义函数: ...

  2. Delphi 判断按键状态

    Delphi 判断按键状态 http://blog.sina.com.cn/s/blog_54da9cc001015di1.html (2012-04-05 14:22:50) 标签: 杂谈 分类:  ...

  3. jupyter 服务器安装随笔

    python3:python3 -m pip install --upgrade pip python3 -m pip install jupyterpkg install py36-pyzmq-18 ...

  4. 每次进步一点点——linux expect 使用

    1. 介绍 expect是建立在tcl(参见:Tcl/Tk快速入门 )基础上的一个工具,它可以让一些需要交互的任务自动化地完成.相当于模拟了用户和命令行的交互操作. 一个具体的场景:远程登陆服务器,并 ...

  5. pycharm2018.2安装

    1.官网下载安装包 https://www.jetbrains.com/pycharm/download/#section=windows (下载2018.2版本,进行破解) 2.参考其他博主安装破解 ...

  6. linux常用终端指令+如何用vim写一个c程序并运行

    在装好ubuntu之后今天学习了一些linux的一些基础知识: windows里面打开命令窗口是win+r,在linux系统里面,ctrl+alt+t打开终端,今天的一些指令都是围绕终端来说的 首先s ...

  7. 20191127 Spring Boot官方文档学习(9.1-9.3)

    9."使用方法"指南 9.1.Spring Boot应用程序 9.1.1.创建自己的FailureAnalyzer FailureAnalyzer被包装在FailureAnalys ...

  8. 磁盘管理|df、du|分区 fdisk |格式化

    3.磁盘管理 3.1命令df ·用于查看已挂载磁盘的总容量,使用容量,剩余容量等. -i:查看inodes的使用情况 -h:使用合适的单位显示 -k:以KB为单位显示 -m:以MB为单位显示 3.1. ...

  9. [集合]HashMap和Hashtable区别

    底层 哈希算法,双列集合 HashMap 线程不安全,效率高,JDK1.2版本    Hashtable 线程安全,效率低,JDK1.0版本 HashMap 可以存储 null 键和 null 值   ...

  10. FreeIPA部署及基本使用

    FreeIPA是一个集成安全信息管理解决方案,FreeIPA服务器通过存储管理计算机网络安全方面所需的用户.组.主机和其他对象的数据,提供集中的身份验证.授权和账户信息.结合了Linux.Direct ...