- 博客(13)
- 收藏
- 关注
RSS订阅原创 媒体查询响应式布局菜单案例
创建顶部菜单，当可视窗口小于414时原菜单将会消失出现小菜单，点击小菜单会出现和之前一样的菜单选项，并且扩大可视窗口后小菜单会消失
2022-04-27 20:11:06
921
原创 前端性能优化，静态资源缓存：Expires、Last-Modified、Etag
小明是一家公司的前端开发，最近小明老板总是说打开公司的网页很慢,认为是代码有bug ，限期一个星期之内搞定·小明分析了公司网站，发现问题有很大一部分原因是:静态资源没有缓存。公司网站上主要有以下几类文件:1.入口html文件2.公司自己开发的js文件3.公司自己开发的css文件4.图片文件5.引入的第三方的框架js 、 css等请小组讨论，帮助小明做出网站的缓存规划–什么文件需要缓存,缓存的周期是多久?(版本周期30天)......
2022-04-26 20:04:02
792
原创 html+css+js仿写星巴克网页
用到了动画效果@keyframes可将图片进行轮播transform: translate(0, -5px);当鼠标放在图片上时可向上凸出运用绝对定位将左侧位置一直固定，右侧使用相对运用top和left调整位置BUG:轮播图也可以通过按键变化图片，多按几次后好像变化的图片为一张效果图html<!DOCTYPE html><html lang="en"> <head> <meta charset="UT...
2022-03-27 19:22:50
2273
原创 html+css仿写NIKE官网静态页面
第一次较完整的网页，没有动画，纯静态，没有调式各种窗口大小，谷歌浏览器缩放90%为正常比例部分效果图html<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="view...
2022-03-27 18:56:18
2171
2
原创 box-sizing:boder-box却不能将两个盒子放入一行
问题描述两个div，宽分别为50%，转为行内块，想放入同一行时，box-sizing为border-box 却不可以放在一行。<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport
2022-03-22 19:34:31
437
原创 盒类型呈现效果block、inline、inline-block、none
盒类型 呈现效果 备注block 独占一行inline 一行多个 不能设置长宽 上下margin无效 上下padding会混乱布局inline-block 有block和inline的特性none 元素隐藏...
2022-03-22 19:23:32
283
原创 px、em、rem、百分比单位类型与相对基准
单位名称 单位类型（相对/绝对） 相对基准 px 相对 屏幕像素缩放后的尺寸百分比 相对 font-size相对于继承，width相对与父元素em 相对 相对于本元素的font-sizerem ...
2022-03-09 15:02:26
261
原创 前端面试题import和link导入css有什么区别？
优点:import模块化思想link实现结构层和表现层分层，提高代码可维护性缺点:import@import url list-of-media-queries@import兼容性不好，加载速度慢。使用方法：import@import' '@import url（“”）@import "common.css" screen;link<link rel="stylesheet" type="text/css" href="文件路径"/>...
2022-03-09 15:01:01
65
原创 let和const
let暂时性死区：在代码块内，使用let命令声明变量之前，该变量都是不可用的，这个区域被称为“暂时性死区”1.let是在所在代码块中有效，并且没有变量提升，因此在下列例子中会报错。应先定义a，再赋值。2.let同一作用域下不能够重复声明3.变量会往外找不会往里找。第十一行的v3未定义因此会报错constconst声明一个只读的常量，一旦声明其值不能改变且需立即初始化。其他与let用法一样。它保存的是数据所在的地址。const命令只是保证地址不变，并不保证该地址的数据不
2022-03-07 20:58:46
108
转载 doctype的作用是什么？它的混杂模式和便准模式怎么区分？他们都有什么意义？
doctype的作用是什么？它的混杂模式和便准模式怎么区分？他们都有什么意义？doctype是一种标准通用标记语言的文档类型声明，目的是告诉标准通用标记语言解析器要使用什么样的文档类型定义来解析文档。可打开开发人员工具在控制台输入document.compatMode判断输入什么模式。怪异模式：BackCompat标准模式：CSS1CompatHTML5的doctype为什么只需要写<!DOCTYPE html>？html5不基于SGML,因此不需要对DTD进行引用，但是需要doc
2022-03-06 14:56:35
105
原创 meta标签是什么，通常包含哪些内容？
meta是元标签，定义元数据，告诉浏览器配置。一般用于做一些页面说明，比如编码，关键字，页面尺寸，修改日期。meta元素定义的元数据的类型包括以下几种：（来源MDN：<meta>：文档级元数据元素 - HTML（超文本标记语言） | MDN）如果设置了name属性，meta元素提供的是文档级别（document-level）的元数据，应用于整个页面。 如果设置了http-equiv属性，meta元素则是编译指令，提供的信息与类似命名的 HTTP 头部相同。 如果设置...
2022-03-06 14:34:47
4150
原创 洛谷P5831 Python [USACO19DEC]Cow Gymnastics B
题目描述为了提高健康水平，奶牛们开始进行体操训练了！Farmer John 选定了他最喜爱的奶牛 Bessie 来执教其他 NN 头奶牛，同时评估她们学习不同的体操技术的进度。KK 次训练课的每一次，Bessie 都会根据 NN 头奶牛的表现给她们进行排名。之后，她对这些排名的一致性产生了好奇。称一对不同的奶牛是一致的，如果其中一头奶牛在每次训练课中都表现得都比另一头要好。请帮助 Bessie 计算一致的奶牛的对数。输入格式输入的第一行包含两个正整数 KK 和 NN。以下 KK 行每行包
2022-01-19 14:10:22
1033
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人