1.补充

margin的margin:0 auto;会解决元素的居中,前提是给这个元素设置width

2.css的层叠问题

css有两个性质

  1.继承性

  2.层叠性  选择器的一种选择能力,谁的权重大就选谁

    A,选不中,走继承性,(font color text)继承性的权重是0

      a)有多个父级都设置了就这样 走就近原则

    B,选中了

      a)权重的问题,权重大,就选谁的样式

      b)权重相同,谁在后选择谁

      c)纯标签和类没有可比性,纯类和id也没有可比性。

3,标准文档流

  浏览器的排版是根据元素的特征(快和行级),从上往下,从左往右排版。这就是标准文档流。

  浮动 folat:left/right;

  效果:元素都加浮动,后面的元素会紧跟这前面的元素并排列。

A,只要加了float,这个元素就会脱离标准文档流。

第一个加了float,离了标准文档流,对于浏览器来说,第二个元素就变成了标准文档流中的第一个,于是就把他排在第一位。而第一个仍然存在,所以就会叠加。

行级加float

行级元素加了float,脱离标准流,块不像块,行不像行,能设置宽高,能并排排列。

Display就没有任何意思了。

B,浮动的元素会紧紧贴靠在一起

C,浮动的元素会文字环绕

拓展 使元素脱离标准流的方法

  1. 浮动float

  2. 绝对定位position:absolute;

  3.  固定定位positions:fixed;    fixed固定的

浮动带来的坏处

  1,给元素加了浮动,撑不起父级的高度了

清除浮动的方法

  1.给浮动的fu元素添加高度

  2.给父级添加overflow:hiden;

  3.给浮动元素的后面添加一个空的 div 添加样式为clear:both

  4.给浮动元素的父级添加一个叫clearfix

  这个类写的样式属性有

伪类选择器

  只要选择器后面带;都可以说他是伪类选择器

  a:link{}      a:hover{}  a:visited{}         a:active{}  a:after{}  abefore{}

a的四种状态的顺序不能变

伪元素 和伪类选择器的区别

伪元素有两个冒号   如p::after{}    伪类选择器有一个冒号p:hover{}

css的小知识3的更多相关文章

  1. HTML+css零碎小知识

    1.设置了float浮动的元素和绝对定位position:absolute的元素会脱离正常的文档流.但是设置absolute的元素不会占据空间,相当于隐形了.   2.相对定位position:rel ...

  2. css + html 小知识总结

    Html+CSS基础之Html 注:本文摘自慕课网http://www.imooc.com   HTML+CSS基础课程: 1. HTML是网页内容的载体.内容就是网页制作者放在页面上想要让用户浏览的 ...

  3. css的小知识4

    ---恢复内容开始--- 一.单位 1.px就是一个基本单位     像素 2.em也是一个单位      用父级元素的字体大小乘以em前面的数字.如果父级没有就继承上一个父级直到body,如果bod ...

  4. css的小知识

    ---恢复内容开始--- 1.当你发现在制作页面时出现滚动条就需要一个去除滚动条的属性 overflow:hidden:           overflow-x:hidden:水平超出隐藏 2.  ...

  5. 2018.3.15 css课外小知识

    1, 如果手动写动画, 最小的时间间隔是多久 为什么 多数显示器默认频率是60Hz  1s刷新60次  所以理论最小是1/60*1000ms=16.7ms 2. display:inline-bloc ...

  6. HTML+CSS中的一些小知识

    今天分享一些HTML.CSS的小知识,希望能够对大家有所帮助! 1.解决网页乱码的问题:最重要的是要保证各个环节的字符编码一致! (1)编辑器的编辑环境的字符集(默认字符集):Crtl+U 常见的编码 ...

  7. 12个你未必知道的CSS小知识

    虽然CSS并不是一种很复杂的技术,但就算你是一个使用CSS多年的高手,仍然会有很多CSS用法/属性/属性值你从来没使用过,甚至从来没听说过. 1.CSS的color属性并非只能用于文本显示 对于CSS ...

  8. 谈谈CSS中一些比较"偏门"的小知识

    前面我写了:谈谈html中一些比较"偏门"的知识,现在这篇(主要)想谈谈个人所见的CSS一些小知识点,加深印象:同时也希望有需要的人能有收获! 1.常见的浏览器内核: 以IE为代表 ...

  9. 【前端词典】几个有益的 CSS 小知识

    今天偷个懒,不长篇大论,分享几个你可能不知道的 CSS 小知识. 样式的顺序 CSS 代码:   HTML 代码:   记得之前这是一道比较火的 CSS 考题,当时好像是有不少的人答错(30% 以上) ...

随机推荐

  1. 利用StringEscapeUtils来转义和反转义html/xml/javascript中的特殊字符

    我们经常遇到html或者xml在Java程序中被某些库转义成了特殊字符. 例如: 各种逻辑运算符: > >= < <= == 被转义成了 &#x3D;&#x3D ...

  2. PHP 实现自动加载

    自动载入主要是省去了一个个类去 include 的繁琐,在 new 时动态的去检查并 include 相应的 class 文件. 先上代码: //index.php <?php class Cl ...

  3. 使用日志服务进行Kubernetes日志采集

    阿里云容器服务Kubernetes集群集成了日志服务(SLS),您可在创建集群时启用日志服务,快速采集Kubernetes 集群的容器日志,包括容器的标准输出以及容器内的文本文件. 新建 Kubern ...

  4. Install Redis 3.2 on Ubuntu

    Install Redis 3.2 on Ubuntu It’s very easy to install Redis 3 on Ubuntu 16, just need to add PPA rep ...

  5. Swift Struct 结构体

    前言 Swift 语言有两种基本的数据类型,即类(class)和结构体(struct),class 这样的概念大家不会陌生,而 struct 也并不是什么新的概念,在 Objective-C 和 C ...

  6. MySQL优化器 --- index_merge

    [背景] 对于关系数据库中的一张表,通常来说数据页面的总大小要比较某一个索引占用的页面要大的多(上面说的索引是不包涵主键索引的); 更进一步我们可以推导出,如果我们通过读索引就能解决问题,那么它相比读 ...

  7. Paxos 实现日志复制同步(Basic Paxos)

    Paxos 实现日志复制同步 本篇文章以 John Ousterhout(斯坦福大学教授) 和 Diego Ongaro(斯坦福大学获得博士学位,Raft算法发明人) 在 Youtube 上的讲解视频 ...

  8. Linux常用的基础组件

    Linux服务器(新机器) yum install gcc gcc-c++ glibc-devel make ncurses-devel openssl-devel autoconf git yum  ...

  9. C#WebService服务在Windows7的部署

    (一)C#WebService服务在Windows7的部署  一.在控制面板,程序与卸载中安装IIS组件. 二.IIS无法显示WebService的.asmx文件.解决办法:注:(这里可以不用考虑,直 ...

  10. 深入理解Java类加载器(ClassLoader)

    深入理解Java类加载器(ClassLoader) Java学习记录--委派模型与类加载器 关于Java类加载双亲委派机制的思考(附一道面试题) 真正理解线程上下文类加载器(多案例分析) [jvm解析 ...