基础知识css-CSDN博客

本文链接：https://blog.csdn.net/qq_45090205/article/details/114240259

因为之前有学习过，也写过静态页面，但是记得就不牢靠。所以就每天记录一下吧。

css中的单位问题，分为绝对单位和相对单位。像平时用得比较多的像素px就是相对单位，而em 和rem则是绝对单位，rem是css3中新引入的单位，除了ie8,一般浏览器都可适用。1em=当前元素的字体大小。1rem=根元素的字体大小，所以，一般响应式布局用到。
css有两大特性，继承性和层叠性。一：继承性，关于继承性，像padding，margin和border这些属性是没有继承性的，W3C为了方便前端人员才设计了css的继承性，所以，一般是方便人员写页面的属性才会被继承①文本方面属性：font-size font-family font-weight font-style line-height text-index text-align 等。②列表方面属性：list-style-type list-style-positon list-style-image list-style等 ③字体颜色方面：color 二:层叠性。关于层叠性，①有后来者居上的这个说法，但是，后来者居上是有条件的，即元素相同，属性相同，权重相同的时候，元素的样式是后来者居上，即后写的会覆盖前面写的样式。②权重，是这个很重要的东西: 行内样式：1000
id选择器：100
类选择器和伪类选择器：10
元素选择器：1
通配符选择器：0
继承样式：0(当继承样式和指定样式冲突时，指定样式获胜。概念什么是指定样式冲突，例子如下)

     #outer p{
     color:red
     }
     #outer .inner{
     color:green
     }
     #outer  p strong{
     color:blue
     }
     #outer  p span  strong {
     color:purple
     }
       </style>
       <body>
       <div id="outer">
       <p class="inner">
       <span><strong>你好</strong></span>
     
       </p>
       
       </div>
       </body>

在这里面red的权重为：100+1=101
green的权重：100+10=110
blue的权重: 100+1+1=102
purple的权重：100+1+1+1=103本来权重最大的是green应该显示为绿色，但是green为继承性样式，在strong里，它呢权重其实为0即没有是指定strong里面这个样式，所以blue和purple是指定了strong里面的样式所以选较大值purple