在设置login背景时，找到了一张这样的图片：但是设置成login背景时，如果没有做一些css适应设置，图片就变样了，变成了这样：严重变形了，这就造成了一种理想与现实的差距。若想解决这个自适应问题，其实很好解决，只需要在前端代码里加上这样css即可： 1 .main { 2 background: ...
分类：
Web程序 时间：
2020-11-11 15:50:24
阅读次数：
12
今天主要学习了CSS高级技巧，重点掌握精灵图、字体图标的使用，单行溢出显示省略号和一些常用的布局技巧！ 今日框架： 今日重点： 一、精灵图：为了有效地减少服务器接收和发送请求的次数，提高页面的加载速度 1）精灵图又称雪碧图，CSS Sprites 2）将网页中需要使用的多张小图片整合到一张大图中，这 ...
分类：
Web程序 时间：
2020-11-10 11:18:40
阅读次数：
31
<!DOCTYPE html> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> p ...
分类：
Web程序 时间：
2020-11-10 11:13:27
阅读次数：
18
最近在用Next.js （版本9.5.5）搭建项目时，发现css和less同时导入常常会报错，查阅一番资料后找到了一个靠谱的解决方案：
在目录下新建next.config.js文件，新增下列代码（先安装@zeit/next-less模块） ...
分类：
Web程序 时间：
2020-11-10 10:26:59
阅读次数：
52
原生js实现TodoMVC 先用html和css写好页面的基本结构样式，代码如下， index.html <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <link rel= ...
分类：
Web程序 时间：
2020-11-08 17:56:16
阅读次数：
32
我的前端之路： 作为一名web后端开发，三年前，因工作原因机缘巧合之下，独自负责模块的前后端开发，开始一边理解旧代码一边学习js、html教程，也对angular的架构进行独立思考。 为了快速提高并检验自己的html水平，照着喜爱的豆瓣网站首页，撸了一个粗略版的首页，然后心满意足地认为我已入了前端的 ...
分类：
Web程序 时间：
2020-11-08 17:53:11
阅读次数：
33
盒子模型 当对一个文档进行布局（lay out）的时候，浏览器的渲染引擎会根据标准之一的 CSS 基础框盒模型（CSS basic box model），将所有元素表示为一个个矩形的盒子（box）。CSS 决定这些盒子的大小、位置以及属性（例如颜色、背景、边框尺寸…）。 ——MDN 1. 盒子模型的 ...
分类：
Web程序 时间：
2020-11-08 17:51:22
阅读次数：
33
使用css定制表格： .table{ display:table; /*相当于table*/ section{ &:nth-of-type(1){ display:table-header-group; /*相当于thead*/ background:#555; color:#fff; } &:nt ...
分类：
Web程序 时间：
2020-11-08 17:12:24
阅读次数：
27
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>div+css</title> <style type="text/css"> .out{ border:solid 1px red; width: 960px; height: ...
分类：
Web程序 时间：
2020-11-08 17:04:26
阅读次数：
25
冒号：$("input:checkbox")表示input节点下带有checkbox属性的节点，一般用于$("input:checkbox[name='aaaa']");表示input节点下所有name属性值为"aaaa"的checkbox 空格：p span{}选择了P元素下的所有span元素。这 ...
分类：
Web程序 时间：
2020-11-08 17:03:04
阅读次数：
34
