1.浏览器内核(主要指渲染引擎):

webkit 谷歌用的多

Safari 苹果

trident(IE内核)

Gecko 火狐用的最多,跨平台

Chromium/Blink  谷歌

移动端  iPhone 和 iPad 等苹果 iOS 平台主要是 WebKit,Android 4.4 之前的 Android 系统浏览器内核是 WebKit,Android4.4 系统浏览器切换到了Chromium,内核是 Webkit 的分支 Blink,Windows Phone 8 系统浏览器内核是 Trident。

2.css3新增选择器:

结构伪类选择器:例如:li:nth-child(n)  (even偶数 odd奇数)

属性选择器:例如:div[class]{}    ( ^=以开头 $=以结尾 *通配)

伪元素选择器:例如:p::first-letter{}

3.行内元素,行内块元素,块级元素的区别以及相互转换

行内元素(如span,b,img,a,u等):1)设置宽高无效 2)margin左右有效上下无效,padding都有效 3)不会自动换行 4)除a外,里面只能放行内元素

行内块元素:1)不自动换行 2)宽高有效

块级元素(如div,p,nav,aside,header等):1)宽高有效 2)margin,padding均有效 3)自动换行

4.CSS三大特性

1) 层叠

2) 继承(文本)

3) 优先(!important>行内样式>id>类>标签)

 5.盒子模型:

padding指内边距 写法:1)上、右、下、左

margin指外边距

border指边框

width、height在标准盒模型中指内容的宽高,IE盒模型指内容+border+padding的宽高

默认带有padding的标签:th,td

默认带有margin的标签:h1~h6,dl,dd,p

默认带有padding、margin的标签:ol,ul,textarea

6.外边距合并问题

1)互为兄弟关系的块级元素。解决方案:避免

2)互为父子关系的块级元素,父元素没有内边距和边框。解决方案:1)父元素加边框或内边距2)overflow:hidden

7.清楚浮动

Why:解决父级元素因为子级元素引起的内部高度为0的问题

When: 父元素没有确定高度值,子元素浮动,导致父元素没有高

How:  1)额外标签法:在浮动的盒子之下再放一个标签,在这个标签中使用clear:both,来清除浮动对页面的影响.

2)父元素添加overflow:hidden;

3)After伪元素清楚浮动

    .clearfix:after{

      content:"";//设置内容为空

      height:0;//高度为0

      line-height:0;//行高为0

      display:block;//将文本转为块级元素

      visibility:hidden;//将元素隐藏

      clear:both//清除浮动

     }

    .clearfix{

      zoom:1;为了兼容IE

    }

4)双伪元素

参考文档  https://www.jianshu.com/p/7e04ed3f4bea 了解BFC才能了解清楚浮动的原理

8.定位:

1)静态static:(默认)

2)相对relative:可通过边偏移改变位置,原来位置继续占有

3)绝对absolute:不占位置,父元素没定位,以屏幕,父亲有定位以最近父亲为基准(子绝父相)

4)固定fixed:变异的绝对,不占位置,完全脱标

9.模式转换:

浮动、绝对定位、固定定位会转换为行内块模式

10.display、visibility、overflow区别:

Display 隐藏后不保留位置,Visibility 保留 位置Overflow 溢出隐藏

转载于:https://www.cnblogs.com/front-end0829/p/10290033.html

HTML,CSS基础十大重点问题相关推荐

  1. 徐州初中计算机学校排名2015,徐州市十大重点初中排名

    徐州市十大重点初中排名 初中是中学阶段的初级阶段,初级中学一般是指九年义务教育的中学,是向高级中学过渡的.一个阶段,属于中等教育的范畴.下面是小编为大家整理徐州市十大重点初中排名的相关介绍,仅供参考, ...

  2. 荆门市掇刀石中学2021高考成绩查询,2021荆门十大重点高中排名 荆门中学排行榜...

    2021荆门十大重点高中排名 荆门中学排行榜2021-04-14 14:38:28文/樊越 选择一个好的高中对于考生和家长来说是最重要的事,大家都非常需要了解高中的信息.那么荆门有哪些高中比较好,排名 ...

  3. 2021赣一中高考成绩查询,2021江西省十大重点高中排名

    如今这个社会已经发展成为一个知识型社会,如果你没有学历就很难在这个社会立足,所以如今大多数家庭都十分重视子女的教育,从小学到大学各个阶段都会帮助自己的孩子审慎选择.今天培训排行榜小编就来跟大家聊聊20 ...

  4. 算法基础-十大排序算法及其优化(文末有抽奖福利哦)

    算法基础-十大排序算法及其优化 算法基础-十大排序算法及其优化 [外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-Kw1LA5Q4-1607527572080)(/uplo ...

  5. 2022佛山潭洲陶瓷展召开新闻发布会 推出展会十大重点

    2022年6月20日,佛山潭洲陶瓷展在新媒体产业园举行了新闻发布会,本次新闻发布会主要围绕"陶瓷人下半年怎么干?"主题展开,会上推出了本届展会的十大重点,将为2022年陶瓷行业带来 ...

  6. 滴滴开源在2019:十大重点项目盘点,DoKit客户端研发助手首破1万Star

    整理 | Jane 出品 | AI科技大本营(ID:rgznai100) 2018 年,科技企业纷纷布局开源战略后迎来的第一个"丰收年".但对滴滴来说,2019 年才迎来其第一波开 ...

  7. python十大重点_你见过的最全面的 Python 重点

    由于总结了太多的东西,所以篇幅有点长,这也是我'缝缝补补'总结了好久的东西. Py2 VS Py3print成为了函数,python2是关键字 不再有unicode对象,默认str就是unicode ...

  8. html+css 基础知识大总结

    1.Html文件的固定结构 <html> <head>...</head> <body>...</body> </html> 代 ...

  9. iPadOS是什么系统,和iOS13有什么区别(十大重点新功能介绍)

    从第一代iPad Pro发布开始,iPad的定位就从以前的娱乐平板电脑升级为生产力工具,而苹果也不止一次分享iPad充当生产力的例子.在随后的日子里,苹果在iOS11和iOS12系统中都为iPad进行 ...

  10. 男人买鞋有点难——中国十大皮鞋

    温州长城鞋业公司是中国皮革工业协会重点骨干企业,理事单位,温州市最大规模皮鞋生产企业,浙江省同行业最佳经济效益企业.主要生产康奈牌.鸿盛牌中.高档系列男女皮鞋. 公司坐落在温州高新技术产园,现有员工1 ...

最新文章

  1. 一个技术总监的忠告:精通那么多技术有毛用啊,你还不是不被重用?
  2. 【深入Java虚拟机JVM 06】垃圾收集概述
  3. Flask-Login用户登陆
  4. linux下mysql开启远程访问权限及防火墙开放3306端口(mysql开放host访问权限)
  5. uva 10140——Prime Distance
  6. python爬取网页表格数据匹配,python爬虫——数据爬取和具体解析
  7. 链表简介(二)——在单向链表中插入节点
  8. 查看手机已经记住的WIFI密码
  9. Excel自学详细视频教程百度网盘分享
  10. Python爬虫,4567电影网电影信息爬取,二级页面处理方案
  11. Frame Relay - 简单介绍及基本配置
  12. windows下视频捕捉VFW和DirectShow
  13. 人一生要看的60本书
  14. TPS,MIS,DSS,ESS,临时表
  15. Java 微服务实践
  16. python调用r语言加载包错误_Python调用R语言
  17. unity中Animator controller无法给动作添加motion的问题
  18. mock.js的使用
  19. 七段显示器 + 74HC595 显示 / 设定
  20. ROS2古月老师课程urdf运行报错问题

热门文章

  1. puppet进阶指南——cron资源详解
  2. ❀❀ 名词解释(PM、PD、UE、UI、RD....)
  3. mac 安装 cocoapods
  4. DBCC PAGE、DBCC LOG、DBCC EXTENTINFO、DBCC IND、DBCC SHOW_STATISTICS、DBCC SHOWCONTIG、DBCC SQLPERF...
  5. 网络布线指南:光纤基础知识大扫盲
  6. 如何通过网页方式将jar包上传到nexus?
  7. 突发,Spring框架发现重大漏洞!
  8. Linus 怒批 GitHub:制造了毫无用处的垃圾合并信息!
  9. 最强代码生成器平台,杀疯了~
  10. MySQL 亿级数据分页的优化