文字阴影 text-shadow:h-shadow/v-shadow h-shadow 水平阴影,允许负值,正数时阴影在右,负数时阴影在左 v-shadow 垂直阴影,允许负值,正数时阴影在底部,负数时阴影在上面 水平和垂直阴影必须要写 blur 模糊距离,只能是正数 color 阴影颜色 盒子阴影 box-shadow 默认时外阴影(六个属性值,前四个是value,color,inset) 1)阴影离开盒子时的横向距离 2)阴影离开盒子时的纵向距离 3)阴影的模糊半径 4)阴影的延伸半径 5)阴影的颜色 6)inset是否使用内阴影 inset和color可以在最前面,但不可以在数值中间 自己决定自动换行的处理方法 work-break normal 默认换行规则,中午到边界换行,英文从整个单词换行 keep-all 不允许断字(指中文),对火狐和苹果浏览器不起作用 break-all 允许在单词内换行,可以强行截断英文单词,可以让标点位于首位 是否允许浏览器在单词内断句 word-wrap normal 默认只允许在断字点换行 break-word 在长单词处或地址栏内,将内容在边界换行,但不截断英文单词 背景裁剪 background-clip border-box 默认值,边框区域 padding-box 紧挨着边框 centert-box 内容区 text 背景图填充文本效果 text-fill-color:transparent 背景图填充文本效果时透明 背景图起点 background-orgin 先给背景图定位(background-position),在定起点 border-box 边框区域 padding-box 默认值,紧挨着边框 centert-box 内容区 背景图大小 background-size 1、直接写像素(先水平,后垂直) 2、直接写100% 3、cover(图片放到足够大,会失真) 4、contain(按比例缩放) 圆角 正圆 border-radius 高是多少就给多少 1、一个数值,四个角都变 2、两个数值,左上和右下,右上和左下 3、三个数值,左上,右下和左上,右下 4、四个数值,顺时针上右下左 椭圆 1、一组数值,四个角变化相同 2、两组数值,斜对角相同变化 3、三组数值,左上,右下和左上,右下 4、四组数值,顺时针上右下左 边框图 border-image 1、source:url路径 2、slice:value 数值,不带单位 3、width:value 边框宽度 4、repeat:repeat(平铺) round(环绕) stretch(拉伸) 字体图标 iconfont 颜色特性 hsl/hsla h 色调 0-360 可以是小数 s 饱和度 % 大于等于100%时为白色,0%为黑色 l 亮度 % 大于100%不报错 a 透明度 0-1 表单 1、文字段集 <fieldset></fieldset> 2、字段集标题 <legend></legend> 且是fieldset中唯一的 3、提示信息 <label for="绑定控件id名"></label> 点字会触发对应框 4、上传文件框 <input type="file" multiple="multiple"/> mulitiple 实现多选 默认的单选、多选、下拉以及上传的样式都改不了 1、单选多选用图片或者背景图,功能用js或cs隐藏 2、上传文件框,用div写样式,功能用js 3、下拉用ul li做菜单 表格CSS属性(给table加) 1、单元格间距 border-spacing 2、合并单元格间距 border-collapse 3、无内容时单元格设置 empty-cells:hide(隐藏) show(显示) 4、自适应 table-layout:auto(宽自适应) fixed(固定宽,高自适应) 默认带有边框的 fieldset input textares select hr 表格html属性 th:列,默认文字加粗,且水平居中 1、表格标题 <caption></caption> 2、标题位置 caption-side:top/right/left/bottom left和right 火狐识别 top和bottom IE7以上识别 3、组分隔线 rules="groups/rows/cols/all/none" 4、列分组 <colgroups></colgroups> <col/>没有分隔线 5、行分组 表头 <thead></thead> 表体 <tbody></tbody> 表尾 <tfoot></tfoot> 只能有一个表头和表尾