/*
*作者：呆萌老师
*☑csdn认证讲师
*☑51cto高级讲师
*☑腾讯课堂认证讲师
*☑网易云课堂认证讲师
*☑华为开发者学堂认证讲师
*☑爱奇艺千人名师计划成员
*在这里给大家分享技术、知识和生活
*各种干货，记得关注哦！
*vx：it_daimeng
*/

颜色

.cls_div1{

     color: red;  

}


.cls_div2{

    color: #FF4300; /*rgb值的16进制方法  0--FF  r:red  g:green  b:blue*/

}


.cls_div3{
   

    color: rgb(17,119,255);/*rgb值的10进制方法  0--255  r:red  g:green  b:blue*/

}



.cls_div4{

    color:rgba(17,119,255,0.5); /*设置透明度  0--1 之间  0代表全透明  1 代表完全不透明*/

   

}

字体

body{

   

    font-size: 14px; /*设置字体大小 */

    font-family: "黑体";

    font-weight: bold; /*字体的粗细*/

    font-weight: 500;

    font-style: italic; /*字体样式  比如倾斜*/

    line-height: 25px;  /*行高*/

}



/*如果对同一个html对象做相同的多个样式 则采用的就近原则 */

.ul1{

   

     font: 14px/1.5 "宋体",Arial,"微软雅黑"; /*对字体做整体设置    1.5指的是行高，行高是字体大小的1.5倍*/

}



.ul2{

   

     font: 14px/25px "宋体",Arial,"微软雅黑"; /*对字体做整体设置    25指的是行高*/

}

文本

a{

text-decoration:none; /*文本装饰 none 去掉下划线 */

}

a:hover{

text-decoration: underline;/*下划线*/

}

.price{

text-decoration: line-through; /*删除线*/

}

.info p{

text-indent: 30px; /*首行缩进*/

}

.list li{

width: 150px;

border: 1px solid red;

white-space: nowrap ; /*强制在一行内显示*/

overflow: hidden; /*溢出的部分 隐藏*/

text-overflow: ellipsis; /*溢出的文本部分 显示为 ...*/

}

.div_center{

text-align: center; /*文本对齐方式*/

}

列表

列表样式的处理

​​​​​​​ 去掉list-style

ist-style: none;  /*设置列表的样式为无(去掉默认的 .  )*/

1. 给li设置背景图片

.list2 li{

/*

background-image: url(../img/arrow.gif);

background-repeat: no-repeat;

background-position: left center; */

background: url(../img/arrow.gif) no-repeat left center;

border: 1px solid red;

padding-left: 10px;

}

​