一、概述

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. Redis学习---CentOs/RedHat下Redis的安装

    redis是C语言开发,建议在linux上运行,本教程使用Centos6.4作为安装环境.      安装redis需要先将官网下载的源码进行编译,编译依赖gcc环境,如果没有gcc环境,需要安装gc ...

  2. Office 365实现单点登录系列(5)—配置单点登录

    这是单点登录系列的最后一篇文章,前面4篇文章其实都是在为这篇文章的内容做准备,我把这四篇文章的链接放在下面,如果大家有需要,可以参考我以下的链接: Office 365实现单点登录系列(1)—域环境搭 ...

  3. JAVA入门之程序设计环境搭建

    这篇文章写给刚接触或者想学JAVA的新朋友.学习JAVA,需要找一本好的入门书籍,推荐<Java从入门到精通>,然后就是JAVA程序设计开发环境的搭建. 首先,我们需要安装JAVA开发工具 ...

  4. 整体修改VS中C++工程和解决方案命名问题

    目标:将所有basestation相关的修改为PPPStream 首先,复制一份用于修改的解决方案文件夹,然后打开解决方案,如下图,左侧的两个basestation都重新命名为PPPStream. 第 ...

  5. #001 Emmet的API图片

    这个是一张Emmet的快捷键图片,里面包含了所有的快捷键. 虽然有很多的快捷键,但是常用的也就那么几个   .   样式 #  ID >  上下级节点 +  .col-md-8+.col-md- ...

  6. css-table属性运用

    最近在工作中遇到了一些不常用的布局,很多使用 CSS table 属性,并结合 ::before,::after 伪元素完成了,使得 HTML 的结构相对更简单,更具有语义性.当 HTML 结构越清晰 ...

  7. ubuntu 14.4 apache2 django

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

  8. [HAOI2018]奇怪的背包

    题目 暴力\(dp\)好有道理啊 于是我们来个反演吧 考虑一个体积序列\(\{v_1,v_2,...v_n\}\)能凑成\(w\)的条件 显然是 \[v_1x_1+v_2x_2+...+v_nx_n\ ...

  9. 利用Python实现12306爬虫--查票

    在上一篇文章(http://www.cnblogs.com/fangtaoa/p/8321449.html)中,我们实现了12306爬虫的登录功能,接下来,我们就来实现查票的功能. 其实实现查票的功能 ...

  10. 爬虫工具——Selenium和PhantomJS

    Selenium是一个Web的自动化测试工具,最初是为网站自动化测试而开发的,类型像我们玩游戏用的按键精灵,可以按指定的命令自动操作,不同是Selenium 可以直接运行在浏览器上,它支持所有主流的浏 ...