CSS样式表基础
CSS的样式表其实就是美观页面的，加一些样式。
一、样式表的三种分类：
①内联样式：写在某一个标签里面的样式。
优点：控制精确。
缺点：代码重用性差。（太多了不好写）
页面代码乱。（太乱，后期不方便看）
优先级最高！！
②内嵌样式：嵌在某一个页面里的。（是写在<head>里面，专门用来写样式）
需要添加一个标签：
<style lype="lexl/css"></style>
优点：代码重用性好。（一起找到很多元素，统一加上一个样式，写一遍可以）
缺点：控制不精确
优先级其次！！
③外部样式表。
优点：代码重用性最好。（可以对所有页面的标签实现统一样式）
缺点：控制最不精确。
优先级和内嵌一样！！
如果写的代码很多的情况下，建议使用外部样式表。
二、选择器
1、标签选择器
A：*（所有元素）{color（所加样式）="颜色"}【优先级最低】
B：# id选择器（准确的找到一个元素）【优先级最高】
例：在<boby>里面的<div>属性里标注id=""，再去上面标注出来进行更改样式。
#+id的名字{设置样式color="颜色"}
C：. class选择器 （一句话统一多个元素。）【优先级一般】
例：多个<div class="命名1">属性中统一class名。再去上面标注出来进行更改样式。
D：<span>或<div>标签选择器 【优先级一般】
例：span{color（所加样式）="颜色"}
标签选择器>*(所有）
class选择器>标签选择器
id选择器>class
越精确的优先级越高。
2、复合选择器
①逗号：代表并列的关系
例：让div和span全部加上样式。
div,span{
font-size: 50px;
}
②空格（代表后代关系）
③点筛选
在选择器里面代表class.
但这里点代表筛选。
筛选点.只适用于class的情况下才能筛选。慎用！
CSS样式表基础的更多相关文章
- WEB入门三 CSS样式表基础
学习内容 Ø CSS的基本语法 Ø CSS选择器 Ø 常见的CSS样式 Ø 网页中3种使用CSS的方式 能力目标 Ø 理解CSS的 ...
- CSS样式表基础知识、样式表的分类及选择器
一.CSS基本概念: CSS(Cascading Style Sheet,叠层样式表),作用是美化HTML网页. /*注释区域*/ 此为注释语法 二.样式表的分类 1.内联样式表(和html联合 ...
- css 样式表 基础 样式
1大小 width 宽度 height 高度 2 背景 background-color 背景色 background-image:url(图片位置) 背景图片 background-repeat: ...
- HTML基础（三）——css样式表
CSS(Cascading Style Sheet,叠层样式表),作用是美化HTML网页. /*注释区域*/此为注释语法 一.样式表 (一)样式表的分类 1.内联样式表 和HTML联合显示,控制精确, ...
- 一起学HTML基础-CSS样式表-基本概念、分类、选择器
一.基本概念: CSS (Cascading Style Sheets)层叠样式表,是一种用来表现HTML(标准通用标记语言的一个应用)或XML(标准通用标记语言的一个子集)等文件样式的计算机语言. ...
- html基础 CSS样式表
CSS(Cascading Style Sheet,叠层样式表),作用是美化HTML网页. /*注释区域*/此为注释语法 一.样式表 (一)样式表的分类 1.内联样式表 和HTML联合显示,控制精确, ...
- CSS样式表继承详解
最近在恶补css样式表的基础知识.上次研究了css样式表之冲突问题详解 .这次是对 css 继承 特性的学习. 什么是css 继承?要想了解css样式表的继承,我们先从文档树(HTML DOM)开始. ...
- CSS样式表初学，比C#和JS简单
今天咱们一起来看下CSS样式表的基本基础 经常看博客或者喜欢钻研代码这一类的人对CSS可能有所耳闻,但具体的可能不是很清楚 那什么是CSS呢?与HTML又有什么区别呢?今天咱们就来说道下这个CSS C ...
- CSS样式----CSS样式表的继承性和层叠性（图文详解）
本文最初于2017-07-29发表于博客园,并在GitHub上持续更新前端的系列文章.欢迎在GitHub上关注我,一起入门和进阶前端. 以下是正文. 本文重点 CSS的继承性 CSS的层叠性 计算权重 ...
随机推荐
- 2016福州大学软件工程第二次团队作业——预则立&&他山之石成绩统计
第二次团队作业--预则立&&他山之石成绩统计结果如下: T:团队成绩 P:个人贡献比 T+P:折算个人成绩,计算公式为T+T/15*团队人数*P 学号 组别 Team P T+P 03 ...
- 11 Set和Map数据结构
Set和Map数据结构 Set WeakSet Map WeakMap 首先 这四个对象都是 数据结构. 用于存放数据 Set 类似数组. 但是不能重复. 如果你有重复数据,会自动忽略 属性 size ...
- TThread.CreateAnonymousThread() 匿名线程对象的应用
unit Unit1; interface uses Winapi.Windows, Winapi.Messages, System.SysUtils, System.Variants, System ...
- Js异步上传加进度条
http://www.ruanyifeng.com/blog/2012/09/xmlhttprequest_level_2.html http://www.cnblogs.com/yuanlong10 ...
- Le lié à la légèreté semblait être et donc plus simple
Il est toutefois vraiment à partir www.runmasterfr.com/free-40-flyknit-2015-hommes-c-1_58_59.html de ...
- [Java] JSP笔记 - 自定义标签
自定义标签的创建步骤: 自定义标签的四大功能: 自定义标签的类结构: 在 1.0 中呢, 可以将 <body-content> 的值设置为 JSP, 2.0中则不允许在自定义标签体中出现j ...
- Oracle下批量将一个用户的所有表的select权限赋值给另外一个用户
起因 为什么会有这篇文章呢? 因为最近在做项目的时候遇到一个问题...实际生产环境中程序datasource登陆的Oracle数据库用户user1不是我们创建的.这个用户没有访问我们业务表的权限(因为 ...
- win10 64位专业版系统中显示32位dcom组件配置的方法
word.excel是32位的组件,当用户64位系统在运行窗口中输入dcomcnfg命令时,在打开的组件服务管理窗口,是找不到Microsoft Excel.word程序的.另外,Windows 环境 ...
- 现代软件工程作业-- GitHub的学习
1.注册github账号: 2.在github上面新建一个名为HelloWord的项目: 3.将本组的其他成员纳入到HelloWorld中: 4.复制远端仓库的地址: 5.在本地的git bash中使 ...
- 现代软件工程作业 第二章 学习github笔记
在网上大量资料的辅助下,学习了github的基本使用方法,尝试了一些常见的命令.为了便于记忆总结了自己的学习内容. 1.首先需要在github的官网上注册一个帐号,并新建一个repository,选这 ...