dianbolan的博客

CSS3弹性伸缩布局这个貌似要加前缀才能使用1.如何将一个元素设置为弹性盒子display:-xxx-box;2.设置容器内伸缩元素的排列方式-xxx-box-orient可选的值vertical(垂直)horizontal(水平)inline-axis(和水平貌似没区别)block-axis(和垂直貌似没区别)3.设置容器内伸缩元素的排列顺序-xx

默认情况下几个inline-block元素排列在一起 中间会出现空白的间隙html: 123123 123 123css:div{ display:inline-block; width:200px; height:200px; background:pink;}如何解决这个问题:1.把标签连起来写 123 123 123或者这样写 1

CSS3前缀和rem如果要兼容多个版本最好把前缀写前面标准写法写在最后各个属性的兼容性 自行参考caniuse.com

CSS边框与背景一.边框边框有3个属性border-width 边框的粗细(默认3px)border-color 边框的颜色(默认黑色)border-style 边框的样式其中width与color有默认值所以只需要给出边框的style即可设置一个边框边框的样式有:solid实线 dashed破折线 dotted圆点线 double双线groove槽线 inse

CSS表格与列表一.表格样式这里只介绍表格的一些独有的属性1.border-collapse设置表格的单元格之间的边框是否合并可选的参数 separte 分开的collapse 合并的2.border-spacing设置单元格边框之间的距离 这个选项必须在 border-collapse:separate时才有用3.caption-side设置表

css中的度量单位度量单位分为绝对单位和相对单位1.css支持五种绝对单位(绝对单位即现实世界中我们使用的单位)①in英寸②mm毫米③cm厘米④pt镑⑤pc pica一般在网页中不使用绝对单位2.css支持五种相对单位①em②ex③rem④px⑤%国内玩家常用的有em,px,%(老外貌似喜欢用rem)一.emem与

CSS盒模型1.内边距内边距的长度要计算在元素的长度里面2.外边距外边距的长度不计算在元素的长度里面3.关于内容的溢出对于溢出可以使用overflow属性来控制显示的效果可选的参数有4个:auto hidden scroll visible visible默认值 溢出依然显示auto 由浏览器自行判断 有溢出则出现滚动条 没有则不出现滚动条hidden

CSS其他样式1.box-shadow设置盒子的阴影box-shadow:hoffset voffset [blur][extend][color][position(inset,不写即为外部)]2.outline轮廓样式outline:[style][width][color];

CSS的字体文本样式一.字体样式1.font-size修改文本的字体大小(没啥可说哒^ . ^)可选择的 xx-small x-small small medium large x-large xx-large注意:chrome最小的字体为12px 如果你设置的字体小于12px那么字体默认为12px(最小字体可以通过谷歌浏览器自己的设置来改变最小字体为6px)可选择的 sm

选择器的分类1.基本选择器  (1)通用选择器匹配页面上的所有元素*{   border:1px solid red;}  (2)元素选择器选取页面上所有的特定类型的元素p{color:red;}  (3)id选择器根据元素的id选择特定的元素.#abc{color:red;}  (4)类选择器选择页面上所有的具有某一clas

CSS3弹性伸缩布局新版本1.开启弹性伸缩布局display:flexbox;2.设置布局中元素的排列方式和顺序flex-direction可选的参数row 水平column 垂直row-reverse 水平反向column-reverse 垂直反向3.设置无法容纳时,自动换行flex-wrap可选的参数nowrap 默认值都在一行或一列显示

1.手机页面的viewport解释:initial-scale=1.0 ,使你的页面的初始缩放比例为1.例如:一个pc端页面在电脑上可以正常显示,如果不加上面的meta,当在手机上浏览时,将会自动缩放,导致页面变小,字体,图片等无法看清,当设置了initial-scale=1.0时,用手机浏览时将不进行缩放(和在pc上看到的是一样的,只不过超出的部分会有滚动条,另这只是举例说明initia