css样式相关规则
时间:2023-03-30 23:14:34
CSS
1)字体规则(可继承)font-family'MicrosoftYaHei',宋体font-style:font-weight:font-size:line-height:font:boldnormal14px/1.5em'MicrosoftYaHei'em相对单位,相对于当前元素的字体大小helloworld
rem相对单位,相对于body中声明的字体大小body{font-大小:10px}
你好世界 https://developer.mozilla.org/zh-CN/docs/Web/CSS/font2)webfonts(字体图标库)iconfont(阿里的图标库)picture(设计师图标图标)icon--specialfont(写字同画)3)文字相关规则(可继承)text-decorationfontdecorationnone无任意字体装饰underlineunderlineline-throughstrikethroughoverlineoverlinecolorlightblueblueredhex#000000#ffffff#ff0000#32b593(山西大学校徽绿)rgbrgb(r,g,b)0~255rgb(255,0,0)rgbargba(r,g,b,a)0~255rgb(255,0,0,0.5)文本-align容器中字体的排列text-transformChangeEnglishuppercaselowercasetext-indentfontindentation4)list-related(ul,ol)list-style:none取消列表的样式(列表项前面的小黑点或数字)5)box-relatedwidthheightmarginmargin-topmargin-rightmargin-bottommargin-leftborderborderpaddinginnermarginbox-sizingcontent-box内容框(默认框)宽度不包括padding,borderborder-box边框框(怪异框)宽度包括padding,border6)background-relatedbackground-color:背景色background-clip:backgroundlayingrangeborder-boxborderandwithintheborderpadding-boxinnermarginandinnermargincontent-boxcontentbackground-image:url('./images/徽标.jpg');背景图片,参数为地址[相对地址,绝对地址]background-repeat:no-repeat;背景图片重复模式no-repeat不重复repeat-xrepeat-ybackground-position:center;背景图片的显示位置centerletleftmiddlelefttopupperleftcorner10px20pxbackground-size:cover;cover调整背景图像的大小,使其覆盖整个区域contain调整背景图片的大小,使背景图片嵌入区域,可能会导致部分容器没有背景覆盖background-origin:content-box;背景图片的起点border-boxpadding-boxcontent-boxbackgroundbackgroundcolorshortformof