1、使用行内样式表

语法:在标签内部写入一个style属性。

优点:没有样式表文件,在某些时候可以提高效率;

优先级高。

缺点:多个页面难以共享样式,不利于代码复用;

HTML和CSS代码混杂,不利于程序员和搜索引擎阅读。

2、使用内部样式表

语法:在head标签写一个style标签,在style标签里面通过选择器(元素选择器、类选择器、ID选择器)来选择标签,从而控制该标签的样式。

优点:没有样式表文件,在某些时候可以提高效率;

缺点:多个页面难以共享样式,不利于代码复用,只能单个页面使用;

HTML和CSS代码混杂,不利于程序员和搜索引擎阅读。

3、外部样式表

语法:(1)需要新建一个外部CSS文件,在里面书写CSS样式;

(2)在head标签里面通过link来关联外部CSS文件。

例如:<link rel="stylesheet" href="css/style.css">,这样就可以在HTML文档里面直接书写界面的内容,在css文件里面调整格式,设计样式了。

优点:实现了内容结构和表现形式代码分离,方便复用和维护;

使HTML代码更加纯净,有利于程序员和搜索引擎阅读。

HTML-css样式引用方式的更多相关文章

  1. CSS 选择器及各样式引用方式

    Css :层叠样式表 (Cascading Style Sheets),定义了如何显示HTML元素. 目录 1. 选择器的分类:介绍ID.class.元素名称.符合.层次.伪类.属性选择器. 2. 样 ...

  2. CSS基础知识总结之css样式引用的三种方式

    在html中增加css样式有三种: 1.在标签中增加style属性: <!DOCTYPE html> <html lang="en" xmlns="ht ...

  3. CSS-使用CSS样式的方式

    1.HTML<!DOCTYPE>声明标签 (1)定义和用法 <!DOCTYPE>声明必须是HTML文档的第一行,位于<html>标签之前. <!DOCTYPE ...

  4. web前端(7)—— 了解CSS样式,引入css样式的方式

    CSS 在前面大概的介绍了css,从本片博文开始,会详细的介绍它,在最开始介绍web前端时,打开百度首页,当时我提出了一个问题,为什么百度首页的输入框可以放在正中间,就是由于有css的控制,我们可以打 ...

  5. css样式引入方式,及常用设置标签样式

    一. 三种样式引入方式   1. 内联式-直接写在div标签中,不推荐用 <div style="color:red;font-size:20px;font-family:'Micro ...

  6. CSS的引用方式(引用外部样式表、内部样式表、内联样式表)

    CSS引用外部样式表的优点:一般的浏览器都带有缓存功能,所以用户不用每次都下载此CSS文件,所以外部引用相对于内部引用和内联引用来说是是节省资源的. CSS使用内部样式表.内联样式表的优点:可以直观的 ...

  7. css基础 引用方式 标签选择器 优先级 各式布局

    今天讲的css基础,了解了css即层叠式表,是美化网页,控制页面的样式. 样式表引进网页的3种方式1内联式,语法例子:<div style="width: 100px;height: ...

  8. 测开之路九十:css的引用方式

    第一种:内联,直接在标签里面加style属性,优先级别最高,但是不利于维护 第二种:页面嵌入,在head标签里面写一个style标签,以类选择器的形式写入,优先级别第二 第三种:外联,样式表链接,单独 ...

  9. 四种CSS样式的引入方式

    准备 1.首先准备一个html文件:test.html,不建议使用记事本创建文件,建议使用Notepad++来创建并编辑文件,注意编码格式为:以UTF-8无BOM格式编码,否则会出现中文乱码,内容如下 ...

随机推荐

  1. mysql datetime timestamp区别

    timestamp 支持数据库级UTC 时区 datetime 不支持  timestamp占4个字节 datetime占8个字节 timestamp所能存储的时间范围为:'1970-01-01 00 ...

  2. Jenkins教程——从安装到部署Docker服务(一)安装Jenkins

    前言 写了好久Jenkins的脚本了,写得虽然不是太好,但是可以基本满足需要,最近比较忙,这个月也没怎么更新博客,开始更新Jenkins这个系列的文章,打算从安装Jenkins -> 流水线工程 ...

  3. HDU 6040

    题意略. 思路:题目就是在询问你m次,第k小是哪个数.首先我们可以想到直接排序后,即可O(1)来查找询问.但是题目中n的范围给的是1e7, 无法承受nlogn的复杂度.从而想到另外一种求静态第k小的方 ...

  4. Leetcode之二分法专题-35. 搜索插入位置(Search Insert Position)

    Leetcode之二分法专题-35. 搜索插入位置(Search Insert Position) 给定一个排序数组和一个目标值,在数组中找到目标值,并返回其索引.如果目标值不存在于数组中,返回它将会 ...

  5. 【转载】Windows api数据类型

    最近在接触windows api函数,看到了很多之前没有看到过的数据类型,发现“个人图书馆”中有个帖子说的挺详细的,特地搬运过来 Windows 数据类型 Delphi 数据类型 描述 LPSTR P ...

  6. fiddler的安装与使用(二)使用fiddler捕获会话信息

    前章回顾: 上一遍文章我们已经安装好了fiddler,并解了fiddler的工作原理,接下来开始使用fiddler捕获浏览器会话信息. fiddler基本界面: 首先启动fiddler,然后打开浏览器 ...

  7. hdu 6092 Rikka with Subset(多重背包)

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=6092 #include <cstdio> #include <iostream> ...

  8. codeforces 454 E. Little Pony and Summer Sun Celebration(构造+思维)

    题目链接:http://codeforces.com/contest/454/problem/E 题意:给出n个点和m条边,要求每一个点要走指定的奇数次或者是偶数次. 构造出一种走法. 题解:可能一开 ...

  9. Hexo博客Next v7.X 主题升级,美化警示录

    本文转载于:Hexo博客Next v7.X 主题升级,美化警示录丨奥怪的小栈 前言 经历了好几天(懒癌晚期懒得数了)的与主题升级斗争后,我终于完成基本上完成了next主题的升级!升到了V7.3!哈哈哈 ...

  10. 【Offer】[62] 【圆圈中最后剩下的数字】

    题目描述 思路分析 测试用例 Java代码 代码链接 题目描述 0,1,,n-1这n个数字排成一个圆圈,从数字0开始,每次从这个圆圈里删除第m个数字.求出这个圆圈里剩下的最后一个数字. 牛客网刷题地址 ...