您现在的位置:首页 >> 前端 >> 内容

CSS是什么?CSS有什么用?CSS的选择器及CSS盒子模型实例介绍

时间:2018/2/2 14:27:19 点击:

  核心提示:CSS笔记总结CSS是什么层叠样式表 (Cascading Style Sheets)CSS有什么用修饰Html提高样式的复用性html的内容和样式进行分离,便于后期维护CSS的注意事项1.CSS的引...

CSS笔记总结

CSS是什么

层叠样式表 (Cascading Style Sheets)

CSS有什么用

修饰Html

提高样式的复用性

html的内容和样式进行分离,便于后期维护

CSS的注意事项

1.CSS的引入方式

内嵌式:复用性不高,不利于维护,项目中不建议使用 

内部式(常用) 

外部式(常用) 

import方式

2.CSS的选择器

基本选择器

元素选择器

id选择器

class选择器

属性选择器

伪元素选择器

a标签举例

            静止状态  a:link {css属性}

            悬浮状态 a:hover {css属性}

            触发状态 a:active {css属性}

            完成状态 a:visited {css属性}

层级选择器

3.CSS盒子模型

margin、padding

其他注意事项

1.基本选择器的优先级

id选择器大于类选择器大于元素选择器

    <!DOCTYPE html>

<html lang="en">

    <head>

<meta charset="UTF-8">

<title>Title</title>

<!--id > class > label -->

<style type="text/css">

    span {

        color: yellow;

    }

    .classspan {

        color: red;

    }

    #idspan {

        color: blue;

    }

</style>

</head>

<body>

<span id="idspan" class="classspan"> hello world</span>

</body>

</html>

2.浮动属性的使用

float: 

属性值:left right 

clear:清除浮动 left right both 

缺点: 

(1)影响相邻元素不能正常显示 

(2)影响父元素不能正常显示

Tags:CS SS S是 是什 
作者:网络 来源:u014672466