zoukankan      html  css  js  c++  java
  • 在HTML文档中应用CSS

    1.1 内联式

      内联式是所有样式应用方式中最为直接的一种,它通过对HTML标记使用style属性,将CSS代码直接写在其中。

    <body>

      <h1 style="color:red;font-size:36px;" >内联样式</h1>

    </body>

      内联式是最简单、直接的CSS使用方法,但它的针对性很明显,只能作用于当前标记,造成代码冗余,维护比较困难。

    1.2 内嵌式/内部式

      内嵌式与内联式使用方法不同,它将CSS代码写在<head>标记之间,并需要采用<style>标记进行声明

    <head>

      <style>

        h1{

          backgroud:red;

          text-decoration:underline;

        }  

      </style>

    </head>

      使用内嵌式CSS用法时CSS代码将被集中放在<head>标记中,这样方便查找,对后期维护比较方便,页面代码也会减少。但是,如果一个网站有很多页面,如果多个网页的某个标记要使用相同的样式效果,内嵌式也会出现代码冗余和维护困难的问题,所以,内嵌式比较适合个别风格特殊的页面效果设置。

    1.3 链接式/外部式/外联式

      在实际的网站建设中,链接式CSS用法是最常用的,也是效果最好的。链接式特点是将CSS代码单独放在一个或多个.css文件中,实现了CSS代码和HTML代码的分离,这样使前期设计和后期维护都很方便,也有助于实现前台美工与后台程序设计人员的合理分工。

      链接式CSS使用时需要在<head>标记中使用<link>标记,通过<link>标记的相关属性指明外部CSS文件的路径,以方便找到其中定义的CSS样式并应用在当前页面元素上。

    <head>

      <link rel="stylesheet" type="text/css" href="mycss.css" />

    </head>

      链接式CSS用法的最大特点是将CSS代码和HTML代码分离,这样就可以实现将一个CSS文件链接到不同的HTML网页中。使用链接式CSS,可以在设计整个网站时,将多个页面都会用到的CSS样式定义在一个或多个.css文件中,然后在需要用到该样式的HTML网页中通过<link>标记链接这些.css文件,通过链接式CSS可以降低整个网站的页面代码冗余并提高网站的可维护性。

    1.4 CSS应用的优先级

    ●  内联式>内嵌式>外部样式

    ●  在多个外部样式中,后出现的样式优先级高于先出现的样式

    ●  在样式中,选择器的优先级:ID样式>class样式>标记样式

  • 相关阅读:
    关于程序收到消息的顺序
    窗口过程
    消息循环
    解剖窗口程序
    开始了解窗口程序
    编码的规范
    汇编的除法和乘法
    Win32汇编--Win32汇编的高级语法
    H5-音频列表音乐切换
    移动端-ibokan
  • 原文地址:https://www.cnblogs.com/jacinthcc/p/4688314.html
Copyright © 2011-2022 走看看