CSS入门介绍(一)
css 层叠样式表(英文名:Cascading Style Sheets),主要用于美化网页
1、css的表现形式
1.1 行内样式(内嵌样式)
写在标签内的样式,写在标签的开始部分的内部,style属性当中,即<div style=" width="100px";height="100px" "></div>
1.2 内部样式(内联样式)
写在HTML页面中,存放于<head></head>标签当中,样式则写在style标签中。
<style>
选择器{
属性名2:属性值2;
属性名2:属性值2;
......
}
</style>
注意:style标签不要写在title标签上方
1.3 外部样式(外联样式)
写在css文件中,用的话,直接导入
<link type="text/css" rel="stylesheet" href="文件所在的路径" />
2、css三大特性:
2.1 继承
父级的样式会被子级给继承。
注意:!important不会被继承
2.2 层叠
当样式发生冲突的时候,样式会产生覆盖(层叠);
解决方法为判断优先级的先后顺序或计算权重。
2.3 优先级
优先级的先后顺序为:
!important > 内联样式 > ID > class(类) > 标签 > *(初始化) > 继承;
如果记不清楚的话,可以用权重来计算,
!important,权重值为10000;
行内样式,例如:<div style="样式属性名:样式属性值;···"></div>,权重值为1000;
ID名,例如:<p id="p"></p>,,权重值为100;
class,例如:<p class="p"></p>,权重值为10;
标签,例如:p、span、i、em等等,权重值为1;
通配符(*)的权重值为0;
仅仅作为参考,不能用做实际的计算。
CSS入门介绍(一)的更多相关文章
- CSS入门介绍
一.背景 这里将陆续介绍前端CSS中相关知识,先介绍CSS2.1,后续会介绍CSS3的相关属性,通过该系列的文章,希望能给准备转战前端的人员一些帮助,同时也帮助自己梳理知识,文章中如有错误,欢迎指出. ...
- CSS入门介绍(二)CSS选择器
css选择器 什么是选择器? 选择器是你构造好网页的结构,需要给这些结构赋予样式,这时候就需要用到选择器,利用选择器将元素与样式一一对应:两者的对应关系可以是一对一,一对多,多对一. 选择器的分类: ...
- html与css入门经典视频教程 千锋说要这样学
PHP初学者看过来,老师带来的PHP入门经典视频教程,带你轻松入门,学习PHP就是这么简单. 很多人不理解为什么学习PHP要先学习HTML基础和CSS,其实PHP作为服务器的脚本语言,在开发过程中用于 ...
- [Python爬虫] 在Windows下安装PhantomJS和CasperJS及入门介绍(上)
最近在使用Python爬取网页内容时,总是遇到JS临时加载.动态获取网页信息的困难.例如爬取CSDN下载资源评论.搜狐图片中的“原图”等,此时尝试学习Phantomjs和CasperJS来解决这个问题 ...
- [Python爬虫] scrapy爬虫系列 <一>.安装及入门介绍
前面介绍了很多Selenium基于自动测试的Python爬虫程序,主要利用它的xpath语句,通过分析网页DOM树结构进行爬取内容,同时可以结合Phantomjs模拟浏览器进行鼠标或键盘操作.但是,更 ...
- CSS入门教程——定位(positon)
CSS入门教程——定位(positon) CSS定位在网页布局中是起着决定性作用. 定位 CSS的定位功能是很强大的,利用它你可以做出各种各样的网页布局.本节就介绍一些CSS常用的定位语句. 1. ...
- React入门介绍(1)-ReactDOM.render()等基础
React入门介绍-ReactDOM.render()等基础 首先,React是一个用于构建用户界面的Javascript库,但Peact并不是一套完整的MVC或MVVM的框架,它仅涵盖V-view视 ...
- 第五篇 CSS入门 明白 三种嵌套形式,三种常用控制器
CSS入门 css是 层叠式样式表 css的作用是什么呢?举个抽象的例子啊,HTML是人,CSS则是衣服... css给html穿上衣服,有三种形式: 内嵌.内联.外联. 这三种形式,优先级为 ...
- CSS入门指南-4:页面布局
这是<CSS设计指南>的读书笔记,用于加深学习效果. display 属性 display是 CSS 中最重要的用于控制布局的属性.每个元素都有一个默认的 display 值.对于大多数元 ...
随机推荐
- linux usb总线驱动(一)
目录 linux usb总线驱动框架 USB 介绍 传输类型 控制器接口 2440接口 基本流程 alloc_dev choose_address hub_port_init usb_get_devi ...
- 统计iis日志第一例的次数
统计iis日志第一例(日期)出现的次数 IIS日志文件格式: #Software: Microsoft Internet Information Services 7.5 #Version: 1.0 ...
- windows linux 文件编码转换
查看文件编码在Linux中查看文件编码可以通过以下几种方式:1.在Vim中可以直接查看文件编码:set fileencoding即可显示文件编码格式.如果你只是想查看其它编码格式的文件或者想解决用Vi ...
- CMDB服务器管理系统【s5day92】:服务器管理回顾
一.服务器管理回顾 1.requests 发送: requests.post(url='',data=,json=) requests.get() Django接受: request.POST, co ...
- LFYZ-OJ ID: 1017 士兵站队问题
分析 该题和"输油管道问题"类似,只不过由一维问题编程了二维问题.可以将总步数分解为移动到水平线y位置的总步数ysteps和移动到序列x, x+1, x+2, ... , x+n- ...
- [再寄小读者之数学篇](2014-06-22 求极限 [中国科学技术大学2011年高等数学B考研试题])
设数列 $\sed{x_n}$ 满足 $0<x_1<\pi$, $x_{n+1}=\sin x_n\ (n=1,2,\cdots)$. (1) 证明 $\dps{\vlm{n}x_n}$ ...
- APPLE-SA-2019-3-25-5 iTunes 12.9.4 for Windows
APPLE-SA-2019-3-25-5 iTunes 12.9.4 for Windows iTunes 12.9.4 for Windows is now available and addres ...
- keepalived健康检查方式【转】
keepalived具有很强大.灵活的后端检测方式,其具有HTTP_GET|SSL_GET|TCP_CHECK|SMTP_CHECK|MISC_CHECK 几种健康检测方式 ,在分别介绍各种检测方式之 ...
- Python-HTTP 概况
前端知识 网页最主要由3部分组成: 结构.表现和行为.网页现在新的标准是W3C,目前模式是HTML.CSS和JavaScript. (1)HTML HTML,全称“Hyper Text Markup ...
- Python- redis缓存 可达到瞬间并发量10W+
redis是什么? mysql是一个软件,帮助开发者对一台机器的硬盘进行操作. redis是一个软件,帮助开发者对一台机器的内存进行操作. redis缓存 可达到瞬间并发量10W+ 高并发架构系列:R ...