css快速入门-引入方式
一、概述
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快速入门-引入方式的更多相关文章
- 02-03 CSS快速入门
css四种引入方式:test.html: p{ color: gold; font-size: 20px; } title.html: <!DOCTYPE html> <html l ...
- 前端基础----CSS语法、CSS四种引入方式、CSS选择器、CSS属性操作
一.CSS语法 CSS 规则由两个主要的部分构成:选择器,以及一条或多条声明. 例如: h1 {color:red; font-size:14px;} 二.CSS四种引入方式 1,行内式 行内式是在标 ...
- 前端 CSS 三种引入方式
CSS三种引入方式 行内样式 内接样式 外部样式 链接式 导入式 行内样式 就是在标签加上style属性设置样式 <!DOCTYPE html> <html lang="e ...
- 006 CSS三种引入方式
CSS三种引入方式 一.三种方式的书写规范 1.行间式 <div style="width: 100px; height: 100px; background-color: red&q ...
- Python 45 css三种引入方式以及优先级
一:css三种引入方式 三种方式为:行间式 | 内联式 | 外联式 行间式 1.在标签头部的style属性内 2.属性值满足的是css语法 3.属性值用key:value形式赋值,value具 ...
- css三种引入方式以及其优先级的说法
css 三种引入方式 方式一:行间式 1.在标签头部的style属性内 2.属性值满足css语法 3.属性值用key:value形式赋值,value具有单位 4.属性值之间用 分号 : ...
- CSS快速入门(四)
目录 CSS快速入门(四) 浮动 float属性 clear属性 浮动解决的问题及其影响 解决父标签塌陷的方法 浮动案例 定位 什么是脱离文档流 定位的两种方法 position定位 static定位 ...
- HTML/CSS快速入门
Web概念 JavaWeb 使用java语言开发基于互联网的项目 软件架构 C/S架构:Client/Server 客户端/服务器 用户本地有一个客户端程序,在远程有一个服务端程序 如QQ,英雄联盟. ...
- Html与CSS快速入门01-基础概念
Web前端技术一直是自己的薄弱环节,经常为了调节一个简单的样式花费大量的时间.最近趁着在做前端部分的开发,果断把这部分知识成体系的恶补一下.内容相对都比较简单,很类似工具手册的学习,但目标是熟练掌握. ...
随机推荐
- 个人作业——APP案例分析
APP--饿了么:平台--Android 第一部分 调研, 评测 1 个人上手体验 首先送上APP截图一张: 相信很多学生都用过这个APP了,第一次使用都是因为新用户有大额的满减优惠才下载这个APP使 ...
- SGU---107 水题
题目链接: http://codeforces.com/problemsets/acmsguru/problem/99999/107 题目大意: 求n位数有多少个的平方末尾是987654321 思路: ...
- AOP:选择正确的时机进行编织
在本文中,我们将采用三种重要的实现的例子,来实践本文提出的概念.这三种 AOP 实现是 AspectJ,Spring 和 JBoss.通过比较他们在 Weave 时机方面的不同,来获得对于如何选择 W ...
- ssh无密码登陆远程机,pssh轻批量工具
#B(client)--------A(g_server)#A: ssh-keygen -t rsa (g_server)#B: scp -P 58422 root@g_server_ip: ...
- tomcat服务器宕机解决方案
报错信息: java.lang.Object.wait(Native Method) java.lang.ref.ReferenceQueue.remove(ReferenceQueue.java:1 ...
- 集合之fail-fast机制
在JDK的Collection中我们时常会看到类似于这样的话: 例如,ArrayList: 注意,迭代器的快速失败行为无法得到保证,因为一般来说,不可能对是否出现不同步并发修改做出任何硬性保证.快速失 ...
- PAT乙级1036
1036 跟奥巴马一起编程 (15 分) 美国总统奥巴马不仅呼吁所有人都学习编程,甚至以身作则编写代码,成为美国历史上首位编写计算机代码的总统.2014 年底,为庆祝“计算机科学教育周”正式启动, ...
- P2758 编辑距离
题目描述 设A和B是两个字符串.我们要用最少的字符操作次数,将字符串A转换为字符串B.这里所说的字符操作共有三种: 1.删除一个字符: 2.插入一个字符: 3.将一个字符改为另一个字符: !皆为小写字 ...
- B. Vile Grasshoppers
http://codeforces.com/problemset/problem/937/B The weather is fine today and hence it's high time to ...
- HihoCoder - 1336 二维数状数组(单点更新 区间查询)
You are given an N × N matrix. At the beginning every element is 0. Write a program supporting 2 ope ...