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. 12.常用类简单介绍.md

    目录 1.Scanner类 2.System类 4.Object类和工具类 5.StringBuffer类和StringBuilder类 6.Math类 7.Random类和ThreadLocalRa ...

  2. Structs复习 Path问题

    Path问题相对复杂 主要是路劲问题 但结论很简单 就是统一使用绝对路径 jar包 web.xml <?xml version="1.0" encoding="UT ...

  3. C++之 模板Template的使用

    转自https://www.cnblogs.com/cynchanpin/p/7127897.html 1.在c++Template中非常多地方都用到了typename与class这两个关键字,并且好 ...

  4. 利用python操作redis-cluster

    In [8]: def redis_cluster(): ...: redis_nodes = [{'host':'192.168.100.60','port':7000}, ...: {'host' ...

  5. openlayers/// Puppeteer.js

    1.定位;https://viglino.github.io/ol3-ext/examples/map.interaction.geolocationdraw.html 2 .添加Overlay  d ...

  6. sql数据库之多库查询

    连接到数据库服务器gwsps07上,打开查询分析器,如何获取gwrenshi数据库中的数据? 查询语句如下: select * from GWRENSHI.CGC.dbo.PERempms(serve ...

  7. The number of method references in a .dex file cannot exceed 64K.(转)

    前言 我一直都知道app里面的方法数是有限制的差不多64000,具体的就未曾考证了在遇到这个问题之前,一直以为这个一个多么遥远的距离其实并不是的,稍有不慎这个异常出来了当前并不是你真的有编写了64k的 ...

  8. MyLineNumberReader

    package com.itheima; import java.io.FileReader; import java.io.IOException; import java.io.Reader; p ...

  9. vue生命周期简介

    vue生命周期简介 生命周期的钩子 LifeCycle hooks 上面已经能够清晰的看到vue2.0都包含了哪些生命周期的钩子函数~~ 那么 执行顺序以及什么时候执行,我们上代码来看~~~ 生命周期 ...

  10. 基本数据类型(list,tuple)

    基本数据类型(list,tuple)内容: 1. 列表2. 列表的增删改查3. 列表的嵌套4. 元组和元组嵌套5. range⼀. 列表1.1 列表的介绍列表是python的基础数据类型之⼀,其他编程 ...