9.14 h5日记
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日记的更多相关文章
- 9.29 h5日记
1.CSS中哪些属性可以继承? font系列 text系列 color line-height 2.border-radius的值 值的顺序是左上 右上 右下 左下 则 border-radius:5 ...
- 9.28 h5日记
9.28 1.transparent 透明的 颜色 2.placeholder 提示语 在input中使用 跟velue不同 3.写页面需要注意的 (1)页面一定要有层次,分清层次 (2)保证元素模块 ...
- 9.27 h5日记
9.27 1.怎样给title前加小图标? <link rel="short icon" href="favicon.ico"/> ❤link有哪 ...
- 9.26 H5日记
9.26 1.新的背景属性,background-position background-position有两个值,水平和垂直,单位px ❤在html和CSS当中,有三个属性可以向服务器发送请求,分别 ...
- 9.4-9.19 h5日记总结
总结: 1.标签 (1)单.双标签 (2)块级.行级标签 (3)标签的属性 2.CSS (1)选择器 *.id.class.标签.后代.子代.并集.交集.伪类.结构 (2)层叠性,即选择器权重的计算 ...
- 9.13 h5日记
9.13 面试题 为什么两个P出此案的效果不同,原因是 浏览器在解析第二个P的时候,因为字母没有空格,浏览器会认为这个单词没有打完,所以不会换行. 列表 ul ol dl li 1.无序列表 ul ( ...
- 9.12 h5日记
9.12 知识点补充: 属性继承例子,color.font(font-size/style/family/weight) 1.浏览器的默认字体大小是16px,谷歌浏览器的最小字体是10px,其他浏览器 ...
- 9.11 h5日记
9.11 超链接标签<a></a>十分特殊改a标签内容的字体颜色,必须是直接给a 设置,给它的父级标签设置是不可行的. PS:什么是属性继承,即父级标签设置的样式后 ...
- 9.10 h5日记
9.10 1.什么是属性 属性是表示某些事物的一些特征 2.属性分为标签属性和样式属性,二者的区别在于哪里 标签属性:<img src="01.jpg" width=&quo ...
随机推荐
- python小实例一:简单爬虫
本文所谓的爬虫就是通过本地远程访问url,然后将url的读成源代码形式,然后对源代码进行解析,获取自己需要的数据,相当于简单数据挖掘.本文实现的是将一个网页的图片爬出保存到本地的过程,例子很简单,用的 ...
- [jPlayer]一分钟部署jPlayer
---------------------------------------------------------------------------------------------------- ...
- ios嵌套H5页面,出现的小bug;
ios嵌套H5页面,点击数字时就会弹出打电话的功能:解决方法: 在head标签中添加: <meta name="format-detection" content=" ...
- Delphi动态配置ODBC数据源--SQL Server版本
(摘自)http://jxlearnew.blog.163.com/blog/static/549786592007102451431413/ 这里介绍一种用Delphi来实现动态注册的方法,希望对各 ...
- python 装饰器、递归原理、模块导入方式
1.装饰器原理 def f1(arg): print '验证' arg() def func(): print ' #.将被调用函数封装到另外一个函数 func = f1(func) #.对原函数重新 ...
- Android计时器和倒计时
Android计时器和倒计时 计时器两个核心类 Timer 和 TimerTask 1) Timer核心方法 Java代码 //Schedules the specified task for ex ...
- poj1061-青蛙的约会-(贝祖定理+扩展欧几里得定理+同余定理)
青蛙的约会 Time Limit: 1000MS Memory Limit: 10000K Total Submissions:132162 Accepted: 29199 Descripti ...
- tomcat 修改jdk版本号
set JAVA_OPTS=-Djute.maxbuffer=2048000 set console_log=true set CATALINA_OPTS=-server -Xdebug -Xnoag ...
- css 响应式布局
移动端最让人闹心的就是在不同的手机要做错响应式布局适应各种手机,开始自己做这方面走了很多的弯路,响应式布局如果是部件,就按实际的大小单位px等设置,像宽可以按照百分比计算,长的可以百分比.auto 或 ...
- datetime空值设置
Cause: com.mysql.jdbc.MysqlDataTruncation: Data truncation: Incorrect datetime value: '' for column ...