一、概述

HTML是骨架、框架
CSS是外表、衣服
JS是动作、肌肉

css的主要作用是对元素进行渲染。
1、找到要操作的标签(选择器)
2、对定位的标签进行操作(属性)

二、CSS引入方式

1、行内式

<p style="background-color:red">行内式</p>

2、内联式

在head标签内使用

<html>
<head>
<style>
div {
background-color:red;
}
div p {
background-color:green;
}
</style>
</head>
<body>
<div>sdfasdfasdfsdf
<p>asdfasfasdf</p>
</div>
</body>
</html>

3、外链式

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

4、导入式

<head>
<style type="text/css">
@import "test.css"
</style>
</head>

注意:
1、推荐使用外链式,简洁明了。
2、外链式中的rel="stylesheet"不能省略,type="text/css"可以省略。
3、@import引入文件时,有数量限制,而link没有。
4、导入式会在整个网页加载完成后再加载CSS文件,因此如果文件非常大的话,网页会有闪烁的情况出现。外链式一开始网页就会加载,所以不会有闪烁出现。

 

css快速入门-引入方式的更多相关文章

  1. 02-03 CSS快速入门

    css四种引入方式:test.html: p{ color: gold; font-size: 20px; } title.html: <!DOCTYPE html> <html l ...

  2. 前端基础----CSS语法、CSS四种引入方式、CSS选择器、CSS属性操作

    一.CSS语法 CSS 规则由两个主要的部分构成:选择器,以及一条或多条声明. 例如: h1 {color:red; font-size:14px;} 二.CSS四种引入方式 1,行内式 行内式是在标 ...

  3. 前端 CSS 三种引入方式

    CSS三种引入方式 行内样式 内接样式 外部样式 链接式 导入式 行内样式 就是在标签加上style属性设置样式 <!DOCTYPE html> <html lang="e ...

  4. 006 CSS三种引入方式

    CSS三种引入方式 一.三种方式的书写规范 1.行间式 <div style="width: 100px; height: 100px; background-color: red&q ...

  5. Python 45 css三种引入方式以及优先级

    一:css三种引入方式 三种方式为:行间式 | 内联式 | 外联式 行间式   1.在标签头部的style属性内  2.属性值满足的是css语法  3.属性值用key:value形式赋值,value具 ...

  6. css三种引入方式以及其优先级的说法

    css 三种引入方式 方式一:行间式 ​ 1.在标签头部的style属性内 ​ 2.属性值满足css语法 ​ 3.属性值用key:value形式赋值,value具有单位 ​ 4.属性值之间用 分号 : ...

  7. CSS快速入门(四)

    目录 CSS快速入门(四) 浮动 float属性 clear属性 浮动解决的问题及其影响 解决父标签塌陷的方法 浮动案例 定位 什么是脱离文档流 定位的两种方法 position定位 static定位 ...

  8. HTML/CSS快速入门

    Web概念 JavaWeb 使用java语言开发基于互联网的项目 软件架构 C/S架构:Client/Server 客户端/服务器 用户本地有一个客户端程序,在远程有一个服务端程序 如QQ,英雄联盟. ...

  9. Html与CSS快速入门01-基础概念

    Web前端技术一直是自己的薄弱环节,经常为了调节一个简单的样式花费大量的时间.最近趁着在做前端部分的开发,果断把这部分知识成体系的恶补一下.内容相对都比较简单,很类似工具手册的学习,但目标是熟练掌握. ...

随机推荐

  1. Forefront TMG 之 ISP 冗余传输链路(ISP-R)

    在 Forefront TMG 中,新增了ISP 冗余传输链路功能:在 TMG 中,你可以同时使用两条活动的外部链路,使用模式分为以下两种: 故障转移模式:在主要链路工作正常的情况下,所有的流量都通过 ...

  2. AllowOverride以及Options相关指令

    AllowOverride以及Options相关指令      httpd.conf是Apache的主要配置文件,但是针对每个目录,apache还允许在它们各自的目录下放置一个叫做.htacess的文 ...

  3. Hybris阶段总结(2)hybris架构

    年前总结一下这两个星期在SAP实习学到的一些东西 先上图: ​ 从底往上总结,之后会有个小例子来解释一下 1.Persistence layer 就是作为hybris所连接的数据库这一层,其中hybr ...

  4. socks5代理使用和安装配置

    Socks简介: 详情可以百度,不过我猜你对那一大堆术语也会像我一样觉得无语, 所以我觉得你可以简单理解为它可以比较完美代理http/ftp/smtp等多种协议的代理工具就行了. 其中最具有典型例子的 ...

  5. matlab中关于函数句柄、feval函数以及inline函数的解析 (转)

    http://blog.sina.com.cn/s/blog_7bff755b010180l3.html MATLAB函数句柄 函数句柄(Function handle)是MATLAB的一种数据类型. ...

  6. Z :彻底了解指针数组,数组指针以及函数指针 [复

    原创 :彻底了解指针数组,数组指针以及函数指针 [复制链接] 00 roking 白手起家 帖子 60 主题 16 精华 0 可用积分 74 专家积分 0 在线时间 0 小时 注册时间 2003-10 ...

  7. 原生js实现一个DIV的碰撞反弹运动,并且添加重力效果

    继上一篇... 原生js实现一个DIV的碰撞反弹运动,并且添加重力效果 关键在于边界检测,以及乘以的系数问题,实现代码并不难,如下: <!DOCTYPE html> <html la ...

  8. ubuntu 14.4 apache2 django

    记录下自己的配置过程以及遇见的问题. 系统: Ubuntu 14.04 64 系统内置Python版本:2.7.6 先声明,我一下操作都以root身份. 若登录是非root身份,请在命令前加sudo. ...

  9. python第十四课--排序及自定义函数之自定义函数(案例一)

    案例一: 演示自定义函数的使用:包含:1).定义格式的掌握2).函数的好处 自定义函数:实现打印矩形的操作两个原则需要考虑:1).有没有形参?有,2个 2).有没有返回值?没有. def printR ...

  10. js之点击值发生变化

    点击值发生变化,应用场景,比如像阿里云那样我通常密码是以******的形式存在,我必须要点击查看,它才会以明文显示. 在实际开发中,比如以智能门锁为例,安装门锁时,有个叫密码输入框的表单,这个是选填项 ...