link常见用途

<link> 标签最常见的用途是链接样式表，在 HTML 中，<link> 标签没有结束标签，此元素只能存在于 head 部分，不过它可出现任何次数。

<head>

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

</head>

使用link引用网页收藏夹图标

<link rel="icon" href="favicon.ico" type="image/x-icon" />

css引入方式

1、内联css文件，在html文件的head部分，用style标签包裹

<head>

    <meta charset="UTF-8">

    <title>Title</title>

    <style>

        p{

　　　　　　background-color:red;

        　　color: black

　　　　　　}

    </style>

 <style>

        div{background-color:chartreuse;

        color: coral}

  </style>

</head>

最长见得就是访问量大的门户网站。或者访问量较大的企业网站的首页。

优点：速度 快，所有的CSS控制都是针对本页面标签的，没有多余的ＣＳＳ命令；再者不用外链ＣＳＳ文件，节省了请求开销。直接在ＨＴＭＬ文档中读取样式。

缺点：改版麻烦些，单个页 面显得臃肿，ＣＳＳ不能被其他ＨＴＭＬ引用造成代码量相对较多，维护也麻烦些。

2、行内样式，在标签的属性里

<p style="background-color: aquamarine;color: black">Jay</p>

3、使用@import导入

<head>

    <meta charset="UTF-8">

    <title>Title</title>

    <style>

        @import "css3.css";

    </style>

</head>

@import有数量限制，且是先等网页加载完再引入样式，如果网页足够大，则可能出现闪烁，就是漫长的无样式网页加载之后，css突然出来。

4、使用link引入外部链接

<head>

    <meta charset="UTF-8">

    <title>Title</title>

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

</head>

link是html加载前就引用，等dom树生成好后和样式表结合生成渲染树，浏览器再开始渲染页面，不会出现闪烁

样式引入优先级

行内样式优先级最高

内联样式，链接样式表，导入样式表，谁写在下面以谁为准。

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

    <!--内部部样式表-->

  <style type="text/css">

    p{

      color: blue;

    }

  </style>

选择器优先级

基础的优先级：ID选择器>类选择器>标签选择器

权重的计算

内联样式和!import  权值1000

ID选择器 权值100

类，伪类和属性选择器 权值10

类型（标签）选择器和伪元素选择器 权值1

通配符、子选择器、相邻选择器等 权值0000

继承的样式没有权值

link标签和css引入方式的更多相关文章

  1. css引入方式和基本样式

    css的三种引入方式: 1.内嵌:直接在标签中添加style属性 格式:<标签名 style="样式1:样式值1:样式2=样式值2:"></标签名> 2.内 ...

  2. css引入方式

    1.<style>          body{}    </style> 2.写在一个单独的文件里面保存即新建一个文件:xx.css; 注明该文件的位置<link re ...

  3. CSS引入方式的区别详解

    在web前端开发中,CSS是一种用来表现HTML或XML等文件样式的语言.很多处于web前端初学阶段的朋友,很多人都不知道CSS引入方式存在三种方法,css引入方式分别为标签内联书写.页面头部书写.外 ...

  4. 关于CSS引入方式的详细见解

    关于CSS的发展史这里不做介绍.写博客的原因之一是想帮助那些与我一样喜欢纠结的初入前端的伙伴,希望自己写的帖子能对伙伴有些许帮助:原因之二这些帖子也算自己的一个知识的整理.现在还没有一定的顺序可循,但 ...

  5. 认识CSS中css引入方式、选择器、文本样式设置以及显示模式

    前端之HTML.CSS(三) CSS CSS-Cascading Styles Sheets,层叠样式表.用于网页的表现,主要用于布局和修饰网页. CSS引入方式 CSS的三种引入方式:行内样式,内部 ...

  6. 项目复习期总结3：CSS引入方式，凝视，命名规范，背景，行高，文本属性

    文件夹: 1.CSS凝视的书写 怎么写?优点? 2.CSS引入方式  各种的优缺点 3.选择器的写法与选择器的优先级 4.CSS命名规范 5.背景,行高 6.文本(text与font开头)等全部属性 ...

  7. css 基础 css引入方式

    color:red; //改变颜色 font-size:18px : //改变文字大小 background-color : blue; //设置背景颜色 width:100px ://设置宽度 he ...

  8. 【使用DIV+CSS重写网站首页案例】CSS引入方式

    CSS引入方式(3种) *就近原则:行内引入可以覆盖内部引入的效果 内部引入: *  type="text/css"      为默认可以不写 例子: <!DOCTYPE h ...

  9. python全栈开发 * 表格标签 表单标签 css 引入方式 * 180807

    html部分 一.表格标签<table> 1.一个表格<table>由每行<tr>组成的,每行是由<td>组成的. 注意: 一个表格是由行组成的(行是由 ...

随机推荐

  1. '新', '泽' - ImageMagick - UTF-8非最短形式及编码安全问题

    最近偶然发现,把软件放到 [新建文件夹]  中,ImageMagick 竟无法正常的加载图片了. 我去!什么情况? 抛出的错误是找不到相关的dll,软件中已对中文进行了utf-8编码,这几年来一直没发 ...

  2. bfs退出条件

    找到结果即退出? Possibly Not! 如拓展(x)将导致距离增加0(x)或1(x+1),[这种情况用优先队列] 那么该拓展得到的结果也许并不是最优的,后面还有x. 所以最好的是遍历(不知怎么说 ...

  3. tensorflow中tf.ConfigProto()用法解释

    在看C3D代码的时候,看见有一段代码是 config = tf.ConfigProto()#主要是配置tf.Session的运行方式,GPU还是CPU,在这里选择的是GPU的运行方式 config.g ...

  4. jquery+ajax无刷新加载数据，新闻浏览更多

      <script type="text/javascript"> $(document).ready(function (){ $(window).scroll(fu ...

  5. SpringCloud之Hystrix断路器以及dashboard 属性详解

    1.自定义hystrixCommand: https://blog.csdn.net/u012702547/article/details/78032191?utm_source=tuicool&am ...

  6. GD32 ------ 使用外部中断，中断函数需要延时才能读到真正电平

    MCU:GD32F103RCT6 中断引脚没有外界上拉电阻 中断配置如下: RCC_APB2PeriphClockCmd(RCC_APB2Periph_GPIOC|RCC_APB2Periph_AFI ...

  7. 为什么wait()和notify()属于Object类

    关于wait()暂停的是持有锁的对象,所以想调用wait()必须为:对象.wait(); notify()唤醒的是等待锁的对象,调用:对象.notify(); 如下: Object obj = new ...

  8. 2017-12-14python全栈9期第一天第二节之初始计算机系统

    CPU:相当于人的大脑.用于计算 内存:储存数据.4G.8G.32G....成本高.断电即消失 硬盘:固态.机械.长久保存数据+文件 操作系统: 应用程序:

  9. ADC触摸屏

    目录 ADC触摸屏 硬件原理 等效电路 测量逻辑 程序设计(一)获得ADC 寄存器初始化 中断初始化 ADC模式(中断.测量) 中断函数 程序设计(二)获得坐标 生产者与消费者 ADC获取 程序优化 ...

  10. centos的用户、组权限、添加删除用户等操作的详细操作命令

    1.Linux操作系统是多用户多任务操作系统,包括用户账户和组账户两种 细分用户账户(普通用户账户,超级用户账户)除了用户账户以为还 有组账户所谓组账户就是用户账户的集合,centos组中有两种类型, ...