3 选择器+引入CSS

1CSS概念:

css(cascading style sheet)汉译为层叠样式表,是用于控制网页样式

WEB标准中的表现标准语言,在网页中主要对网页信息的显示进行控制。目前推荐遵循的是w3C发布的CSS3.8版本;

用来表现HTML或者XHTAL等样式文件的计算机语言。1998年5月21日由w3C正式推出的css2.e

2.HTML+CSS

弥补html语言的不足,缩减页面代码,提高访问速度;

代码减少,页面文件就会小,占用网络带宽就少,客户端打开速度就快,用户体验就会更好结构清晰,有利于seo优化

有利于搜索引擎优化

缩短改版时间

对网站的重构有很好的支持

3.CSS的语法

对网站的重构有很好的支持

        声明包括:属性和属性值

         选择符{

        属性1 : 属性值1  属性值2  属性值3; 属性2  :  属性值;

                }

     CSS样式表

1:内部样式表

语法:

        <style type="text/ css">

        css语句

        </ style>

注:使用style标记创建样式时,最好将该标记写在<head></head>;

2:外部样式表

(1)语法:<link rel="stylesheet" type="text/css" href="目标文件的路径及文件名全称"/>

说明:使用link元素导入外部样式表时,需将该元素写在文档头部,即<head>与</head>之间。

                rel:用于定义文档关联,表示关联样式表;

                type:定义文档类型;

外部样式:1:生成一个独立的html文件,后缀为.html2:生成一个独立的css文件,后缀为.css3:关联连个文件,在htm1页面中的head标签中添加,<link rel="stylesheet" type="text/ css" href= "css地址”/>

(2)、导入外部样式表

        <style type="text/ css">

                @import url("目标文件的路径及文件名全称");

        < / style>了解 即可 不常用

  link 和@import的区别:   1:本质区别,link时标签,@import是css提供的一种写法2:加载顺序差别,link同时加载,import后加载3:兼容性差别,link没有兼容问题,@import不兼容低版本ie4:能否被js控制,link能被js控制,@import 不能被js控制

CSS样式表的权重关系

1)内联样式表的优先级别最高

2)内部样式表与外部样式表的优先级和书写的顺序有关,后书写的优先级别高。

3)同在一个样式表中的优先级和书写的顺序也有关,后书写的优先级别高。(被覆盖的只是相同属性的样式)

     

 选择器:选中指定的元素

        类型选择器(元素选择器标签选择器):div pa img span i em....

类选择器(class选择器):

        <标签class="mz"></标签>

.mz{}    【注】
在同一个页面中可以有多个相同的值在同一个class中可以有多个值
具有重用性,通常用来写样式

id选择器:

    <标签id="mz"></标签>

#mz{}   【注】在同一个页面中不能出现对此相同的值在同一个id中只有一个值

        具有唯一性,一般不用来谢样式

*通配符:通通匹配,匹配所有的元素

*{margin:0;padding:0;}

群组选择器:

                选择器1,选择器2,选择器3}匹配123,共匹配了3个

最高权重 !important

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值