随笔分类 - html/css
摘要：本文针对 SwissDev Jobs 网站的优化实践，介绍我们是如何把网站加载时间减少24% 的。上周，我们有机会对 SwissDev Jobs 网站性能进行了微调。 之所以要提升 SwissDevJobs.ch 网站性能，主要是有两方面原因： 良好的用户体验——即加载时间更短（且互动性更好）和使用
阅读全文
posted @ 2020-10-13 14:45
笑人
摘要：css 书写位置 行内样式，style标签link标签 行内样式 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>css书写位置</title> </head> <body> <p style="color:
阅读全文
posted @ 2020-10-13 14:43
笑人
摘要：概述 浏览器的缓存机制也就是我们说的 HTTP 缓存机制，其机制是根据 HTTP 报文的缓存标示进行的。所以在分析浏览器缓存之前，我们先使用图文简单介绍一下 HTTP 报文，HTTP 报文分为两种： HTTP 请求（Request）报文。报文格式为： 请求行。 HTTP 头（通用信息头，请求头，实体
阅读全文
posted @ 2020-10-13 14:40
笑人
摘要：简单理解： repaint主要是针对某一个DOM元素进行的重绘，reflow则是回流，针对整个页面的重排。字面意思来说：repaint就是重绘，reflow就是回流。repaint和reflow的目的是：展示一个新的页面样貌。 性能消耗： 在性能优先的前提下，性能消耗 reflow大于repaint
阅读全文
posted @ 2020-10-13 14:38
笑人
摘要：1. css Reset为什么存在？ 只要您的客户存在使用不同浏览器（ie,firefox,chrome等）的可能，那你就不得不从完美的理想状态回到现实，因为不同核心的浏览器对css的解析效果呈现各异，导致您所期望的效果跟浏览器的“理解”效果有偏差，今天提到的css reset就是用来重置（复位）元
阅读全文
posted @ 2020-10-13 14:37
笑人
摘要：互联网的诞生彻底改变了世界。以前习惯于在电视和报纸广告上一掷千金的企业开始渐渐意识到互联网带来的变化。他们不得不改变他们的投资方向，把他们的钱投向更有潜力，更能为客户带来利润的地方。于是，如果企业想要能有立足之地能够存活能够享誉世界的话，那么拥有网上身份成为了一种强制手段。现在的企业往往会通过网站高
阅读全文
posted @ 2020-10-13 14:36
笑人
摘要：虽然说现在服务器的硬件比之前是便宜了很多了，也有VPS和云服务器可以选择。但是对新手来说，如何选择适合自己的服务器也是一个很让人头疼的问题。 虚拟主机，VPS，还是独立服务器？ 对新手来说，可能一开始到是不会考虑到独立服务器。但还是想拉到一起讨论一下。 如果是个人博客，又没什么计划说这个博客会做商业
阅读全文
摘要：封装成mixin复用 在写css的时候, 很多样式都是很常用但是写起来很麻烦, 虽然现在有很多成熟的ui框架, 但是我们也不能一个简单的活动页也引入那么大个框架吧? 在工作中我也攒下了不少常用css, 我把他们封装成了mixin, 挑选了5个分享给大家, 希望大家喜欢. 做一名合格的"CV"工程师,
阅读全文
posted @ 2020-10-13 14:34
笑人
摘要：css 句法( css Syntax ) 语法是语言表达的规则。各种语言都有不同的语法，包括人类语言和计算机语言等。 语法有时候也指句法( syntax )，指的是句子由词汇构成的规律。也可以将它看作组成句子的规则。它包含两个方面的涵义： 词汇：即，可以构成句子的有效用词。例如，英语中的单词，Jav
阅读全文
posted @ 2020-10-13 14:32
笑人
摘要：前端安全的范围 将Web安全问题按照发生的区域来分类，发生在浏览器、Web页面中的安全问题就是前端安全问题。 同源策略 同源：URL由协议、域名、端口和路径组成，如果两个URL的协议、域名和端口相同，则表示他们同源。 URL是否同源原因 http://test.test.com/dir2/other
阅读全文
posted @ 2020-10-13 14:31
笑人
摘要：本来早就想写这篇文章的，由于有其他事情耽搁了（可能还是因为太懒），就拖到了现在，如果再不记下来，估计会抛到九霄云外了。 Nodejs的出现，让前端工程化的理念不断深入，正在向正规军靠近。先是带来了Gulp、webpack等强大的构建工具，随后又出现了vue-cli和create-react-app等
阅读全文
posted @ 2020-10-13 14:28
笑人
摘要：由于各大浏览器存在兼容性问题，同一个css属性在不同浏览器下的表现不一定相同，有经验的前端设计者都会自定义一个重置浏览器样式的css文件，在这个文件中定义一些针对不同的浏览器最终表现出一致的代码，大家最熟悉的也许就是* {margin：0 0}了，其实这是最简单的兼容性的代码，一般情况下，仅有这个是
阅读全文
posted @ 2020-10-13 14:25
笑人
摘要：1、引言 随着互联网安全意识的普遍提高，对安全要求稍高的应用中，HTTPS的使用是很常见的，甚至在1年前，苹果公司就将使用HTTPS作为APP上架苹果应用市场的先决条件之一（详见《苹果即将强制实施 ATS，你的APP准备好切换到HTTPS了吗？》一文）。 所以，无论是即时通讯IM还是其它应用，在网络
阅读全文
posted @ 2020-10-02 13:59
笑人
摘要：在网页制作中，元素的显示隐藏是非常常见的需求。本文将介绍元素显示隐藏的9种思路 display 对于元素显隐来说，最常见就是display:none | display:block，但是使用这种方法有个问题，元素的display属性在隐藏前并不都是block，还有可能是inline、inline-b
阅读全文
posted @ 2020-10-02 13:57
笑人
摘要：前言 在有些 css 相互影响作用下，对元素设置的 z-index 并不会按实际大小叠加，一直不明白其中的原理，最近特意查了一下相关资料，做一个小总结。 层叠上下文与层叠顺序 层叠上下文（stacking content）是 html 中的三维概念，也就是元素z轴。层叠顺序（stacking ord
阅读全文
posted @ 2020-10-02 13:56
笑人
摘要：概览 在dom里面有几个描述盒子位置信息的值， pading border margin width height client clientWidth 不要border clientHeight 不要border offset offsetTop offsetLeft offsetWidth 要b
阅读全文
posted @ 2020-10-02 13:55
笑人
摘要：1.图片向下撑大3像素问题 在一个盒子里面放一张图片，默认情况下，图片会向下撑大3像素，有以下几种解决方法： 1.1给图片添加display:block； 1.2给图片添加float:left； 1.3 给图片添加vertical-align:middle; 1.4 给他的父元素加font-size
阅读全文
posted @ 2020-10-02 13:54
笑人
摘要：前言 也许有人会说，都快 2019 年了怎么还读 css2.1 规范。一方面，现在最新的 css （core） 规范是 CSS2.2（以下截图来自 https://www.w3.org/TR/CSS/ ），又因为 CSS2.1 有中文的版本，并且和 CSS2.2 规范差异性不是很大，基于偷懒的目的最
阅读全文
posted @ 2020-10-02 13:53
笑人
摘要：引言 问题：css 文件分离 != css 作用域隔离 看下这样的目录结构： ├── src │ ├──...... # 公共组件目录 │ ├── components # 组件 │ │ └──comA # 组件A │ │ ├──comA.js │ │ ├──comA.css │ │ └── ind
阅读全文
posted @ 2020-10-02 13:52
笑人
摘要：作为一个前端开发，在浏览别人家的页面时总是会习惯性的查看他们页面的源码，发现大多数网站的页面，包括我自己写的页面中用到的最多的布局元素无外乎就是div、p、span、ul、dl、ol、li、dt、dd、strong、b，不管是什么样的效果都是由这些元素组成，现在都已经是9102年了，html5已经相
阅读全文
posted @ 2020-10-02 13:50
笑人
浙公网安备 33010602011771号