zoukankan      html  css  js  c++  java
  • CSS---基础外部样式表

    <link rel="stylesheet" type="text/css" href="style.css" media="all">

    1.CSS用link来链接样式表和文档。link需要放到head元素中,但不能放到其他元素内部。

    对于CSS文档,type总是设置为text/css。这个值描述了使用link标记加载的数据类型。

    href属性值可以是绝对的URL也可以是相对的。

    media属性:

      all:用于所有表现的媒体。

      screen:在屏幕媒体(如桌面计算机监视器)中表现文档使用。在这种系统上运行所有web浏览器都是屏幕媒体的用户代理。
      print:为视力正常的用户打印文档使用,另外还会在显示文档的“打印预览”时使用。

      projection:用于投影媒体,如发表演讲时显示幻灯片的数字投影仪。

    rel的属性值定为"alternate stylesheet"就可以定义候选样式表了。

    <style type="text/css">
    @import url(styles.css) all;
    @import url(styles.css) projection,print;
    @import url(http://example.org/library/styles.css);
    </style>

    2.style一定要用type属性。@import用于指示web浏览器加载一个外部样式表。必须写在其他CSS规则之前,之后兼容用户代理就会将其忽略。
      文档中可以有不只一个@import语句,但是不同与link,每个@import样式表都会加载并使用,所以额发指定候选式样表。

      与link一样,可以限制所导入的样式表应用于一种或多种媒体。

      如果有一个外部样式表,它需要使用其他外部样式表中的样式。此时@import就非常有用。由于外部样式表不能包含任何文档标记,所以不能用link元素

    3.如何让较老的浏览器也能访问自己的文档

      如果一个浏览器无法识别<style>和</style>就会将其统统忽略,不过这些标记中的声明不一定会忽略,因为对于浏览器而言,它们看上去就像是正常的文本。所以样式的声明会出现在页面的最上面。(当然,浏览器应该忽略这些文本,因为这不是body元素的一部分,但是事实总是相反)。解决这个问题的办法,建议将声明包含在一个注释标记中。

        <style type="text/css"><!-- 
        @import url(style.css);
            h1{
                color: azure;
            }
         --></style>

    4.style属性可以与任何HTML标记关联。一个内联style属性中只能放一个声明块,而不能放整个样式表。不能在style属性中放@import,也不能包含完整的规则。style属性值只能是规则中出现在大括号之间的部分。

    5.从CSS 样式代码插入的形式来看基本可以分为以下3种:内联式、嵌入式和外部式三种。他们的优先级:内联式 > 嵌入式 > 外部式。但是嵌入式>外部式有一个前提:嵌入式css样式的位置一定在外部式的后面。其实总结来说,就是--就近原则(离被设置元素越近优先级别越高)。但注意上面所总结的优先级是有一个前提:内联式、嵌入式、外部式样式表中css样式是在的相同权值的情况下

  • 相关阅读:
    模板元编程实现素数判定
    JDBC开发
    4.9 当相应行存在时更新
    QT5中如何使用QFtp类(这个类虽然没有被收录,但一直在更新)
    gcc和g++的区别
    Awesome C/C++(图像部分)
    Ubuntu更新源
    GO的GDB调试
    内核探测工具systemtap简介
    列举一下项目中使用的产品和技术
  • 原文地址:https://www.cnblogs.com/yuxingyoucan/p/5346480.html
Copyright © 2011-2022 走看看