html&css
狂兔
这个作者很懒,什么都没留下…
展开
-
CSS 样式优先级
CSS 样式优先级在html css的学习中 当一个标签有多种样式时 它该如何选择呢 ?我总结了一下:(可以根据以下方法按照1. 2. 3.先后顺序 来判断CSS 样式的优先级)1)!important !important 的属性拥有最高优先级。!important 用法 ( 写于属性分号前面,多项亦是如此 )p { background: red !i...原创 2018-06-10 14:50:24 · 373 阅读 · 0 评论 -
CSS盒子塌陷问题的讨论
什么是盒子塌陷 ? 理论上在父元素内部的元素 出现在盒子外部出现原因? 一个父亲不能被自己浮动的儿子,撑出高度。 当父元素未设置(足够)高度的时候,子元素设置了浮动的属性时,子元素就会跳出父元素的边界(脱离文档流)。 (当父元素的高度为auto时,而父元素中又没有其它非浮动的可见元素时,父盒子的高度就会直接塌陷为零, 我们称这是CSS高度塌陷。)(如图:子元素设置浮动 导致父元素塌...原创 2018-06-18 21:42:53 · 967 阅读 · 1 评论 -
margin 塌陷及合并问题
margin塌陷问题:以父子关系结合的两个元素,在垂直方向上margin会粘合在一起,外层盒模型的margin-top取两个元素中margin-top较大的值。正常的情况下内层元素是相对于外层元素进行移动,发生margin塌陷时内层元素却相对于整个文档进行移动。margin塌陷问题例子演示如下:设置一个父元素div套一个子元素div (父元素边框100px 子元素边框50px...原创 2018-06-24 15:45:46 · 781 阅读 · 0 评论 -
css-经典三栏布局
float布局左右两边固定,中间自适应。.left{ width: 100px; height: 200px; background-color: yellow; float: left;}.right{ width: 100px; height: 200px; background-color: pink; float:...原创 2018-09-15 21:00:16 · 173 阅读 · 0 评论 -
CSS3-flex布局
内容:设置弹性容器:display:flex/inline-flex;,它的所有子元素自动成为弹性子元素弹性容器外 弹性子元素内正常渲染。(弹性盒子只定义了弹性子元素如何在弹性容器内布局)通常情况下默认每个容器只有一行,弹性子元素在弹性盒内一行显示。设置flex布局以后,子元素的float 、 clear 、 vertical-align属性将失效。 容器存在两个轴:水平的主轴...原创 2018-09-06 21:13:50 · 676 阅读 · 0 评论