CSS 回顾

CSS 回顾
CSS 层叠样式表.
    将网页中的样式分离出来,完全由css来控制.
    增强样式的复用性以及可扩展性.
    格式:
        选择器{属性名:属性值;属性名:属性值...}

    css和html代码相结合的四种方式:
    1,每一个html标签都有一个style属性.
    2,当页面有多个标签有相同样式时,可以进行复用.
        <style>
            css代码
        </style>
    3,当有多个页面中的标签的样式相同时,还可以将样式单独封装成一个css文件.
        通过在每个页面中定义
        <style>
            @import url( "1.css");
        </style>
    4,通过html中head标签中的link标签链接一个css文件.//rel 属性指示被链接的文档是一个样式表: <head> <link rel="stylesheet" type="text/css" href="theme.css" /> </head>
        <link rel="stylesheet" href="1.css" />

    技巧:为了提高相同的样式的复用性以及可扩展性,可以将多个标签样式进行单独定义,并封装成css文件.
        p.css,div.css
        在一个css文件中使用css的import将多个样式文件导入.
        然后在html页面上,使用link标签导入这个总的css文件即可.

        1.css
        @import url("p.css");
        @import url("div.css");

        <link rel="stylesheet" href="1.css" />
    -------------------------
    (被)选择器:其实就是样式要作用的标签容器.
    当样式后分离后,html作用在于用标签封装数据.然后将css加载到指定标签上.

    选择器的基本分类:
    1,标签选择器:其实就是html中的每一个标签名.
    2,类选择器:其实就是每一个标签中的class属性. 用.的形式表示.
        只用来给css所使用.可以对不同标签 进行相同样式设定.
    3,ID选择器:其实就是每一个标签中的ID属性.但是要保证id唯一性.用#来标识.
        ID不仅可以被css所使用,还可以被javascript所使用.

    选择器优先级.ID>CLASS>标签

    扩展选择器:
    1,关联选择器:其实就是对标签中的标签进行样式定义.选择器 选择器...
    2,组合选择器:对多个选择器进行相同样式定义.将多个选择器通过","隔开的形式
    3,伪元素选择器:其实就是元素的一种状态.
        a:link:超链接 被点前状态
        a:visited:超链接 点击后状态
        a:hover:悬停 在 超链接 上.
        a:active: 点击 超链接时.
        在定义这这些状态时,有一个顺序: L V H A
        p:first-letter//设置对象内的第一个字符的样式表属性
        p:first-line//CSS ::first-line 伪元素,匹配一个段落的第一行的样式... 猴子提示: ::first-line伪元素只可以和块类元素(div、p)连用p::first-line { background:red; color...
        :focus://CSS :focus 选择器 ,IE6不支持.但FF支持 
//所有主流浏览器都支持 :focus 选择器。 注释:如果:focus 用于 IE8 ,则必须声明 <!DOCTYPE>。定义和用法 :focus 选择器用于选取获得焦点的元素。 提示:接收键盘.
    CSS滤镜:其实通过一些代码完成丰富了样式.

    当使用到CSS的更多属性时,还需要查阅CSS API
    网页设计的时候.div+css
    div:行级区域
    span:块级区域
    p:行级区域.p中不要嵌套div.
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值