系列文章目录
1.HTML 常问的面试题
2.CSS 常问的面试题
一 1.HTML 4 HTML5 XML 的区别
1.HTML 4 是超文本标记语言 主要用于作页面呈现。html 是现有实现 后面才慢慢制定标准,才导致
HTML 非常混乱,语法不严谨。
2.是可扩展标记语言 主要用于存储数据和结构。语法严谨,扩展强,但由于JSON也有类似的作用易用,所以XML市场越来越小了。
3. HTML5 在HTML4 基础进行扩展,用于标准页面,使得语法严谨更加语义化。
二、HTML5 新增标签
1.HTML5 的语义理解:主要利于SEO,可读性更好
2.新的特殊内容元素:比如article
,footer
,header
,nav
,section
3.新的表单控件:比如calendar
、date
、time
、email
、url
、search
<!-- 新增了input 表单 type属性值:data(日历),email(自带表单验证) ,url (自带表单网站) -->
<form action="">
邮箱:<input type="email">
地址:<input type="url">
<input type="submit">
</form>
二 前端存储有几种:
.Cookies
1.会为每个请求自动携带所有的Cookies数据,比较方便,但是也是缺点,浪费流量;<br
HTML5 前加入了,容量只有4K-DF
2.每个domain(站点)限制存储20个cookie;sbr/s
3.浏览器API比较原始,需要自行封装操作。 (is-cookie)
localStorage HTML5 加入
1.兼容1E8+,操作方便
2永久存储,除非手动刪除
3.容量为5M
sessionStorage HTML5 10 X
1.功能基本与 localStorage 相似,但当前页面关闭后即被自动清理
2.5Cookies. localStorage 不同点是不能在所有同源窗口间共享,属于会话级别的存储
Web SQL
非标准功能
1.2010年已被废奔,但一达主流浏览器中都有相关的史现
2.类似于 sQLite 数据库,是一种真正意义上的关系型数据库,用SQL进行操作
IndexedDB
1.是一种 NoSQL 数据库,用键值对进行储存,可进行快速读取操作;cbr)
HTML5 加入 2.适合复杂 Web存储场景,用JS操作方便(前端大量存数据的场景较少,如果有,可以用
3.存储空间容量,大于等于250MB,甚至没有上限
三、CSS 有哪些隐藏元素
opacity:0 通过将元素的透明度设置为0,实现看起来隐藏的效果,但依然会占用空间并可以进行交互visibility:hidden 与透明为0的方案非常类似,但依然会占用空间,不可以进行交互
overflow:hidden 只会隐藏溢出部分,用空间,不可进行交互
display:none 可以彻底隐藏元素并从文档中消失,不占用空间,也不能进行交互,不影响布局
z-index:-9999 通过将元素的层级置于最底层,让其他元素复盖住它。
left:-9999px 通过将元素定位到屏幕外面,达到看起来看不到的效果
四、px ,em ,rem 之间的区别
px 绝对单位 。页面会按照给出的精准像素进行展式
em 相对单位。默认的基准点为父元素的字体大小,而如果自身定义字体大小按顺序自身来算。所以即使在同一个页面内lem 可以能一个固定值。
rem 相对单位 。 根据html跟标签 来制定大小,一般使用于移动适配。
五、如何理解BFC
BFC:块级格式化上下文,是一块独立的渲染区域(触发了BFC,这块区域就是一块独立的泣染区域)
会将处于BFC的内容 和 处于BFC外的内容 隔离
触发BFC的方式:
1position:absolute/fixed 2,float:left/righhht 浮动的元素多个放在一起,会相互隔开
4.display:inline-block
BFC作用
1,处理块元素,上下margin 合并的问题
2,处理margin 塌陷
3,清除浮动
4,实现自适应,左边固定 右边自适应