- 博客(11)
- 收藏
- 关注
RSS订阅原创 CSS之margin怪异现象
当上下相邻的两个块级元素(兄弟关系)相遇时，如果上面的元素有下外边距margin-bottom,下面的元素有上外边距margin-top,则他们之间的垂直距离并不是margin-bottom + margin-top之和，对于嵌套(父子关系)的元素，父元素有上外边距，同事子元素也有上外边距，此时父元素塌陷较大的外边距值，即父元素的上外边距会取父子上外边距的较大值，子元素的上外边距会被忽略。解决方案：为父元素设置上边框、父元素设置上内边距、父元素设置overflow:hidden、浮动、定位等都可以解决。
2024-08-14 11:07:32
138
原创 前端SEO优化
SEO 是的首字母缩写，利用搜索引擎的规则对网站进行内部及外部的调整优化，提高网页或网站在搜索引擎中关键词的自然排名, 以求得获得更多的展现量和吸引免费的点击流量，从而达到互联网营销及品牌建设的目标。
2024-08-14 10:28:02
197
原创 SASS(scss)的快速入门
如果你的整个网站中有几处小小的样式类似（例如一致的颜色和字体），那么使用变量来统一处理这种情况是非常不错的选择。但是当你的样式变得越来越复杂，你需要大段大段的重用样式的代码，独立的变量就没办法应付这种情况了。或者，对于仅使用过一 次的属性值，你可以赋予其一个易懂的变量名，让人一眼就知道这个属性值的用途。中注释的作用包括帮助你组织样式、以后你看自己的代码时明白为什么这样写，以及简单的样式说明。最后，我们学习了与混合器相辅相成的选择器继承。的理念，选择器继承是说一个选择器可以继承为另一个选择器定义的所有样式。
2024-08-05 16:53:47
644
原创 git临时存储指令-stash
在平常的工作中，当我们在单独拉取的功能分支中进行开发时，遇到线上出现bug需要进行紧急修复，我们需要切换到主分支，进行代码的修复。应该哪次存储，可以直接用git stash apply index,此处的index指的是stash@{index}中的index。修改的文件必须都已经git add 添加到本地缓存，关联到了git。删除某次存储 git stash drop index。git stash list 查看已存储的列表。清空所有的存储 git stash clear。
2023-12-22 14:32:01
470
原创 浏览器渲染效率优化
1/合理合法的书写HTML和CSS，且不要忘记文档编码类型 2/CSS放在head标签内，脚本js放在body标签结束前，这样可以防止阻塞 3/简化和优化CSS选择器，尽量将嵌套层次降到最小 4/DOM的读写操作尽量放在一起 5/不要一条条的去改变样式，最好通过添加class，一次性改变 6/最好使用离线DOM，而不是使用真实的网页DOM进行修改，比如用documentFragment对象或者用cloneNode()在克隆对象上操作 7/当需要操作多次CSS或者DOM树时，可以先将DOM设成di
2020-08-17 14:04:29
138
原创 浏览器渲染阻塞
js阻塞： JS可以操作DOM来修改DOM结构，可以操作CSSOM来修改节点样式，这就导致了浏览器在遇到<script>标签时，DOM构建将暂停，直至脚本完成执行，然后继续构建DOM。如果脚本是外部的，会等待脚本下载完毕，再继续解析文档。现在可以在script标签上增加属性defer或者async。脚本解析会将脚本中改变DOM和CSS的地方分别解析出来，追加到DOM树和CSSOM规则树上。 每次去执行JavaScript脚本都会严重地阻塞DOM树的构建，如果JavaScript脚本还操作了C
2020-08-17 10:33:04
297
1
原创 浏览器渲染概要
1/浏览器将加载的HTML解析成DOM树 ①DOM树的构建都可能会被CSS和JS的加载而阻塞 ②display:none和注释及script标签都会在构建树中 ③当前节点的所有子节点都构建好后才会去构建当前节点的下一个兄弟节点。 2/构建CSSOM树 ①CSS解析可以和DOM解析同时进行 ②CSS解析和javascipt互斥 ③在webKit内核中对javascript进行了执行优化，只有在js中访问到CSS时才会进行互斥 3/构建...
2020-08-17 10:25:51
82
原创 css清除浮动-全面简单概要
css清除浮动方式： ①父级伪元素清除 ：after eg：.clearfloat:after{display:block;clear:both;content:"";visibility:hidden;height:0} ②父级div定义overflow:hidden ③结尾处加空div标签clear:both ④父级div定义height ...
2020-04-27 15:38:50
94
原创 AMD和CDM的区别
AMD: RequireJS CMD: SeaJS 对于依赖的模块，AMD 是提前执行，CMD 是延迟执行。不过 RequireJS 从 2.0 开始，也改成可以延迟执行（根据写法不同，处理方式不同）。CMD 推崇 as lazy as possible. AMD在加载模块完成后就会执行改模块，所有模块都加载执行完后会进入require的回调函数，执行主逻辑，这样的效果就是依赖模块的执行顺序和...
2020-04-17 11:26:11
1074
原创 DOMContentLoaded 与onload区别以及使用
一、何时触发这两个事件？1、当 onload 事件触发时，页面上所有的DOM，样式表，脚本，图片，flash都已经加载完成了。2、当 DOMContentLoaded 事件触发时，仅当DOM加载完成，不包括样式表，图片，flash。二、为什么要区分？ 开发中我们经常需要给一些元素的事件绑定处理函数。但问题是，如果那个元素还没有加载到页面上，但是绑定事件已经执行完了，是没有效果的。这两个事...
2018-04-27 22:26:24
1061
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人