年年有"余"

 找回密码
 立即注册

QQ登录

只需一步,快速开始

查看: 2214|回复: 0

CSS样式的几种引用方式

[复制链接]
  • TA的每日心情
    奋斗
    2022-12-13 21:26
  • 签到天数: 371 天

    [LV.9]以坛为家II

    发表于 2015-7-13 21:36:50 | 显示全部楼层 |阅读模式
    本帖最后由 Sian 于 2015-7-13 23:04 编辑

    1、内联样式/行内样式

    如:<p style="color:red">红色文字</p>
    PS:该方式只对当前p标签生效,一般针对个别标签个性化设置采用此方式

    2、嵌入式样式表

    在<head>标签内加<style>标签,如:
    <head>
            <style type="text/css">
                    p{
                            color: red;
                    }
            </style>
    </head>

    PS:该方式对当前页面所有p标签生效,临时页面一般采用此方式,样式与内容在同一个文件中完成。

    3、导入外部样式表

    在<head>标签内加<style>标签,但不直接写样式,而是通过@import导入外部CSS文件如:
    <head>
            <style type="text/css">

                   @import url("*.css");


            </style>
    </head>
    PS:该方式对当前页面全局标签生效,即CSS文件中涉及的标签属性均会产生效果,效果等同于嵌入式,使用较少

    4、链入外部样式表

    在<head>标签内加<link>标签,通过link标签属性链入外部CSS文件,如:
    <link rel="stylesheet" type="text/css" href="*.css">
    PS:该方式对当前页面全局标签生效,即CSS文件中涉及的标签属性均会产生效果,实际项目中常用此方式,内容结构与样式分离!

    优先级:由高到低分别为:内联 > 嵌入 > 链入 > 导入
    您需要登录后才可以回帖 登录 | 立即注册

    本版积分规则

    手机版|小黑屋|Archiver|iOS开发笔记 ( 湘ICP备14010846号 )

    GMT+8, 2024-3-28 17:22 , Processed in 0.043226 second(s), 18 queries .

    Powered by Discuz! X3.4

    Copyright © 2001-2021, Tencent Cloud.

    快速回复 返回顶部 返回列表