快速索引

布局

属性 功能
float left, right, center 水平定位
valign top, bottom, middle 竖直定位
clear left, right, both 清除左右两边的控件
width auto, px, percentage 宽度
height auto, px, percentage 高度
aspect-ratio auto, percentage, num, num/num 宽高比
margin px 外边距
padding px 内边距

外观

属性 功能
display auto, none 显示或隐藏
border none, format: width type color 边框
border-radius px 圆角边框
color none, Hex color 字体颜色
font-size px, percentage 字体大小
font-family CSS font family name 字体名字
font-weight normal, bold 设置字体粗体
background none, color, url(image) 背景颜色或者图片
opacity 0 ~ 1.0 透明度, 0 表示完全透明

背景设置:

边缘属性值的格式

你可以在一行里同时指定边缘的属性, 按顺时针的方向, 指定上右下左4个边缘的属性, 如 margin, padding, border. 这几种形式, 可以分别指定4个属性为不同的值, 也可以一次指定4个属性为相同的值. 具体用法见下面:

属性格式 示例
top&bottom&left&right i.e. 10
top&bottom left&right i.e. 10 20
top right bottom left i.e. 10 20 10 20

分隔边缘属性值

当然, 有时候你需要依次指定不同的边缘, 如给上右下左4个边框指定不同的宽度, 这时, 你可以分隔这些属性, 依次定义:

属性
margin-left px
margin-right px
margin-top px
margin-bottom px
padding-left px
padding-right px
padding-top px
padding-bottom px
border-left none, format: width type color
border-right none, format: width type color
border-top none, format: width type color
border-bottom none, format: width type color

补充