页面渲染html的过程
摘要：浏览器渲染页面的一般过程： 1.浏览器解析html源码，然后创建一个 DOM树。并行请求 css/image/js在DOM树中，每一个HTML标签都有一个对应的节点，并且每一个文本也都会有一个对应的文本节点。DOM树的根节点就是 documentElement，对应的是html标签。 2.浏览器解析
阅读全文
posted @ 2021-12-02 15:14
随笔分类 - web前端知识点（关于html）
知识点(三）
摘要：一、css垂直居中 单行文本的居中 1.文字水平居中 2.文本垂直水平居中 多行文本的垂直居中 1.使用display:flex实现 2.使用display:-webkit-box实现 3.使用绝对定位和负边距 4.使用transform:translate定位 5.绝对定位和0 6.通过displ
阅读全文
posted @ 2019-10-15 11:20
关于HTML(十三)---------meta viewport原理
摘要：<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1, user-scalable=yes"> <meta name="viewport" conten
阅读全文
posted @ 2018-05-03 10:29
关于HTML(十二)--------css设置图片上下居中
摘要：position: fixed;top:50%; transform:translateY(-50%);-ms-transform:translateY(-50%); /* IE 9 */-moz-transform:translateY(-50%); /* Firefox */-webkit-tr
阅读全文
posted @ 2018-04-24 16:06
关于HTML(十一)--------html模板技术
摘要：php模板，需要php解析后，再由apache输出； aspx需要专用dll解析后，由IIS输出； jsp需要虚拟机解析后，由tomcat输出； web服务器无法接识别并输出这些动态语言的文件格式，但对html都直接识别输出给浏览器，如果直接用html来做网页内容的展示，就少了一层解析工作，从客户端
阅读全文
posted @ 2018-04-18 15:29
关于HTML(十)-------怎么提升网站页面打开加载速度优化
摘要：元数据起始 怎么提升网站页面打开加载速度优化 一、尽量减少HTTP请求次数 1、合并js文件和css文件 将js代码和css样式分别合并到一个共享的文件，这样不仅能简化代码，而且可以减少HTTP请求次数。 2、cssSprites图片技术 CSS Sprites是减少图像请求的有效方法。把所有的背景
阅读全文
posted @ 2018-04-18 15:01
关于HTML(九)--------css js放置位置和原因
摘要：网站加载的整个完整过程了。 1.首先浏览器从服务器接收到html代码，然后开始解析html 2.构建DOM树（根据html代码自顶向下进行构建），并且在同时构建渲染树 3.遇到js文件加载执行，将阻塞DOM树的构建；遇到css文件，将阻塞渲染树的构建 （script标签中的defer属性：构建DOM
阅读全文
posted @ 2018-04-17 16:29
关于HTML(八)--------IE6中的常见BUG与相应的解决办法
摘要：开发前端的同学一定都知道，IE6是兼容BUG最多的浏览器，它不支持PNG alpha通道暂且不论。其文档的解析理解规范也引起了诸多恼人的BUG，有时甚至让人感到绝望。本文主要讲解一些比较容易遇到的IE6BUG，以及解决的办法。 一、IE6双倍边距bug 当页面上的元素使用float浮动时，不管是向左
阅读全文
posted @ 2018-04-17 14:40
关于HTML(七)--------HTML废弃的标签
摘要：html5废弃元素 表现性元素 下面的元素被废弃的原因是用CSS处理可以更好地替代他们： 框架类元素 下面的元素被废弃的原因是他们的使用破坏了可使用性和可访问性(但html5支持iframe)： 其他 下面的元素被废弃的原因是不经常使用他们，也会引起混乱，而且其它元素也可以很好地实现他们的功能： a
阅读全文
posted @ 2018-04-17 14:33
关于HTML(六)--------canvas
摘要：颜色、样式和阴影 线条样式 矩形 路径 转换 文本 图像绘制 像素操作 合成 其他
阅读全文
posted @ 2018-04-17 13:52
关于HTML(五)---------meta标签
摘要：<meta> 元素可提供有关页面的元信息（meta-information），比如针对搜索引擎和更新频度的描述和关键词。 <meta> 标签位于文档的头部，不包含任何内容。<meta> 标签的属性定义了与文档相关联的名称/值对。 meta的标签的使用是我在前端学习中曾经困惑过一段时间的问题。一方面不
阅读全文
posted @ 2018-04-16 11:43
关于HTML(四)---------使用data-的好处
摘要：data-* 属性用于存储页面或应用程序的私有自定义数据。 data-* 属性赋予我们在所有 HTML 元素上嵌入自定义 data 属性的能力。 存储的（自定义）数据能够被页面的 JavaScript 中利用，以创建更好的用户体验（不进行 Ajax 调用或服务器端数据库查询）。 data-* 属性包
阅读全文
posted @ 2018-04-16 10:43
关于HTML(三)---------xhtml和html的区别
摘要：HTML与XHTML之间的差别，粗略可以分为两大类比较：一个是功能上的差别，另外是书写习惯的差别。关于功能上的差别，主要是XHTML可兼容各大浏览器、手机以及PDA，并且浏览器也能快速正确地编译网页。 因为XHTML的语法较为严谨，所以如果你是习惯松散结构的HTML编写者，那需要特别注意XHTML的
阅读全文
posted @ 2018-04-14 19:29
关于HTML(二)---------浏览器的标准模式和怪异模式
摘要：标准模式和怪异模式的来由 在HTML与CSS的标准化未完成之前，各个浏览器对于HTML和CSS的解析有各自不同的实现，而有很多旧的网页都是按照这些非标准的实现去设计的。在HTML与CSS标准确定之后，浏览器一方面要按照标准去实现对HTML与CSS的支持，另一方面又要保证对非标准的旧网页设计的后向兼容
阅读全文
posted @ 2018-04-14 19:26
关于HTML(一)---------HTML5新特性2
摘要：（六）、地理定位 简单地用一句话概括就是，使用js获取浏览器当前所在的地理坐标，实现LBS(Location Based Service，基于定位的服务)。 下面写一下它的基本调用： if(navigator.geolocation){ navigator.geolocation.getCurren
阅读全文
posted @ 2018-04-13 16:59
关于HTML(一)---------HTML5新特性1
摘要：（一）、 语义标签 1、<section></section> 定义文档中的主体部分的节、段。 2、<article></article> 一个特殊的section标签，比section有更明确的语义。定义来自外部的一个独立的、完整的内容块，例如什么论坛的文章，博客的文本。。。 3、<aside><
阅读全文
posted @ 2018-04-13 16:17
