1in(英寸)=96px(像素)=6em=2.54cm(厘米)
代码书写顺序 1.位置属性(position(定位),top,right,z-index(值越小越底层),disply(适用xml难点),float(浮动)) 2.大小(width(宽度),height(高),padding,margin)3.文字系列(font,line-hieght,letter-spacing,color-text-align)4.背景(background,border)5.其他(animation,transition)
4角顺序 顺势针 3角顺序 上,左右,下 2角顺序 上下,左右.
记住加";"
颜色值 可选 1.颜色命名 border-color: blue 2.RGB rgb(25%,35%,45%) 3.十六进制 #909090
padding (填充=内边距)
理解含义,你与房子内墙的距离。如果填充为0,将被背景取代。
注意事项:百分比数值是相对于其父元素的width(宽度)计算的.
值…
padding-bottom 下边距 可选单位px,em,百分比.代码样式padding-top: 10px;
padding-left 左边距
padding-right 右边距
padding-top 上边距
length(长度)单位cm,pt(像素…pixel)pixel %继承父的距离
Font (字体)
注意事项: IE无法调整文本,使用EM单位,设置
百分比body {font-size:100%}
值…
font-family 字体系列 {font-family: Georgia;} 错误的格式 {font-family: Georgia,serif;} 正确 具体的字体 "times"-"courier"-"arial" 通用字体"serif"-"sans-serif"-"cursive"-"fantasy"-"monospace"
font-size 字体尺寸 通过像素设置文本,属于绝对,推荐使用em
body {font-size:100%;}
h1 {font-size:3.75em;}
font-style 字体风格 p.normal {font-style:normal;} 正常 p.italic {font-style:italic;} 倾斜
font-variant 小型大写字体或者正常那个字体显示文本
font-weiqht 设置字体的粗细 p.normal {font-weight:normal;} 关键字100到900 100最细,400等于normal 700等于bold
Border (边框)
房子的墙体
注意事项:由于border-style的默认值是none,如果希望边框出现,就必须声明一个边框样式.
如果想边框有宽度,可以选用透明代码 border-color: transparent
border-style 边框样式 可选上下左右 {border-style: 上 右 下 左;}
10种可选属性 1.none无边框 2.hidden 等同none 3. dotted点线 大多浏览器呈现实线 4.dashed 虚线 大多浏览器呈现实线 5.solid 实线 6.double 双线 线宽等于border-width的值7.groove 3D凹槽 效果取决于 border-color的值 8.ridge 3d脊边 效果同上 9.inset 3d嵌入 效果同上 10.outset 3D突起 效果同上 11.inherit 从父元素继承边框样式
border-width 边框宽度 p {border-style: 实线 虚线 双线 none;border-width: 4个;}
border-color 颜色 p{border-color: blue;} 颜色无法单独使用
radius (圆角)
...不熟 border-radius
Float(浮动)
左右移动,直到边缘碰到包含框或另一个浮动框的边框为止.