摘要: margin塌陷问题 当时说到了盒模型,盒模型包含着margin,为什么要在这里说margin呢?因为元素和元素在垂直方向上margin里面有坑。 我们来看一个例子: html结构: css样式: 当给两个标准流下兄弟盒子 设置垂直方向上的margin时,那么以较大的为准,那么我们称这种现象叫塌陷。 阅读全文
posted @ 2018-05-25 20:48 Coca-Mirinda 阅读(149) 评论(0) 推荐(0) 编辑
摘要: 学习的初期,我们就要知道,标准文档流等级森严。标签分为两种等级: 行内元素 块级元素 比如h1标签和span,同时设置宽高,来看浏览器效果,那么你会发现: 行内元素和块级元素的区别:(非常重要) 行内元素: 与其他行内元素并排; 不能设置宽、高。默认的宽度,就是文字的宽度。 块级元素: 霸占一行,不 阅读全文
posted @ 2018-05-25 20:47 Coca-Mirinda 阅读(120) 评论(0) 推荐(0) 编辑
摘要: 边框 border:边框的意思,描述盒子的边框 边框有三个要素: 粗细 线性样式 颜色 如果颜色不写,默认是黑色。如果粗细不写,不显示边框。如果只写线性样式,默认的有上下左右 3px的宽度,实体样式,并且黑色的边框。 按照3要素来写border 按照方向划分 上面12条语句,相当于 bordr: 1 阅读全文
posted @ 2018-05-25 20:46 Coca-Mirinda 阅读(131) 评论(0) 推荐(0) 编辑
摘要: 博客园 首页 新随笔 联系 订阅 管理 博客园 首页 新随笔 联系 订阅 管理 13-标准文档流 什么是标准文档流 宏观的将,我们的web页面和ps等设计软件有本质的区别,web 网页的制作,是个“流”,从上而下 ,像 “织毛衣”。而设计软件 ,想往哪里画东西,就去哪里画 标准文档流下 有哪些微观现 阅读全文
posted @ 2018-05-25 20:46 Coca-Mirinda 阅读(168) 评论(0) 推荐(0) 编辑
摘要: padding padding:就是内边距的意思,它是边框到内容之间的距离 另外padding的区域是有背景颜色的。并且背景颜色和内容的颜色一样。也就是说background-color这个属性将填充所有的border以内的区域 padding的设置 padding有四个方向,分别描述4个方向的pa 阅读全文
posted @ 2018-05-25 20:45 Coca-Mirinda 阅读(168) 评论(0) 推荐(0) 编辑
摘要: 边框 border:边框的意思,描述盒子的边框 边框有三个要素: 粗细 线性样式 颜色 如果颜色不写,默认是黑色。如果粗细不写,不显示边框。如果只写线性样式,默认的有上下左右 3px的宽度,实体样式,并且黑色的边框。 按照3要素来写border 按照方向划分 上面12条语句,相当于 bordr: 1 阅读全文
posted @ 2018-05-25 20:45 Coca-Mirinda 阅读(133) 评论(0) 推荐(0) 编辑
摘要: 伪类选择器一般会用在超链接a标签中,使用a标签的伪类选择器,我们一定要遵循"爱恨准则" LoVe HAte 1 /*没有被访问的a标签的样式*/ 2 .box ul li.item1 a:link{ 3 4 color: #666; 5 } 6 /*访问过后的a标签的样式*/ 7 .box ul l 阅读全文
posted @ 2018-05-25 20:42 Coca-Mirinda 阅读(117) 评论(0) 推荐(0) 编辑
摘要: 属性选择器,字面意思就是根据标签中的属性,选中当前的标签。 语法: 阅读全文
posted @ 2018-05-25 20:41 Coca-Mirinda 阅读(120) 评论(0) 推荐(0) 编辑
摘要: 高级选择器:后代选择器、子代选择器、并集选择器、交集选择器。 后代选择器 使用空格表示后代选择器。顾名思义,父元素的后代(包括儿子,孙子,重孙子) 1 .container p{ 2 color: red; 3 } 4 .container .item p{ 5 color: yellow; 6 } 阅读全文
posted @ 2018-05-25 20:40 Coca-Mirinda 阅读(154) 评论(0) 推荐(0) 编辑
摘要: css的选择器:1.基本选择器 2.高级选择器 基本选择器包含: 1.标签选择器标签选择器可以选中所有的标签元素,比如div,ul,li ,p等等,不管标签藏的多深,都能选中,选中的是所有的,而不是某一个,所以说 "共性" 而不是 ”特性“ body{ color:gray; font-size: 阅读全文
posted @ 2018-05-25 20:37 Coca-Mirinda 阅读(162) 评论(0) 推荐(0) 编辑