css杂项补充】的更多相关文章

css杂项补充 一.块与内联 1.块 独行显示 支持宽高,宽度默认适应父级,高度默认由子级或内容撑开 设置宽高后,采用设置的宽高 2.内联 同行显示 不支持宽高 margin上下无效果,左右会起作用,padding不会影响它的高度,背景会影响. 一般不设置内联的margin和padding 3.内联块 同行显示,之间有间距(间距产生原因是空格) 支持宽高,宽高由内容撑开 可以设置宽高,设置其中一个,另一个等比缩放 二.属性补充 1.overflow 指定内容溢出元素的框,会发生什么. 值 描述…
css布局补充一 图片边框问题 注意css布局时img图片标签默认有的浏览器有边框,所以大多时候需要去除图片的边框 CSS各种居中方法 水平居中的text-align:center 和 margin:0 auto 这两种方法都是用来水平居中的,前者是针对父元素进行设置而后者则是对子元素.他们起作用的首要条件是子元素必须没有被float影响,否则一切都是无用功.margin:0 auto也可以被写成margin:0 auto 0 auto.不能理解的童鞋们可以自己去找找关于css缩写的内容. 垂直…
补充1:页面布局 一般像京东主页左侧右侧都留有空白,用margin:0 auto居中,一般.w. <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <style> body{ margin: 0; } .w{ width: 980px; margin: 0 auto;…
前面文章总结了常用的8种选择器,今天再来补充5中选择器,其中一部分是css3中新加入的. 1.相邻选择器 E+F { sRules } 相邻选择符只会命中符合条件的相邻的兄弟元素. 2.兄弟选择器 E~F { sRules } 兄弟选择符会命中所有符合条件的兄弟元素,而不强制是紧邻的元素. <style> /* 相邻选择符(E+F) */ h3 + p { color: #f00; } /* 兄弟选择符(E~F) */ h3 ~ p { color: #f00; } </style>…
1.媒体查询的css代码的优先级要比其他的高! 2.text-overflow: 定义文本溢出父级元素如何处理!    clip/ellipsis/string 3.overflow: visible hidden  scroll  auto inherit scroll 和 auto有区别吗?…
一.css框模型概述 元素框的最内部分是实际的内容,直接包围内容的是内边距.内边距呈现了元素的背景.内边距的边缘是边框.边框以外是外边距,外边距默认是透明的,因此不会遮挡其后的任何元素 1.css内边距属性(padding) 定义元素边框与元素内容之间的空白区域 2.css外边距属性(margin) margin 可以设置为 auto.margin后面是有4个参数的.例如:margin:1px 1px 1px 1px.分别表示 上.右.下.左.如果只写2个参数的话,比如:margin:1px 2…
CSS符号属性: list-style-type:none; /*不编号*/ list-style-type:decimal; /*阿拉伯数字*/ list-style-type:lower-roman; /*小写罗马数字*/ list-style-type:upper-roman; /*大写罗马数字*/ list-style-type:lower-alpha; /*小写英文字母*/ list-style-type:upper-alpha; /*大写英文字母*/ list-style-type:…
在写HTML代码的时候,发现在Firefox等符合W3C标准的浏览器中,如果有一个DIV作为外部容器,内部的DIV如果设置了float样式,则外部的容器DIV因为内部没有clear,导致不能被撑开.看下面的例子:<div style="border:2px solid red;"><div style="float:left;width:80px;height:80px;border:1px solid blue;">TEST DIV<…
1.安装AuotPrefixer. 2.代码里写css样式后,Ctrl+Shift+P,选择AutoPrefix CSS执行 结果如下…
###########总结#### 标签选择器 标签名     id选择器  #box1   类选择器.box2 css高级选择器 *子选择器* 子选择器用 大于号 .box1>.box2{ width: 100px; height: 100px; background-color: yellow; } .box1>div{ width: 100px; height: 100px; background-color: yellow; } .box1>.box2>.box3{ wid…