
CSS
文章平均质量分 68
VVVGG
不积跬步无以至千里
展开
-
浮动模型
主要就是这一句话:float: left/right;float:left(向左浮动)float:right(向右浮动)接下来看一段代码:然后接下来更改css样式发现box2层叠上去了,这点是不是和position:absolute很像呢,但是不能那么理解这是由于浮动元素产生了浮动流,所有产生了浮动流的元素,块级元素是看不到他们的,只有产生bfc的元...原创 2018-08-17 22:37:23 · 458 阅读 · 0 评论 -
maring塌陷
父元素设置了margin-top和margin-left,接下来子元素设置margin-left:50px;发现并没有什么问题,然后接下来,再给子元素设置margin-top:50px;发现不起作用,即使你把top设置为150也解决不了问题,只有你的top值大于父元素设置的top值才可以移动 而且会发现子元素连带着父元素一起移动,是因为父...原创 2018-08-17 16:00:24 · 344 阅读 · 0 评论 -
两栏布局
注意要先写有定位属性的元素不然会出现在第二行原创 2018-08-17 15:21:57 · 178 阅读 · 0 评论 -
自己所能理解的CSS(五)
通配符选择器的作用:去掉margin和padding,初始化标签盒模型盒子的组成部分:margin border padding element padding等复合属性的四个方向顺序:4个----顺时针 (上,右,下,左)3个----上,(左,右),下2个----(上,下),(左,右)1个-----(上,下,左,右)如果你这样设置会发现元素和...原创 2018-08-17 15:01:31 · 174 阅读 · 0 评论 -
整理一下CSS知识点
行级元素(inline)内容决定元素所占位置,不可以通过CSS改变宽高span strong a em del块级元素(block)独占一行,可以通过CSS改变宽高div p ul li ol form address行级块元素(inline-block)内容决定大小,可以改变宽高img凡是带有inline属性的元素,都具有文字特性(空格为文本分割符)...原创 2018-08-17 11:32:51 · 253 阅读 · 0 评论 -
自己所能理解的CSS(四)
文字居中:text-align: center;单行文本所占的高度:当单行文本所占的高度和容器的相等就可以做到垂直居中首行缩进:1个em缩进一个字1em = 1 * font-size;由于现在文字都让高度等于宽度,font-size设置文字高度,所以不管字体大小改变,都是会缩进两格中划线:text-decoration: line-thr...原创 2018-08-17 10:52:29 · 159 阅读 · 0 评论 -
自己所能理解的CSS(三)
字体大小:font-size: 12px;(默认16px)设置的是字体的高字体是否加粗:font-weight: bold; (四种选填值:lighter,normal,bold,bolder ;数字:100-200-300-- 900)字体斜体:font-style: italic;字体样式:font-family: cursive;字体颜色:color: #...原创 2018-08-16 17:45:47 · 206 阅读 · 0 评论 -
自己所能理解的CSS(二)
继续上一篇的CSS选择器:1、父子选择器/派生选择器同理,也可以进行拓展并且父子选择器中的每一个层级,都不一定要是标签,可以是id或者class说明父子选择器中层级之间如果是以空格隔开,说明从当前层级以下的所有层级都被赋予效果,即子节点,子孙节点都被选中2、直接子元素选择器只有直接子节点被选中浏览器根据父子选择器选择元素的方向:...原创 2018-08-16 16:45:54 · 342 阅读 · 0 评论 -
自己所能理解的CSS(一)
CSS----cascading style sheet(层叠样式表)先将一下引入CSS样式表的方式:1、行间引入2、页面级CSS需要在head中引入style,并在style中设置样式3、外部CSS引入这里再讲一下计算机的同步和异步:(和正常的理解正好相反)同步:不同时进行;异步:同时进行;当浏览器加载页面到link时,会另外开启一个线程去下载li...原创 2018-08-16 14:39:00 · 197 阅读 · 0 评论 -
css补充要点说明
1:margin:0 auto;自适应居中在你缩小浏览器宽度的时候,会先缩小外部容器的长度,然后再缩小内部容器的长度,并且在这个过程中,内部容器始终居中2,之前有过说明行级元素,块级元素,行级块元素的区别,再说一下,行级元素:元素的大小随元素的内容大小而变化,不可以通过css改变其宽高,例如:span,a,strong,em,del块级元素:独占一行,可以通...原创 2018-08-18 14:33:45 · 268 阅读 · 2 评论 -
标签的嵌套
嵌套原则:行级元素只能嵌套行级元素块级元素可以嵌套任何元素但是有个特例,下面看例子:p标签是块级元素,div也是块级元素但是p标签不能嵌套div会神奇的发现,p标签被分割成了两部分第二个特例:a标签不能套a标签(傻了嘛)...原创 2018-08-18 13:55:30 · 414 阅读 · 0 评论 -
背景图片处理
1,在图片大小没有容器大时,是否确定重复放置可填值:no-repeat repeat repeat-x repeat-y2,看下面的图片上面的淘宝网是一个图片,也是一个连接,那么我们自己做一下点击之后能正常跳转,但是,但是在某些情况下,比如你的网速很慢,只有10k,20k,那么浏览器是不会加载css和js等文件,现在我们把css去掉发现什么都没了,也...原创 2018-08-18 13:49:43 · 525 阅读 · 0 评论 -
溢出文本处理
1,单行文本溢出处理:处理方法:首先让p标签失去换行的功能然后再让溢出部分隐藏然后再设置溢出部分用...表示一共就3句话: white-space: nowrap; overflow: hidden; text-overflow: ellipsis;2,多行文本多行文本一般只做截断,不做打点...原创 2018-08-18 12:54:10 · 366 阅读 · 0 评论 -
flex布局初探
dom结构1,左上2,中上3,右上4,左中5,中间6,右中7,左下8,中下9,右下------------------------------------------------------------------------------flex-direction ---决定主...原创 2018-09-12 15:22:07 · 432 阅读 · 0 评论