CSS样式

矫情吗；* 2022-05-24 10:37 312阅读 0赞

1.  **font-size:20px;                                        /\*设置文字字号\*/**
2.  **width:20px;                                             /\*宽度\*/**  
    
3.  **height:20px;                                            /\*高度\*/**
4.  **background:pink;                                   /\*背景色\*/**
5.  **color:red;                                                 /\*设置文字颜色\*/**
6.  **color:rgb(133,45,200);                           /\*由 R(red)G(green)、B(blue) 三种颜色的比例来配色\*/**
7.  **color:rgb(20%,33%,25%);                      /\*可以是 0%~100% 的百分数\*/**
8.  **color:\#00ffff;                                           /\*普遍使用\*/**
9.  **font-weight:bold;                                   /\*设置字体加粗\*/**
10. **font-family:"Microsoft Yahei";              /\*设置字体:微软雅黑\*/**
11. **font-style:italic;                                       /\*斜体样式\*/**
12. **text-decoration:underline;                     /\*下划线\*/**
13. **text\_decoration:line-through;                /\*删除线\*/**
14. **text-indent:2m;                                        /\*段落排版--缩进\*/**
15. **line-height:2m;                                        /\*段落排版--行间距（行高\*/**
16. **letter-spacing:20px;                                /\*段落排版--中文字间距\*/**
17. **work-spacing:50px;                                 /\*段落排版--字母间距\*/**
18. **text-align:center;                                     /\*段落排版--对齐\*/**  
    
19. **display:block;                                           /\*将元素显示为块级元素\*/**
20. **display:inline;                                           /\*将块级元素转换为内联元素\*/**
21. **display:inline-block;                                 /\*将元素设为内联块状元素\*/**
22. **border:2px solid red;                                /\*盒模型--边框，可以设置它的粗细、样式和颜色(边框三个属性)\*/**
23. **border-width:2px;                                     /\*上面是 border 代码的缩写形式，可以分开写\*/  
    border-style:solid;  
    border-color:red;**  
    
24. **border-bottom:2px solid red;                   /\*单独设置下边框\*/**
25. **border-top:1px solid red;                          /\*同样可以使用下面代码实现其它三边(上、右、左)边框的设置\*/  
    border-right:1px solid red;   
    border-left:1px solid red;**  
    
26. **position:absolute;                                      /\*层模型-绝对定位\*/  
    positon:relative;                                         /\*层模型-相对定位\*/   
    position:fixed;                                            /\*层模型-固定定位\*/  
    top:10px;                                                    /\*模型位置定位参数如下\*/  
    bottom:10px;  
    right:10px;  
    left:10px;**
27. **padding:10px 10px 10px 10px;                /\*盒模型内边距 参数依次对应“上右下左”顺时针\*/**
28. **margin:10px 10px 10px 10px;                  /\*盒模型外边距 参数依次对应 “上右下左”顺时针\*/**
29. **text-align:center                                        /\*行内居中，给需要居中的目标的父元素加上该属性\*/**
30. **line-height:100px;                                     /\*行间距\*/**
31. **vertical-height:middle;                              /\*垂直居中\*/**
32. **float:none;                                                  /\*不使用浮动\*/  
    float:left;                                                     /\*靠左浮动\*/  
    float:right;                                                   /\*靠右浮动\*/    **
33. **background-image: url("../image/photo.png");  
                                                                         /\*设置背景图片\*/**  
    
34. **background-repeat: no-repeat;                /\*设置背景图片不重复\*/**  
    
35. **opacity:0;                                                    /\*设置为透明\*/  
    filter:alpha(opacity=0);                             /\*让IE也实现透明，兼容写法\*/**
36. **transform:scale(0.01);                                /\*对元素变形\*/**
37. **transition: all 1s;                                          /\*元素动画1s切换\*/**
38. **transform-origin: right bottom;                 /\*调整元素基准点为元素右下角，默认中心点\*/**
39. **overflow:hidden;                                          /\*隐藏\*/**