![](https://img-blog.csdnimg.cn/20201014180756927.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
CSS基础知识
文章平均质量分 58
Eara
小小青年要奋斗
展开
-
Relative与Absolute组合使用
Relative与Absolute组合使用1、参照定位的元素必须是相对定位元素的前辈元素:<div id="box1"><!--参照定位的元素--> <div id="box2">相对参照元素进行定位</div><!--相对定位元素--></div>从上面代码可以看出box1是box2的父元素(父元素当然也是前辈元素了)。 2、参照定位的元素必须加入position:relative;#原创 2016-01-21 10:00:39 · 2066 阅读 · 0 评论 -
CSS水平居中
水平居中设置-行内元素 如果被设置元素为文本、图片等行内元素时,水平居中是通过给父元素设置 text-align:center 来实现的。水平居中设置-定宽块状元素 满足定宽和块状两个条件的元素是可以通过设置“左右margin”值为“auto”来实现居中的。水平居中总结-不定宽块状元素方法第一种:第一步:为需要设置的居中的元素外面加入一个 table 标签 ( 包括<tbody> <tr> <t转载 2016-01-21 10:18:49 · 342 阅读 · 0 评论 -
CSS垂直居中
慕课网学习笔记:垂直居中-父元素高度确定的单行文本父元素高度确定的单行文本的竖直居中的方法是通过设置父元素的 height 和 line-height 高度一致来实现的。如下代码:<div class="container"> hi,imooc!</div>css代码:<style>.container{ height:100px; line-height:100px;原创 2016-01-21 10:25:37 · 309 阅读 · 0 评论 -
隐性改变display类型
当为元素(不论之前是什么类型元素,display:none 除外)设置以下 2 个句之一: 1. position : absolute 2. float : left 或 float:right 元素会自动变为以 display:inline-block 的方式显示,当然就可以设置元素的 width 和 height 了且默认宽度不占满父元素。 如下面的代码,小伙伴们都知道 a 标签是原创 2016-01-21 10:30:56 · 324 阅读 · 0 评论 -
网页布局与盒子模型
网页布局布局: 又称为版式布局,是网页UI设计师将有限的视觉元素进行有机的排列组合 网页可以根据显示器(浏览器)宽度自适应 网页的长度从理论上说可以无限分栏又称为分列, 常见布局: 一列布局 二列布局 三列布局 混合布局(*)W3C标准 由万维网联盟指定的一系列标准 倡导结构、表现、行为三者分离标准文档流特点 从上到下 从左到右 输出文档内容 组成成分:块级元素和行级元素(都是盒原创 2016-01-21 10:35:14 · 814 阅读 · 0 评论 -
CSS元素分类与布局模型
伪类选择符 允许给html不存在的标签(标签的某种状态)设置样式 例 :hover 常用块状元素,不设置宽度时默认宽度为父容器的100% 例: 等 内联元素 例: 等 内联块状元素 例: CSS布局模型不同于CSS布局样式或CSS布局模板 1、 流动模型(Flow)默认从左至右按顺序排列 2、 浮动模型(Float) float:left; 3、 层模原创 2016-01-21 09:57:39 · 353 阅读 · 0 评论 -
边距重叠问题
转自http://www.lingdublog.com/51.html与http://www.zhangxinxu.com/study/200908/margin-overlap.html css的盒子模型里是这样规定两个对象之间的距离的:对象之间的间距是由两个对象的盒子模型的最终计算值得出来的,也就是说两个对象之间的间距就是两个对象的距离,但是当遇到两个对象一个有下外边距margin,一个有下转载 2016-01-21 11:31:42 · 871 阅读 · 0 评论