前端css
AnyBisks
五年开发工作经验
展开
-
CSS选择器
CSS选择器学习原创 2017-11-11 14:03:04 · 538 阅读 · 0 评论 -
CSS样式(元素包含规范、规避脱标流、浮动盒子居中显示、图片和文字垂直居中对齐)
CSS样式(元素包含规范、规避脱标流、浮动盒子居中显示、图片和文字垂直居中对齐) /* 标签包含规范 *◆div可以包含所有的标签。 *◆p标签不能包含div h1等标签。 *◆h1可以包含p,div等标签 。 *◆行内元素尽量包含行内元素,行内元素不要包含块元素。 */ /* 规避脱标流 *◆尽量使原创 2017-12-17 22:05:38 · 1114 阅读 · 0 评论 -
CSS样式之position定位
CSS样式之position定位1.静态定位(static)2.绝对定位(absolute)3.相对定位(relative)4.固定定位(fixed) .box { height: 100px; width: 100px; background: red; /*position定位:定位方向left || righ原创 2017-12-17 17:31:36 · 560 阅读 · 0 评论 -
CSS样式之overflow属性
CSS样式之overflow属性1.CSS样式之overflow属性 div { height: 50px; width: 100px; float: left; } /*overflow属性; * visible:默认属性,内容不会被修剪,直接在元素框外面显示 * hidden:内容会被修剪,原创 2017-12-15 17:38:50 · 654 阅读 · 0 评论 -
CSS样式之去除浮动
CSS样式之去除浮动 body{ margin: 0px; padding: 0px; } .box{ width: 600px; height: 600px; margin: 20px auto; } .title{ height: 100px; background: pa原创 2017-12-15 14:15:56 · 384 阅读 · 0 评论 -
CSS样式之浮动
CSS样式之浮动 1.浮动2.清除浮动 /* * 文档流(标准流) * 元素自上而下,自左而右,块元素独占一行,行内元素在一行上显示,碰到父集元素的边框换行 */ body,ul,li{ margin: 0px; padding: 0px; } li { list-style:原创 2017-12-15 11:45:09 · 399 阅读 · 0 评论 -
CSS样式(边框边距)
CSS样式(边框边距)1.边框2.边距 body { text-align: center; background-color: gainsboro; } .box { width: 960px; height: 600px; background-color: bisque;原创 2017-12-04 22:02:10 · 2545 阅读 · 0 评论 -
CSS样式之行高
CSS样式之行高 /* * 浏览器默认文字大小:16px * 行高=文字高度+上下边距 * 行高:是基线与基线之间的距离 * 一行文字行高和父元素高度一致的时候,垂直居中显示。 * * 行高的单位 文字大小 值 * 20px 20px 20px * 2em 20px 40px原创 2017-12-04 15:20:49 · 1587 阅读 · 0 评论 -
CSS样式之背景样式
CSS样式之背景样式1.背景颜色2.背景图片3.背景图片的偏移4.背景图片的定位5.背景样式的属性连写 背景属性的学习 .box { /*背景颜色*/ background-color: darkgoldenrod; /*背景图片*/ background-image: url(../../img/2.p原创 2017-12-04 13:06:29 · 549 阅读 · 0 评论 -
CSS样式(样式表的三个特性)
CSS样式(样式表的特性)1.样式表的层叠性2.样式表的继承性3.优先级 /* * 样式表的层叠性:样式的覆盖 (eg:box2的背景颜色黄色把box1的背景颜色红色覆盖 ) * * 总结:当多个样式作用于同一个(同一类)标签时,样式发生了冲突, * 总是执行后边的代码(后边代码层叠前边的代码)。原创 2017-12-02 19:50:00 · 1841 阅读 · 0 评论 -
CSS样式(块级元素、行内元素、行内块级元素以及转换)
CSS样式(块级元素、行内元素、行内块级元素以及转换) 元素描述 <!-- 块级元素 典型代表:Div,h1-h6,p,ul,li 特点:1.独占一行 2.可以设置宽高 3.嵌套(包含)下,子块元素宽度(没有定义情况下)和父块元素宽度默认一致。 --> 我是p1 <原创 2017-12-01 16:36:38 · 17220 阅读 · 0 评论 -
CSS选择器状态伪类
CSS选择器状态伪类CSS选择器状态伪类/*状态伪类:可用的元素*/:enabled { border-radius: 4px; background-color: white; font-size: 16px; color: brown;}/*状态伪类:不可用的元素*/:disabled { background-color: blueviolet; border原创 2017-11-20 22:26:37 · 746 阅读 · 0 评论 -
CSS否定伪类
CSS否定伪类css否定伪类html代码 伪类选择器 姓名: 登录名: 密码: 性别: 请选择 男 女原创 2017-11-20 22:06:02 · 650 阅读 · 0 评论 -
CSS伪类选择器(结构伪类)
CSS伪类选择器(结构伪类)CSS伪类选择器/*结构选择器:获去当前元素的第一个子元素*/li:first-child { background-position: 2px 10px; font-weight: bold; font-style: initial; font-size: 12px;}/*结构选择器:获去当前元素的最后一个子元素*/li:last-child原创 2017-11-12 21:02:31 · 528 阅读 · 0 评论 -
CSS伪类选择器(锚点伪类、行为伪类)
CSS伪类原创 2017-11-11 22:00:30 · 1420 阅读 · 0 评论 -
CSS样式(CSS可见性、css之内容移除)
CSS样式(CSS可见性、css之内容移除) /*CSS可见性 *overflow:hidden; 溢出隐藏 *visibility:hidden; 隐藏元素 隐藏之后还占据原来的位置。 *display:none; 隐藏元素 隐藏之后不占据原来的位置。 *Display:bl原创 2017-12-18 12:52:37 · 1077 阅读 · 0 评论