CSS样式学习-1
一、分类
①内联，写在标签中，写法是style="样式属性"。优先级最高。
优点：控制精确。缺点：代码重用性差，范围小。
例如：
<div style="font-size=12px;"></div>
②内嵌，在<head></head>中书写。
优点：代码重用性好，范围大。缺点：控制性差，不精确。优先级最差。
注释方法：/*注释内容*/
例如：
<style type="text/css" >
/*这是要被注释内容*/
</style>
③外部，在<head></head>中书写。
优点：代码重用性最好，范围最大。缺点：控制性差。优先级中。
使用<link />标签引用外部css。
例如：
<head>
<link src="Untitled.css" />
</head>
二、选择器
①元素命名，id、class
*号是指所有。
*{}对所有元素增加样式。
②获取id
#id{}选择id名称是“id”的元素，id具有唯一性。
③获取class
.class{}获取class名称是“class”的元素，class可以命名多个元素。
④标签选择器
格式为：标签名{}
,并列
空格后代
.点筛选
例如：
<head>
<style type="text/css">
div{}/*标签选择器*/
#a{}/*id选择器*/
.b{}/*类级选择器*/
div #a{}/*空格后代，div标签下的span标签*/
div, font{}/*逗号并列，div和font标签*/
</style>
</head> <body>
<div>
<span id="a">
</span>
</div>
<font class="b">
</font>
</body>
CSS样式学习-1的更多相关文章
- 11种常用css样式学习大结局滚动条与显示隐藏
滚动条展示 overflow-x: hidden;/*是否对内容的左/右边缘进行裁剪*/overflow-y: hidden;/*是否对内容的上/下边缘进行裁剪*/overflow:scroll;/* ...
- bootstrap全局CSS样式学习
参考http://v3.bootcss.com/css/,根据自己的记忆进行的复述,加深记忆. 首先介绍bootstrap全局CSS样式 只通过使用bootstrap.css,即可获得统一的样式设置. ...
- Boostrap入门级css样式学习
1. 自适应网页设计 首先,在网页代码的头部,加入一行 viewport元标签.viewport是网页默认的宽度和高度, <meta name="viewport" cont ...
- 2019-02-15 CSS样式学习——（内容来自mooc北京林业大学web前端开发授课ppt）
CSS样式的添加方法 行内样式 e.x. 内嵌样式 e.x. 注意内嵌样式写在head标签内: 单独文件(外部式样式表文件) 也是在head标签内插入超链接,sublime+emmet可以用link: ...
- css样式学习笔记
视频参见php中文网玉女心经视频教程 讲解的相当的清楚和明白 第1章 :css快速入门 1.1 什么是css 改变html框架的样式. 1.2 css的三种引入形式 第一种形式 ...
- html之CSS样式学习笔记
本文内容: 字体样式 文本样式 背景样式 尺寸样式 盒子模型 边框样式 边距样式 浮动布局 定位布局 [CSS3]伸缩布局 标签显示方式 列表样式 [CSS3]过渡样式 [CSS3]变换样式之2D变形 ...
- CSS样式学习-3、轮廓、伪类/元素、display-flex布局
一.轮廓 outline绘制于元素周围的一条线,位于边框边缘外围. 属性规定元素轮廓的样式.颜色.宽度. outline-width轮廓宽度,属性:thin细轮廓.medium中等(默认值).thic ...
- css样式学习小知识
1. 使用百分比设置宽高 自适用宽高的,有分割的区域,可以适用百分比:30% 70% 如果有一部分是固定的宽度或者高度,可以使用:height: calc( 100% - 36px ); 2. inp ...
- bootstrap 学习 ---css样式学习
bootstrap 适用于响应式布局,移动设备优先的web项目 1.学习bootstrap需要引入bootstrap的css,jquery,bootstrap的js,注意:jquery文件必须在boo ...
随机推荐
- db2报错: [DB2/NT] SQL0952N 由于中断,处理被取消 SQLSTATE=57014
DB2被中断,报错: [DB2/NT] SQL0952N 由于中断,处理被取消 SQLSTATE=57014 在DB2的开发过程中,今日运行了一个执行时间较为长的sql语句.使用DB2服务端的控制台 ...
- document.write的用处!
document.write是JavaScript中对document.open所开启的文档流(document stream操作的API方法,它能够直接在文档流中写入字符串,一旦文档流已经关闭,那d ...
- elastic-job 新手指南&官网指南
elastic-job 新手指南 Elastic-Job——分布式定时任务框架 官网帮助文档
- 廖雪峰Java2面向对象编程-6Java核心类-5枚举类
直接定义常量 public class Weekday { //定义int常量 public static final int SUN = 0; public static final int MON ...
- linux删除文件夹下除了某一个文件之外的所有文件及find用法
原文: https://www.jb51.net/article/99319.htm 比如一个目录下有1,2,3,4,5这五个文件,现在我需要删除除了2以外的所有文件,那么我可以使用 find . ! ...
- Linux平台下源码安装mysql多实例数据库
Linux平台下源码安装mysql多实例数据库[root@linux-node1 ~]# netstat -tlunp | grep 330tcp6 0 0 :::3306 :::* LISTEN 6 ...
- CentOS设置网络，设置IP地址
1.登录CentOS. 2.# dhclient 自动获取IP地址 3.# ip addr 1).第一个地址127.0.0.1是回环地址,网卡名叫做lo,Windows操作系统也有该地址,用来和自己通 ...
- 第10课 std::bind和std::function（1）_可调用对象
1. 几种可调用对象(Callable Objects) (1)普通函数指针或类成员的函数指针 (2)具有operator()成员函数的类对象(仿函数).如c++11中的std::function类模 ...
- web前端 3大储存 Cookie、localStorge、sessionStorage
Cookie: //setCookie function setCookie(name,value){ var Days = 30; var exp = new Date(); exp.setTime ...
- WordPress整站轻松开启HTTPS
近两年来HTTPS取代HTTP已经成为大势所趋.早在2014年google Chromium安全团队提议将所有的HTTP协议网站标注为不安全.现在,Chrome浏览器已经开始执行这一标准了.从 Chr ...