1 颜色透明度
例如：红色：red/#f00/rgb(255,0,0); 带透明度的色彩值：rgba(255,0,0,0.5) 或者直接写成 opacity: 50%;
2 边框圆角
border-radius:圆角 border-radius值的不同意义：
值：a 表示四角都为相同的圆角状态值：a b 表示 左上，右下都为a，右上，左下都为b值：a b c 表示左上为a 右上和左下为b 右下为c值：a b c d 依次表示 左上 右上 右下 左下值：50% 表示圆或椭圆3 鼠标手状
cursor: pointer; /*鼠标图标成手状*/
4 定位
position 所有的定位和top right bottom left 联和一起起作用 position: relative;
relative 相对定位 以默认位置为参考点进行移动，absolute 绝对定位 以最近定位元素为参考点进行移动fixed 固定定位定位中水平居中--position: absolute; right:0; left:0; margin:auto;
4 盒子模型
宽：内容宽+border+margin+padding box-sizing: border-box; 宽：width+margin (宽＝内容宽+border+padding) 图片格式： gif jpg png webp
5 一些其他用法
overflow:hidden; 溢出隐藏:first-of-type 第一个同类型对象:nth-of-type(n) 第n个同类型对象 n=数字 odd（奇数行） even（偶数行）input{outline:none;} //去外边框线购物车主要代码示例：
<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title></title> <style> .one{ width: 150px; height: 40px; border:solid 1px black; position: relative; margin-left: 300px; margin-top: 20px; text-align: right; } div a{ text-decoration: none; color: red; height: 40px; line-height: 40px; margin-right: 10px; } div span{ background: darkred; color:white; padding: 0 5px; border-radius: 10px; display:inline-block; height: 17px; line-height: 17px; position: absolute; top:5px; left:40px; } </style> </head> <body> <div class="one"> <span>0</span> <a href="">我的购物车</a> </div> </body> </html>
