首页 >web前端 >html教程 >新手小白学习css笔记

新手小白学习css笔记

零下一度
零下一度原创
2017-06-29 09:22:271471浏览

一、复习

  1. 什么是CSS? 
    层叠样式表 -层叠样式只会被覆盖而不会被替代

  2. CSS的使用方式 
    style属性--->

     
    sytle标签---> head标签里面 
    link--->

  3. 基础选择器
    html标签选择器 通过html标签名来选择元素 
          ①所有的html标签都可以当做选择器 
          ②无论标签藏多深都会被选中 
          ③选择的是所有的标签而不是具体某个标签。所以说我们通过html标签选择器来设置的都是一些共性问题 
    id选择器 
          ①任何的标签都可以用id属性和属性值(因为id是一个全局属性)。id命名不能随意的命名。大小写敏感,id的名字中可以有数字字母下划线,但是要以字母开头。 
                驼峰命名法   小驼峰命名法  大驼峰命名 
                testHeader小驼峰TestHeader大驼峰       ②但是id名不能够重复 
    class选择器 
          ①任何的标签都可以使用class属性(class属性也是一个全局属性) 
          ②class属性名可以重复使用 
          ③一个class属性中,可以有多个class属性值。


二、综合选择器

  1. 后代选择器 div p

  2. 交集选择器 div.dl

  3. 并集选择器 div,p

  4. 子元素选择器 div>p

  5. 序列选择器 ul li:first-child   ul:li:last-child

  6. 相邻兄弟选择器 div + p

  7. 普通兄弟选择器 div ~ p


三、继承

  1. 继承:父元素的某些css属性会被子元素无条件的继承过去。关于文字的css属性都可以进行继承:color text-  line-font-

  2. 层叠 
    层叠解决的是css冲突的问题 
    比较权重来解决层叠问题 
    !important能够把"单独属性"的权重变为无限大。尽量少用。


四、块级元素和行内元素

div 块级元素 
span 行内元素 
块级元素和行内元素的区别: 1. 行内元素部不能够设置宽度和高度。行内元素的宽度和高度是标签内同的宽度和高度。块级元素可以设置宽度和高度 2. 块级元素会单独占一行。而行内元素却不能够独占一行,只能和其他行内元素共用一行。 3. 如果块级元素不设置宽度,那么块级元素会自动的占满父元素的全部宽度。

以上是新手小白学习css笔记的详细内容。更多信息请关注PHP中文网其他相关文章!

声明:
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn