CSS导入使用及引用的两种方法：

  1. 外部引用
    1. 外部引用的方式，我们直接可以通过link标签来引用我们写好的一个CSS文件；
    2. 在link 标签中，我们通过rel = "stylesheet"来告诉浏览器，这是一个样式文件，同时rel还有另一个取值 alternative，这样用户自己可以选择样式，当然这个前提是当前页面引入的css样式表文件不止一个。
    3. 现在一般建议使用css文件外联引用，即把css样式单独作为一个.css文件。
  2. 直接使用
    1. 可以style标签直接在html 文件中直接写，然后页面通过调用；
    2. 在html文件中直接写样式表时，可以通过@import文件导入外部样式；
  3. 下面是样式引用的例子；

     

    CssUse.html文件代码：

     

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">

    <head>

        <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">

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

        <title>CSS Use</title>

        <style type="text/css">

            @import url("http://localhost/cssUse/waysToImportCss.css");

            h2 { color: green; }

        </style>

    </head>

    <body>

        <h1>通过link连接的样式</h1>

        <p>通过link连接的样式</p>

        <h2>直接写的样式</h2>

        <a href="#">import导入的样式</a>

    </body>

    </html>

Direct.css文件代码：

    h1 { color: blue; }

p { color: yellow; }

waysToImportCss.css文件代码：

    a { padding: 0 5px;}

a:hover { color: lightblue; }

a:visited { color: yellow; }

从头开始学Web开发—CSS_01的更多相关文章

  1. 半吊子菜鸟学Web开发1 --配置开发环境

    先说说我自己的情况,我算是一个半吊子菜鸟,对web开发熟练度为0,但是对熟悉C++和Python 所以这里开始记录我学习Web开发的历程,看看我这里学习的程序,能够学到什么地方. 首先是配置环境,我的 ...

  2. 半吊子菜鸟学Web开发6 -- Vscode开发环境配置

    1vscode上手一周不到,终于弄出点门路,终于弄清楚了点vscode的设置是什么样子的了....哭 2就我这两天的使用来看,一般vscode默认只让打开一个文件夹,然后在你打开的文件夹里面自动生成 ...

  3. 菜鸟学WEB开发 ASP.NET 5.0 1.0

    在学习之初我要强调一点“微软要向跨平台开发”大举进军了,不管他能走多远,这是微软的必经之路. 一.学习流程: 创建ASP.NET APPLICATION 项目——项目结构——结构分析. 1.创建ASP ...

  4. 从头开始学eShopOnContainers——开发环境要求

    一.简介 eShopOnContainers是一个简化版的基于.NET Core和Docker等技术开发的面向微服务架构的参考应用,是一个简化版的在线商城/电子商务应用,其包含基于浏览器的Web应用. ...

  5. 半吊子菜鸟学Web开发5 -- PHP开发环境配置

    本文参考自:http://blog.csdn.net/angon823/article/details/54415855 Ubuntu16.04 默认 apt-get install apache2  ...

  6. 半吊子菜鸟学Web开发2 --JavaScript学习1

    JavaScript是一种类C的语言,对于我来说学起来还是蛮轻松的 1 输出 console.log(**); 相当于print console.assert(*);弹窗 2 变量 JS是动态变量 类 ...

  7. 半吊子菜鸟学Web开发 -- PHP学习5-数据库

    数据库 1 进行数据库操作的步骤 连接数据库 mysqli_connect 选择数据库 mysqli_select_db 设置文件编码 mysqli_query("set name utf- ...

  8. 半吊子菜鸟学Web开发 -- PHP学习 1-基础语法

    1索引数组 $fruit = array("苹果","香蕉","菠萝"): print_r($fruit); 索引数组的初始化,有三种方式: ...

  9. 半吊子菜鸟学Web开发 -- PHP学习 4 --异常

    PHP异常处理 1 抛出一个异常 与Python的try except类似,PHP用try catch来捕获异常 基本语法 try{ //可能出现错误或异常的代码 //catch表示捕获,Except ...

随机推荐

  1. 马尔科夫链在第n步转移的状态的概率分布

  2. Nested Classes

    http://docs.oracle.com/javase/tutorial/java/javaOO/nested.html package priceton; /* * Copyright (c) ...

  3. git服务的安装和使用

    参考文章 http://www.centoscn.com/image-text/install/2014/0514/2972.html 1.搭建Git服务器yum安装Git服务器创建一个git用户,用 ...

  4. 在命令符模式下编译并执行Java程序

    对于Java初学者,建议使用纯文本文件来编写Java程序,并在命令符模式下使用工具程序编译和执行Java程序.使用javac工具编译.java,使用java工具执行.class.(推荐sublime编 ...

  5. Java线程池的配置

    1.ThreadPoolExecutor的重要参数 1.corePoolSize:核心线程数 * 核心线程会一直存活,及时没有任务需要执行 * 当线程数小于核心线程数时,即使有线程空闲,线程池也会优先 ...

  6. C ~ 指针零散记录

    2016.10.11 一个记录 void MB_float_u16(float f,uint16_t *a,uint16_t *b) { uint8_t *fp; ① uint8_t *ap; ② a ...

  7. drawable animation基础

    动画配置<animation-list xmlns:android="http://schemas.android.com/apk/res/android" android: ...

  8. Machine Learning No.7: Support Vector Machines

    1. SVM hypothsis 2. large margin classification 3. kernals and similarity if  f1 = 1; if x if far fr ...

  9. BZOJ 3083 遥远的国度 树链剖分+线段树

    有换根的树链剖分的裸题. 在换根的时候注意讨论. 注意数据范围要开unsigned int或longlong #include<iostream> #include<cstdio&g ...

  10. 算法（Algorithms）第4版 练习 1.3.11

    主要思路: 这个和Dijkstrad的双栈算法不太一样,后缀的计算只需要一个栈即可. 用一个栈来存数字栈即可. 遇到数字,压栈. 遇到运算法,从栈中弹出相应的数字,用该运算法计算得到结果. 再次压入栈 ...