分类： CSS

8 篇文章

CSS雪碧图 (精灵图)
|
272
|
0
|
CSS

261 字
|
1 分钟内
概念 CSS Sprite 也叫 CSS 精灵、雪碧图，是一种网页图片应用处理方式。他允许你将一个页面涉及到的所有零星让图片都包含到一张大图中去，当访问该页面时，有从前的多次请求变为一次请求，客户端每显示一张图片都会向服务器端发送请求，所以图片越多请求越多（浏览器对同域名的HTTP请求有次数限制），造成延迟的可能性就越大，所以页面有许多icon时候…
css扫盲
|
273
|
0
|
CSS

373 字
|
2 分钟
垂直居中的集中方式 table 自带div display:tableflexmargin:autotransfrom:translate(-50%) JS动画与css动画的差异性 js动画用于较为复杂的逐帧动画,扩展性较高,可随时监听每一帧的变化,但对浏览器资源消耗较大css动画用于简单的补间动画,扩展性不高,CSS3动画存在兼容性问题 文本省略…
.input点击效果
|
268
|
0
|
CSS

6 字
|
1 分钟内
input:focus{ outline: none; border-style:solid; border-color: #03a9f4; box-shadow: 0 0 15px #03a9f4; }
原生单击下拉框效果
|
275
|
0
|
CSS

53 字
|
3 分钟
单击事件 <style> #ul01{ display:none } </style> <div id=""> <div id="li01"> 图片 <div id="ul01"> <p>123456</p> <p>123456</p> <p>123456</p> <p>123…
浏览器渲染原理
|
263
|
0
|
CSS

196 字
|
1 分钟内
浏览器渲染过程 根据HTML构建HTML树(DOM)根据CSS构建css树(cssDOM)将两棵树合并成一颗渲染树(render tree)layout布局paint绘制composite合成 (根据层叠关系展示画面) 更新样式的渲染方式 如果修改了布局（lauoyt）元素，浏览器将检查所有其他元素，进行重新布局 如果修改背景图、文字颜色或者阴影等…
跨平台中文字体解决方案
|
256
|
0
|
CSS

28 字
|
几秒读完
跨平台中文字体解决方案 黑体 font-family: -apple-system, "Noto Sans", "Helvetica Neue", Helvetica, "Nimbus Sans L", Arial, "Liberation Sans", "PingFang SC", "Hiragino Sans GB", "Noto Sans C…
各大厂初始化样式
|
280
|
0
|
CSS

91 字
|
4 分钟
通用 *{ margin:0; padding:0; box-sizing:border-box; } 淘宝 body, h1, h2, h3, h4, h5, h6, hr, p, blockquote, dl, dt, dd, ul, ol, li, pre, form, fieldset, legend, button, input, tex…
表单获取焦点样式
|
230
|
0
|
CSS

6 字
|
1 分钟内
input:focus{ outline: none; border-style:solid; border-color: #03a9f4; box-shadow: 0 0 15px #03a9f4; }