zoukankan      html  css  js  c++  java
  • 第一章 CSS基础

    1、CSS:层叠样式表
    (1)好处:结构样式分离、样式复用、精确控制布局定位、方便搜索引擎搜索
    (2)用途:美化修饰、布局定位


    2、CSS样式表使用方式(3种):
    (1)内嵌样式[行内样式]:确定到具体元素,控制相应元素,不建议使用。

    (2)内部样式:
    <head>
    <style type="text/css">
    样式内容
    </style>
    </head>

    (3)导入 <style type="text/css">@import "外部样式路径";</style>


    (4)外部样式——重点、常用
    <head>
    <link type="text/css" href="外联样式路径" rel="stylesheet" />
    </head>

    注:先引入样式==》然后编写样式==》最后使用样式


    3、选择器
    (1)元素选择器 ——选择同种标签
    定义时直接使用元素名称作为选择器
    使用时直接对元素进行修饰

    (2)类选择器 ——选择同类名的元素
    定义时使用“.”开头加自定义类名 作为选择器
    使用时对元素的class属性赋"相应类名"值进行修饰

    (3)id选择器 ——选择唯一的id
    定义时使用“#”开头加自定义5d名 作为选择器
    使用时对元素的id属性赋"id名"值进行修饰

    (4)交集选择器:要求满足所有要求才能产生的修饰
    标签选择器、id选择器、类选择器任意组合——直接连接使用,不能使用空格

    (5)并集选择器:只要满足其中一种选择器就可以使用
    标签选择器、id选择器、类选择器任意组合——使用","连接选择器。

    (6)后代选择器==》父亲 儿子 ,父亲标签包着儿子标签
    标签选择器、id选择器、类选择器任意组合——使用空格连接

    (7)全局选择器:选择整个网页,使用*,例如:
    *{backgroung-color:#00F;}

    4. CSS样式优先级
    【一个元素允许同时应用多种样式,页面元素最终的样式即为多种样式的叠加效果。】
    (1)引入方式优先级-就近原则:行内样式表>内部样式表>外部样式表>浏览器默认样式【后来居上】
    (2)选择器的优先级-就少原则:id选择器>类选择器>标签选择器

    5.伪类选择器【超链接】
    (1)超链接样式的特点-超链接样式的特殊性
    ?文本或图像加上链接,将失去原样式而继承链接的样式。
    (2)伪类:状态的方式分别定义样式,一般称为伪类
    超链接伪类样式的四种状态——<a>
    ?未访问状态 (a:link)
    ?已访问状态 (a:visited)
    ?鼠标移上状态 (a:hover)
    ?激活选定状态 (a:active)

    link伪类:(:link,:visited)链接专用

    动态伪类:(:hover,:active,:focus-IE8↑)大多数元素可用

    【父级元素+空格+子元素】,这种写法可以增加代码可读性,规定了具体范围。
    . nav ul 指的是nav类里面的ul标签。
    (3)设置超链接样式的步骤:
    ?确定页面间所有链接样式是否相同,否则分开定义。【使用类选择器和上述4来确定范围】
    ?先定义四个状态共有样式,再分别定义其他状态。【共有样式写在标签里,状态样式写在伪类状态里】

  • 相关阅读:
    将不确定变成确定~LINQ DBML模型可以对应多个数据库吗
    将不确定变成确定~frameset页面不能正确加载
    System.Web.Caching.Cache删除某键后,希望同时触发其它动作(关键时刻,还是事件靠的住)
    Linq实体类的设计(解决了复合查询的问题,同时解决了LINQ上下文缓存问题)
    将不确定变成确定~LINQ查询两种写法,性能没有影响,优化查询应该是“按需查询”
    ASP.NET的内置对象
    Templating with JSF 2.0 Facelets
    IOS设计模式学习(1)设计模式初窥
    20个强大的jQuery翻书插件【 jQuery flipbook】
    linux网络编程之socket(十四):基于UDP协议的网络程序
  • 原文地址:https://www.cnblogs.com/suola/p/8275791.html
Copyright © 2011-2022 走看看