• css 笔记1


    type="text/css"的作用是什么?
    它是CSS样式的标记。
    type->类型,这里是style的属性
    text/css ->文本/css,即css文本
    type="text/css" 表示的是浏览器的解释方式,如果不定义的话,有些CSS效果 浏览器解释得不一样。

    层叠次序

    当同一个 HTML 元素被不止一个样式定义时,会使用哪个样式呢?

    内联样式(在 HTML 元素内部)拥有最高的优先权,这意味着它将优先于以下的样式声明:<head> 标签中的样式声明,外部样式表中的样式声明,或者浏览器中的样式声明(缺省值)。

    CSS 规则由两个主要的部分构成:选择器,以及一条或多条声明。

    selector {declaration1; declaration2; ... declarationN }
    选择器通常是您需要改变样式的 HTML 元素。
    每条声明由一个属性和一个值组成。

    属性(property)是您希望设置的样式属性(style attribute)。
    每个属性有一个值。属性和值被冒号分开。

    selector {property: value}

    下面这行代码的作用是将 h1 元素内的文字颜色定义为红色,同时将字体大小设置为 14 像素。
    在这个例子中,h1 是选择器,color 和 font-size 是属性,red 和 14px 是值。
    h1 {color:red; font-size:14px;}

    后代选择器

    我们可以定义后代选择器来创建一些规则,使这些规则在某些文档结构中起作用,而在另外一些结构中不起作用。

    举例来说,如果您希望只对 h1 元素中的 em 元素应用样式,可以这样写:
    h1 em {color:red;}

    上面这个规则会把作为 h1 元素后代的 em 元素的文本变为 红色。其他 em 文本(如段落或块引用中的 em)则不会被这个规则选中:
    <h1>This is a <em>important</em> heading</h1>
    <p>This is a <em>important</em> paragraph.</p>

    下面的两个 id 选择器,第一个可以定义元素的颜色为红色,第二个定义元素的颜色为绿色:
    #red {color:red;}
    #green {color:green;}
    下面的 HTML 代码中,id 属性为 red 的 p 元素显示为红色,而 id 属性为 green 的 p 元素显示为绿色。
    <p id="red">这个段落是红色。</p>
    <p id="green">这个段落是绿色。</p>
    注意:id 属性只能在每个 HTML 文档中出现一次。

    在 CSS 中,类选择器以一个点号显示:
    .center {text-align: center}
    在上面的例子中,所有拥有 center 类的 HTML 元素均为居中。
    在下面的 HTML 代码中,h1 和 p 元素都有 center 类。这意味着两者都将遵守 ".center" 选择器中的规则。
    <h1 class="center">
    This heading will be center-aligned
    </h1>

    <p class="center">
    This paragraph will also be center-aligned.
    </p>
    注意:类名的第一个字符不能使用数字!

    朝闻道
  • 相关阅读:
    apicloud教程
    apicloud教程3 (转载)
    apicloud教程2 (转载)
    apicloud教程1 (转载)
    API CLOUD 快捷键
    JS IIFE写法
    php事件驱动
    JQuery实践--Why JQuery
    Jquery实践--精读开篇
    python 实践--新闻聚合
  • 原文地址:https://www.cnblogs.com/wander-clouds/p/8443381.html
Copyright © 2020-2023  润新知