CSS篇章
页面的组成:页面=数据(后台技术jsp|asp|.net|php|python)+Html(显示)+CSS(样式)+js(动效)
CSS:层叠样式表
特点:①CSS和HTML分离
②可很好的控制页面的布局(DIV+CSS)
③提高网页加载速度
④降低服务器的成本
⑤呈现一致的效果
CSS引入的 3 种方式:
①外部引入
<link rel="stylesheet" href="main.css">
特点:一个CSS文件可控制多个页面
易改版、便于维护
减少代码量、代码简洁规范易于分工协作
有效利用缓存机制
相对于单页有垃圾代码
外部引入中的href属性会给服务器造成请求的压力
常用于全站
②head引入
<style>
#main{
background: red;
}
</style>
特点:速度快,没有服务器请求压力
相对于外部引入单页代码量少
不易于改版与维护
代码较乱不易前后台沟通
常用于大型互联网首页 如:网易、新浪等
③标签内引入
<div style="background:red;">AAA</div>
特点:优先级最高
冗余代码量多,代码量大
不易于维护
个别特殊效果的使用
CSS常用选择器分类
①ID选择器
特点:不能重复;一般只作用于一个节点上;定位某一个节点时最好用ID选择器
②类选择器
特点:作用于多个节点上;当很多节点需要相同的样式时使用
③标签名选择器
特点:作用于多个节点上,比类选择器精简
④群组选择器
特点:多种选择器用逗号隔开,体现一种继承和覆盖的思想;优化代码
⑤后代选择器
以上5种选择器都属于CSS1.0,兼容性最好
兄弟|子选择器.. ->CSS2.0 ->存在一部分问题,以IE为主
结构性伪类|动画|过渡 ->CSS3.0 -> 多用于移动端
Css样式选择器分为4个等级;标签内样式>ID选择器总数> class选择器总数>类型选择器总数
ID选择器权重值 100
类选择器权重值 10
标签选择器权重值 1
如果权重相同,离标签近的有效
CSS篇章的更多相关文章
- Matplotlib数据可视化(3):文本与轴
在一幅图表中,文本.坐标轴和图像的是信息传递的核心,对着三者的设置是作图这最为关心的内容,在上一篇博客中虽然列举了一些设置方法,但没有进行深入介绍,本文以围绕如何对文本和坐标轴进行设置展开(对图像 ...
- 学点css之经验总结篇章
学css说起来应该有三天左右的时间的,加上之前了解的基础,对css有一点的感性认识了,相应代码有有比较好的把握,现在就通过分享几张照片的形式分享一下我的收获 备注:在Border的外边的部门被称作:o ...
- 篇章三:[AngularJS] 使用AngularCSS動態載入CSS
前言 使用AngularAMD動態載入Controller 使用AngularAMD動態載入Service 上列兩篇文章裡,介紹了如何如何使用AngularAMD來動態載入Controller與Ser ...
- [转]CSS 模块
CSS 模块 如果你想知道 CSS 最近发展的转折点,你应该选择去观看 Christopher Chedeau 在2014年11月的 NationJS 大会上做的名称为 CSS in JS 的分享.不 ...
- 软件工程驻足篇章:第十七周和BugPhobia团队漫长的道别
0x01 :序言 I am a slow walker, but I never walk backwards. 成长于被爱,学着爱人 成长的故事 也是年少的星期六结束的故事 就仿佛我和BugPhob ...
- BugPhobia回顾篇章:团队Beta 阶段工作分析
0x00:序言 1 universe, 9 planets, 204 countries,809 islands, 7 seas, and i had the privilege to meet yo ...
- BugPhobia终章篇章:学霸在线系统Beta阶段展示
0x00 :序言 1 universe, 9 planets, 204 countries,809 islands, 7 seas, and i had the privilege to meet y ...
- BugPhobia准备篇章:团队Beta阶段准备工作分析
0x00:序言 To the searching tags, you may well fall in love withhttp://xueba.nlsde.buaa.edu.cn/ 再见,无忧时光 ...
- BugPhobia回顾篇章:团队Alpha阶段工作分析
0x00:序言 1 universe, 9 planets, 204 countries,809 islands, 7 seas, and i had the privilege to meet yo ...
随机推荐
- 用NULL布局为什么不能显示
import javax.swing.JComboBox;import javax.swing.JFrame;import javax.swing.JLabel;import javax.swing. ...
- noi 9271 奶牛散步
题目链接:http://noi.openjudge.cn/ch0206/9271/ 同noi 踩方格,但是题目有问题,%12345,我也是看了discuss才知道的. #include <bit ...
- 2016年江西理工大学C语言程序设计竞赛(初级组)
问题 A: 木棒根数 解法:把所有的情况保存下来,加一下就好 #include<bits/stdc++.h> using namespace std; map<char,int> ...
- Android开发之MediaRecorder类详解
MediaRecorder类介绍: MediaRecorder类是Android sdk提供的一个专门用于音视频录制,一般利用手机麦克风采集音频,摄像头采集图片信息. MediaRecorder主要函 ...
- R----dplyr包介绍学习
dplyr包:plyr包的替代者,专门面对数据框,将ddplyr转变为更易用的接口 %>%来自dplyr包的管道函数,其作用是将前一步的结果直接传参给下一步的函数,从而省略了中间的赋值步骤,可以 ...
- jquery.validate使用 - 自定义验证方法
自定义jquery-validate的验证行为 1: 自定义表单提交 设置submitHandler来自定义表单提交动作 $(".selector").validate({ ...
- WPF+WEB+WinForm->>表现层共用类
首先在解决方案里新建一个类库,然后在解决方案里新建三个项目,WPF,WEB,WinForm,但是这三个项目都需要一个计算类进行计算,那么就在新建的类库Calculator里面放一个Calculat.c ...
- SQL Server 查询表的记录数(3种方法,推荐第一种)
http://blog.csdn.net/smahorse/article/details/8156483 --SQL Server 查询表的记录数 --one: 使用系统表. SELECT obje ...
- 《第一本docker书》第4章 使用docker镜像和仓库 读书笔记
docker最底端是一个引导文件系统,即bootfs. 第二层是root文件系统rootfs,位于引导文件系统之上. 在传统的Linux引导过程中,root文件系统会最先以只读的方式加载,当引导结束并 ...
- Windows下面安装easy_install报UnicodeDecodeError: 'ascii' codec can't decode byte解决方法
在运行python ez_setup.py install后, 发现是在下载并解压setuptools-2.1,并运行setup.py时出现如下错误: 提示D:\Python27\lib\mimety ...