美文网首页
11.21 前端学习

11.21 前端学习

作者: BaiBao丶 | 来源:发表于2018-11-23 00:11 被阅读0次

内联元素的盒模型

可以设置水平方向的内边距和边框
也支持水平方向的外边距但不支持垂直的外边距
内联元素不支持宽和高

visibility和display

display:none ;(此元素不会显示)
display:block;(将内联元素转成块元素)
visibility:hidden;(元素会消失)

visibility+hidden和display+none的区别:

使用display+none,元素消失后不会再占用面积,而visibility+hidden,元素消失后还会占用面积.
overflow(溢出)

超出父元素的内容叫溢出的内容
如何处理溢出的内容:hidden修剪,并且其余内容使不可见
scroll:滚动条
auto:自动添加滚动条

文档流

最基础的一层,文档就是网页,每一个网页就是一个文档
块元素在文档流中如果设置宽和高就默认为设置的宽和高,设置padding会影响盒子的大小,如果没设置宽就默认父元素宽的100%,高的话是由内容决定,内容有多高,它就有多高
内联元素只占自身的宽和高

浮动

可选值:float:none不浮动
float:left左浮动
float:right右浮动
内联浮动
所有的内联元素如果脱离文档流就会变成块元素,内联元素是不支持宽和高,如果变成块元素就会生效。

高度塌陷

本来父元素是由子元素抻开的,子元素设置了浮动之后,子元素就脱离文档流了,父元素无法抻开,就会形成高度塌陷
解决方法
BFC
父元素的垂直外边距不会和子元素重叠
开启BFC的元素不会被浮动元素所覆盖
开启BFC的元素可以包含浮动的子元素
兼容IE用haslayout zom:1;

相关文章

  • 11.21 前端学习

    内联元素的盒模型 可以设置水平方向的内边距和边框也支持水平方向的外边距但不支持垂直的外边距内联元素不支持宽和高 v...

  • 11.21学习日志

    关于vim的使用 如何commit 下午的布局的n种方法,蕾蕾分享了六种水平居中样式,分别是设定行内块元素、flo...

  • 11.21学习总结

    继续完善程序,要抓紧了

  • 11.21学习总结

    我的项目所有的东西已经基本完成,接下来就是制作PPT了,在这方面是我的弱项,因为在这方面的练习很少,制作的PPT...

  • 胃疼的敦煌

    11.21

  • 每日一画48

    11.21

  • 学习论语第5⃣️6⃣️天

    学习《论语》第️️56天 学习内容: 11.20 子张问善人之道。子曰:“不践迹,亦不入于室。” 11.21 子曰...

  • HTML学习笔记--11.21

    一、html代码 二、html标签 三、html页面预览

  • 无标题文章

    #Web前端 - web前端是什么 - 定义 - 职责 - web前端基础知识和学习路线 - web前端学习的...

  • 【笔记】11.21 前端的兼容性

    1.案例1 问题原因:子级的宽度会撑开父级设置好的宽度 解决方案:将子级的宽度设置小于父级元素的宽度 盒模型一定...

网友评论

      本文标题:11.21 前端学习

      本文链接:https://www.haomeiwen.com/subject/sohdqqtx.html