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. ubuntu-18.10 虚拟机 配置网络环境

    查询主机系统ip 使用virtualbox 设置网络模式为桥接模式 设置静态 ip 与网关 关闭防火墙 sudo ufw disable

  2. 给定n个十六进制正整数,输出它们对应的八进制数。

    问题描述 给定n个十六进制正整数,输出它们对应的八进制数. 输入格式 输入的第一行为一个正整数n (1<=n<=10). 接下来n行,每行一个由0~9.大写字母A~F组成的字符串,表示要转 ...

  3. hbase性能优化,看这篇就够了

    HDFS(hdfs-site.xml)相关调整 dfs.datanode.synconclose = true dfs.datanode.synconclose set to false in hdf ...

  4. OSG与Shader的结合使用

    目录 1. 概述 2. 固定管线着色 3. 纹理着色 4. 参考 1. 概述 以往在OpenGL中学习渲染管线的时候,是依次按照申请数据.传送缓冲区.顶点着色器.片元着色器这几个步骤编程的.OSG是O ...

  5. 变量、常量、input、if语句

    Chapter2 Python基础 2.1 变量命名规则 字母.数字.下划线组成 不能数字开头 不能使用python中的关键字 变量名具有意义 推荐驼峰(ArvinGood).或者下划线方式 (arv ...

  6. springboot之additional-spring-configuration-metadata.json自定义提示

    springboot之additional-spring-configuration-metadata.json自定义提示 简介 additional-spring-configuration-met ...

  7. Leetcode之回溯法专题-131. 分割回文串(Palindrome Partitioning)

    Leetcode之回溯法专题-131. 分割回文串(Palindrome Partitioning) 给定一个字符串 s,将 s 分割成一些子串,使每个子串都是回文串. 返回 s 所有可能的分割方案. ...

  8. Python之流程控制——while循环

    Python之流程控制--while循环 一.语法 while 条件: 执行代码 while就是当的意思,它指当其后面的条件成立,就执行while下面的代码. 例:写一个从0打印到10的程序 coun ...

  9. 传入值参数&传入引用参数的区别

    传值&传引用 1.传值 是把实参的值赋值给行参 那么对行参的修改,不会影响实参的值 2.传地址 是传值的一种特殊方式,只是他传递的是地址 那么传地址以后,实参和行参都指向同一个对象 3.传引用 ...

  10. ccpc网赛 hdu6703 array(权值线段树

    http://acm.hdu.edu.cn/showproblem.php?pid=6703 大意:给一个n个元素的数组,其中所有元素都是不重复的[1,n]. 两种操作: 将pos位置元素+1e7 查 ...