css-css权威指南学习笔记6
第八章 padding/border/margin
1、对于只包含文本的行,能改变行间距里的属性只有line-height/font-size/vertical-align。
2、对行内非替换元素应用负外边距,左右两端可能与其他内容重叠。
3、边框绘制在元素的背景之上。(可修改)
4、要把单边属性放在简写属性之后,防止覆盖。
5、不论行内元素的边框指定怎样的宽度,元素的行高都不会改变,见1.
第九章 颜色和背景
1、边框颜色在未声明的情况下,会默认应用前景色或者继承来的颜色。
2、应用背景图像的情况下,最好同时声明背景色。
3、利用百分数值设定背景图的位置时,百分数的含义是将元素的百分数值的点与图像百分数值的点对齐。
4、背景图像开始于左上角的内边框处(同时也是内边距处)。
5、改变background-position可以改变平铺开始的位置。
第十章 浮动和定位
1、一个元素浮动时,其他内容会环绕该元素。常见的如浮动一个img,p的内容会围绕img分布。
2、浮动元素的margin不会合并。
3、浮动元素会延伸,从而包含其所有后代浮动元素,所以,将父元素设置为浮动元素,就可以把浮动元素全都包含在其父元素内。
4、行内框与一个浮动元素重叠时,其边框背景内容都在浮动元素之上显示;块框与一个浮动元素重叠时,其边框和背景在该浮动元素之下显示,但是内容在浮动元素之上显示。
5、clear应用于块级元素,表示left或right或both不允许存在浮动元素。
6、要使一个清除元素的顶端与一个浮动元素的底端之间有一定空间,可以为浮动元素设置一个margin-bottom,给清除元素设置margin-top并不方便(清除区域的原因)。
7、对于一个非根元素,如果position值是absolute,包含块是最近的position值不是static的祖先元素。
8、top/right/bottom/left应用于position值不是static的元素。元素的外边距边界相对包含块的内边距边界(边框)偏移。
9、position:absolute中top:auto;left:auto意味着元素位于未定位前的位置(原本该出现的位置)。
10、让绝对定位的图片居中显示的一种方法:
img{
position: absolute;
margin: auto auto;
left:;
right:;
top:;
bottom:;
}
11、相对定位如果过度受限,那么bottom等于-top,right=-left。
css-css权威指南学习笔记6的更多相关文章
- HTTP权威指南-学习笔记
目录 HTTP权威指南-学习笔记 HTTP: Web的基础 URL与资源 HTTP报文 连接管理 HTTP结构 Web服务器 代理 缓存 集成点: 网关,隧道及中继 Web机器人 识别,认证与安全 客 ...
- JavaScript 权威指南-学习笔记(一)
本文所有教程及源码.软件仅为技术研究.不涉及计算机信息系统功能的删除.修改.增加.干扰,更不会影响计算机信息系统的正常运行.不得将代码用于非法用途,如侵立删! ## JavaScript 权威指南-学 ...
- CSS权威指南学习笔记系列(1)CSS和文档
题外话:HTML是一种结构化语言,而CSS是它的补充:这是一种样式语言.CSS是前端三板斧之一,因此学习CSS很重要.而我还是菜鸟,所以需要加强学习CSS.这个是我学习CSS权威指南的笔记,如有不对, ...
- Hadoop权威指南学习笔记二
MapReduce简单介绍 声明:本文是本人基于Hadoop权威指南学习的一些个人理解和笔记,仅供学习參考,有什么不到之处还望指出,一起学习一起进步. 转载请注明:http://blog.csdn.n ...
- Hadoop权威指南学习笔记一
Hadoop简单介绍 声明:本文是本人基于Hadoop权威指南学习的一些个人理解和笔记,仅供学习參考,有什么不到之处还望指出.一起学习一起进步. 转载请注明:http://blog.csdn.net/ ...
- Hadoop权威指南学习笔记三
HDFS简单介绍 声明:本文是本人基于Hadoop权威指南学习的一些个人理解和笔记,仅供学习參考.有什么不到之处还望指出,一起学习一起进步. 转载请注明:http://blog.csdn.net/my ...
- css权威指南学习笔记 —— css选择器
1,选择器:选择器的一些基本常用规则基本都记得,w3c上都有,平时也常用,不常用的一些后代选择器经常就忘记了.一些归纳一下后代选择器,加深一下印象: a:子选择器: p>a a是直接是p的 ...
- IDA Pro权威指南学习笔记(一)
一直不懂逆向,最近刚好不忙,于是学习逆向,用来做笔记,顺便和大家分享交流. 参考书籍<IAD PRO权威指南> 工具: PETools: ETools 是另一款很好的PE文件编辑工具,以前 ...
- maven权威指南学习笔记(五)—— POM
1. 简介 Archetype插件通过 pom.xml 文件创建了一个项目.这就是项目对象模型 (POM),一个项目的声明性描述. 当Maven运行一个目标的时候,每个目标都会访问定 义在项目POM里 ...
- maven权威指南学习笔记(三)——一个简单的maven项目
目标: 对构建生命周期 (build lifecycle),Maven仓库 (repositories),依赖管理 (dependency management)和项目对象模型 (Project O ...
随机推荐
- 开源跨平台IOT通讯框架ServerSuperIO,集成到NuGet程序包管理器,以及Demo使用说明
物联网涉及到各种设备.各种传感器.各种数据源.各种协议,并且很难统一,那么就要有一个结构性的框架解决这些问题.SSIO就是根据时代发展的阶段和现实实际情况的结合产物. 各种数据信息,如下图 ...
- GJM: 设计模式 - 观察者模式
GJM : 观察者模式 视频地址: http://www.imooc.com/learn/415 本课程通过一个天气预报的发布和订阅案例,来讲解观察者模式在Java项目中的应用.主要包括观察者模式的结 ...
- 性能卓越的js模板引擎--artTemplate
artTemplate能够将数据与View视图的分离,充分利用 javascript 引擎特性,使得其性能无论在前端还是后端都有极其出色的表现. 在 chrome 下渲染效率测试中分别是知名引擎 Mu ...
- IE7 浏览器下面设置text-indent属性变成margin属性BUG
问题来源 今天做项目的时候发现了一个问题,在使用text-indent属性对元素进行缩进是发现在360浏览器下发生了元素偏移,跟margin-left的效果一样,打开f12发现3607.1浏览采用的i ...
- JS函数声明的问题
三个例子 var a = 10; 2 function test(){ 3 a = 100; 4 console.log(a); 5 console.log(this.a); 6 var a; 7 c ...
- Google C++单元测试框架GoogleTest---GMock的CheatSheet文档
CheatSheet文档中包含了GMock所有常用的东西,看了这个基本上就可以用它了,本文接上篇博文:Google C++单元测试框架GoogleTest---Google Mock简介--概念及基础 ...
- MySQL 一致性读 深入研究
一致性读,又称为快照读.使用的是MVCC机制读取undo中的已经提交的数据.所以它的读取是非阻塞的. 相关文档:http://dev.mysql.com/doc/refman/5.6/en/innod ...
- 使用Java实现单线程模式
我们都知道单例模式,有很多种实现方法.今天我们实现一个单线程实例模式,也就是说只能实例化该类的一个线程来运行,不允许有该类的多个线程实例存在.直接上代码: public class Singleton ...
- 创建agsXMPP 自定义packet types
在网上看了好多文章基本都是转载 没有能成功运行的,又没有别的资料,很是费解,无奈之下只好潜心研究,最终总结了几个要点给大家分享下,以免再次多浪费时间 agsXMPP是什么就不多描述了,重点说下我在创建 ...
- linux下解压.tar.gz .tar.bz2
从网络上下载到的源码包, 最常见的是 .tar.gz 包, 还有一部分是 .tar.bz2包要解压很简单 :.tar.gz 格式解压命令为 tar -zxvpf x ...