9.14

❤知识补充

margin的问题:margin:0 auto;可以解决元素在网页的居中问题(记得设置宽度)

1、css层叠样式表的问题

CSS的两个性质

(1)继承性

(2)层叠性

        a:选不中,走继承性(font系列 color text)继承性的权重为0

       ❤如果这个元素有多个父级元素设置了这样的属性,走就近原则

        b:选中了

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

  ❤权重相同,谁在后选谁,因为覆盖了

  ❤纯标签和类没有可比性,纯类和ID也没有可比性

2、标准文档流

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

❤浮动 float:left/right;

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

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

   行级元素加了float,脱离了标准文档流,块不像块,行不像行,能设置宽高,能并排排列,则也不用再给行级标签加display了,没有意义了

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

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

❤拓展知识点 使元素脱离标准流的方法

1、浮动 float

2、绝对定位 position=absolute;

3、固定定位 position=fixed;(fixed:固定的)

❤浮动带来的坏处:撑不起父级元素的高度

❤清除浮动(的坏处):

(1)给浮动的父级元素添加高度

(2)给父级元素添加overflow:hidden;

(3)给浮动元素的后面添加一个空的div标签 添加样式为 clear:both;

(4)给浮动元素的父级添加一个类,叫做“clearfix”

    这个类写的样式属性有

    .clear:after{

       content:"";

       display:block;

       clear:both;

          height:0;

       visibility:hidden;

      }

❤伪类选择器:只要后面带冒号:都可以说是伪类选择器

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

伪元素有两个冒号,如p::after{}

伪类选择器有一个冒号,如p:hover{}

❤超链接a的伪类选择器

a:link    正常的颜色

a:visited      访问过后的颜色

a:hover      鼠标悬浮

a:active    激活 鼠标点击的那一刻

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

9.14 h5日记的更多相关文章

  1. 9.29 h5日记

    1.CSS中哪些属性可以继承? font系列 text系列 color line-height 2.border-radius的值 值的顺序是左上 右上 右下 左下 则 border-radius:5 ...

  2. 9.28 h5日记

    9.28 1.transparent 透明的 颜色 2.placeholder 提示语 在input中使用 跟velue不同 3.写页面需要注意的 (1)页面一定要有层次,分清层次 (2)保证元素模块 ...

  3. 9.27 h5日记

    9.27 1.怎样给title前加小图标? <link rel="short icon"  href="favicon.ico"/> ❤link有哪 ...

  4. 9.26 H5日记

    9.26 1.新的背景属性,background-position background-position有两个值,水平和垂直,单位px ❤在html和CSS当中,有三个属性可以向服务器发送请求,分别 ...

  5. 9.4-9.19 h5日记总结

    总结: 1.标签 (1)单.双标签 (2)块级.行级标签 (3)标签的属性 2.CSS (1)选择器 *.id.class.标签.后代.子代.并集.交集.伪类.结构 (2)层叠性,即选择器权重的计算 ...

  6. 9.13 h5日记

    9.13 面试题 为什么两个P出此案的效果不同,原因是 浏览器在解析第二个P的时候,因为字母没有空格,浏览器会认为这个单词没有打完,所以不会换行. 列表 ul ol dl li 1.无序列表 ul ( ...

  7. 9.12 h5日记

    9.12 知识点补充: 属性继承例子,color.font(font-size/style/family/weight) 1.浏览器的默认字体大小是16px,谷歌浏览器的最小字体是10px,其他浏览器 ...

  8. 9.11 h5日记

      9.11   超链接标签<a></a>十分特殊改a标签内容的字体颜色,必须是直接给a 设置,给它的父级标签设置是不可行的.   PS:什么是属性继承,即父级标签设置的样式后 ...

  9. 9.10 h5日记

    9.10 1.什么是属性 属性是表示某些事物的一些特征 2.属性分为标签属性和样式属性,二者的区别在于哪里 标签属性:<img src="01.jpg" width=&quo ...

随机推荐

  1. Idea使用Maven异常 --- Maven网络代理设置

    在conf/setting.xml和m2/repository/setting.xml中加入: <proxies> <!-- proxy | Specification for on ...

  2. asp.net中的reportview报错跟预编有关系

    当报表控件出现: 报表定义无效.详细信息:根级别上的数据无效.行1,位置1. 先检查一下,你的aspx文件是不是变成了这样一句话 这是预编译工具生成的标记文件,不应被删除! 如果这样的话,报表控件是不 ...

  3. C# windows服务:C#windows服务中的Timer控件的使用

    C# windows服务程序中的Timer控件的使用问题是如何解决的呢? 今天和同事一起研究了下C# windows服务程序中的Timer控件的使用的写法. 我们在建立一个C# windows服务程序 ...

  4. Hadoop分布式HA的安装部署

    Hadoop分布式HA的安装部署 前言 单机版的Hadoop环境只有一个namenode,一般namenode出现问题,整个系统也就无法使用,所以高可用主要指的是namenode的高可用,即存在两个n ...

  5. 编程四剑客awk

    awk  'pattern +{action}' file (1)AWK基本语法参数详解 a:单引号 ''是为了和shell命令区分开: b:大括号{}表示一个命令分组: c:pattern 是一个过 ...

  6. unity3d API知识点随记

    1.transform.translate是增加transform面板相应的数值x,y,z是以本地坐标系为方向:transform.transformdirection是以世界坐标系为方向,可以去测试 ...

  7. centos7 防火墙 开启端口 并测试

    1.防火墙 CentOS升级到7之后,发现无法使用iptables控制Linuxs的端口,google之后发现Centos 7使用firewalld代替了原来的iptables.下面记录如何使用fir ...

  8. redis分布式锁Redisson扩展

    如果大家项目中Redis是多机部署的可以来好好看看这篇实现,讲的非常好. 使用Redisson实现分布式锁,Spring AOP简化之   源码 Redisson概述 Redisson是一个在Redi ...

  9. rect用法

    //如果创建一个Rect对象rect(100, 50, 50, 100),那么rect会有以下几个功能: rect.area(); //返回rect的面积 5000 rect.size(); //返回 ...

  10. hive 踩坑

    1. create tabl metastore.MetaStoreDirectSql: Self-test query [select "DB_ID" from "DB ...