zoukankan      html  css  js  c++  java
  • WEB前端基础知识点

    因为要告知浏览器的解析器用什么文档标准解析这个文档,所以在文档的开头要写上文档类型声明,H5的文档类型声明要比H4文档类型声明简洁的多。因为H5不基于SGML(标准通用标记语言),所以不需要对DTD文档类型定义)进行引用,但是H4是基于SGML,必须对DTD进行引用。H4的三种文档类型声明是:过渡模式,严格模式,

    框架模式。

    HTML是HyperText Markup Language(超文本文本标记标签语言),通过HTML,浏览器才能解析文档,在页面上显现文档的内容和结构。同时HTML

    也是网络三大基石之一:URL(统一资源定位符),HTTP(超文本传输协议)。超文本就是视频,音频和图片。

    HTML的行内标签,块级标签,空标签有哪些?

    行内标签:a b span img input select strong

    块级标签:div ul ol li dl dt dd h1-h6 p

    空/单标签:br hr img link meta base source

    页面导入外部样式文件时,使用link和@import有什么区别?

    (1)link属于XHTML标签,除了加载CSS外,还可以定义RSS,定义rel连接属性等作用;而@import是CSS提供的,只用用于加载CSS。

    (2)页面被加载时,link会同时被加载,而@import引用的CSS只能等页面加载完才能加载。

    (3)link无兼容性问题,而@import只能在IE5+上才被识别。

    HTML和XHTML的区别?

    (1)XHTML标签必须拥有根元素HTML

    (2)标签必须被正确地嵌套

    (3)标签必须正确关闭

    (4)标签必须用小写字母

    (5)空标签页必须关闭

    (6)XHTML兼容性比较好

    (7)XHTML不允许使用target="_blank"

    (8)XHTML标签属性值必须用引号

    w3c的标准与标签语义化?

    W3C标准:

    (1)所有的标签都使用小写字母

    (2)所有的属性值都放在引号里

    (3)标签正确嵌套/关闭

    (4)符合HTML,CSS,JS的规则

    (5)结构层+表示层+行为层

    遵循W3C标准和标签语义化有利于:

    让页面更友好,支持更多的终端,让更多的人可以使用互联网获得自己想要的信息。

    (1)搜索引擎的搜索,有利于爬虫抓取内容

    (2)支持多终端

    (3)支持样式布局让站点支持个性化

    (4)有利于开发和维护

    (5)有利于降低成本

    (6)提高用户体验

    (7)页面能更好的呈现内容结构

    浏览器内核的理解?

    浏览器的内核分为两部分:渲染引擎和JS引擎,但是由于JS引擎越来越独立了,所以内核也就是倾向渲染引擎。但是因为各个浏览器的内核不一样,所以它们的渲染

    引擎就不一样,所以渲染出来的页面也就不一样,这就是为什么浏览器有差异性,为什么我们要去适配浏览器的兼容性。

    浏览器的内核有哪些?

    firefox内核:Gecko

    IE TT 360 世界之窗 搜狗浏览器内核:Trident

    Opera:Presto 现为:Blink

    Safari Chrome:Webkit

    Chrome:blink

    H5新特性+新语义化标签

    HTML5不是SGML(标准通用标记语言)的子集了,主要是关于图像,位置,存储多任务等功能的增加。

    新语义化标签:

    绘画:canvas

    视频:video

    音频:audio

    article footer header nav section calendar date time email url search

    低端IE通过document.createElement方法添加标签

    新特性:

    客户端存储机制

    cookie是网站为了标示用户身份而储存在用户本地终端上的数据(经过加密)

    cookie数据始终在同源的http请求中携带(即使不需要),在浏览器和服务器间来回传递。

    sessionStorage和localStorage不会自动把数据发给服务器,仅在本地保存。

    存储大小:

    cookie数据不能超过4k

    sessionStorage和localStorage虽然也有存储大小的限制,可以达到5m更大。

    期限时间:

    localStorage 浏览器关闭后数据不丢失除非删除数据

    sessionStorage 数据在当前浏览器窗口关闭后自动删除

    作用域是限定在文档源中,文档源url是通过协议+主机+端口决定的,同文档源可以共享数据,不同文档源不能共享

    cookie 设置过期时间之前一直有效,即使窗口或浏览器关闭

    cookie兼容性好,但是难用,是早期为服务器端脚本设计的客服端存储机制

    webworker提供一个简单的方法使得web内容能够在后台运行脚本。

    websocket 标签页之间的通信

    1.地理位置API

    地理位置API(https://www.w3.org/TR/geolocation-API/)它能够允许浏览器(用户允许的情况下)检测用户的地理位置。

    2.历史管理API

    它允许web应用保存和更新它们的状态,以便当用户点击浏览器的后退与前进按钮的时候,无需刷新页面而立即做出响应。

    3.跨文档消息传递

    Web Worker

    单位与字体

    1.px:(Pixel)单位名称像素,相对长度单位,是相对显示器屏幕分辨率而言的。国内使用的多。

    2.em:单位名称为相对长度单位,相对于当前对象内文本的字体尺寸。如果当前对行内文本的字体尺寸未被人设置,则相对于浏览器的默认字体尺寸。国外使用的多。
    3.pt:单位名称为点(point),绝对长度单位一般老版本的table使用,现在已经不用了。
    4.rem:是CSS3中新增加的一个单位值,是相对长度单位。
    em是相对于元素的父元素的font-size进行计算。
    rem是相对于根元素html的font-size进行计算。
    这样rem就绕开了复杂的层级关系,实现了类似于em单位的功能。
    CSS
    盒子模型:
    标准盒子(w3c盒子模型):content+padding+margin+border
    IE盒子模型:content(padding+border+content)+margin
    CSS选择符?哪些属性是可以继承?
    id# class. 标签 相邻+ 子选择器 > 后代选择 li a 通配符* 属性选择器 伪类选择器
    可继续的样式:font-size font-family color ul li dl dd dt
    不可继承的样式:border padding margin width height
    CSS优先级算法如何计算?
    同级权重,遵循就近原则
    载入样式以最后载入的定位为准
     
     
  • 相关阅读:
    C# 委托/Func() 中 GetInvocationList() 方法的使用 | 接收委托多个返回值
    蒋廷黻著《中国近代史》-中国近代屈辱史读后感
    ASP.NET Core 上传多文件 超简单教程
    Python
    Python
    Python
    Python
    Python
    Python
    Python
  • 原文地址:https://www.cnblogs.com/Antwan-Dmy/p/10716732.html
Copyright © 2011-2022 走看看