![](https://img-blog.csdnimg.cn/20201014180756927.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
html
单箭头→
找准方向,干就完了...
展开
-
手写选中框css,对勾css✔️
手写选中框及对勾的css成品原创 2023-05-15 16:46:02 · 182 阅读 · 0 评论 -
网站整体置灰代码兼容各端
网页置灰原创 2022-11-30 20:23:28 · 157 阅读 · 0 评论 -
客户端资源优化(html渲染速度,静态资源)
一 前端静态资源预加载提高网页渲染速度-preload:type: css、js、image、font动态key值:href<link rel="preload" href="myCss.css" as="style" onload="this.rel='stylesheet'"><link rel="preload" href="./manifest.js" as="script"><link rel="preload" href="./vendor.js" as=原创 2022-04-13 16:18:59 · 241 阅读 · 0 评论 -
兼容PC/M端的手指滑动,拖拽点击自动轮播插件封装
轮播html<div class="swiper"> <div class="hideBox" id="ppt"> <div class="car-move clear abs" id="ppt-contents"> <div class="move-box"> <img src="./images/banne原创 2021-06-03 10:58:05 · 111 阅读 · 0 评论 -
rem网页自适应封装,PC/M端网页自适应处理
(function(designWidth) { function computrFont() { let winW = document.documentElement.clientWidth; if (winW >= 1920) { // PC端 document.documentElement.style.fontSize = '100px'; return; } if (winW <= 1280)原创 2021-06-03 10:01:17 · 189 阅读 · 0 评论 -
css postion你不知道的坑,aboslute、fiexed、relative等值不为static状态时
一、z-index基础知识1.z-index的含义z-index属性指定了元素及其子元素的【z顺序】,而【z顺序】可以决定当元素发生覆盖的时候,哪个元素在上面。通常一个较大的z-index值的元素会覆盖较低的那一个。2.属性值z-index:auto; 默认值z-index:;整数值z-index:inherit; 继承3.基本特性1>支持负值;2>支持CSS3 animation动画;(并没什么实用应用场景)3>在CSS2.1时代,需要和定位元素配合使用如果不考虑C转载 2021-05-11 10:45:12 · 321 阅读 · 0 评论 -
什么是HTML语义化标签以及强调它的重要性
什么是html语义化标签HTML语义化标签也是HTML的所有标签,css所有标签为什么强调我们写的时候要语义化利于代码的解读性利于SEO,方便爬虫更好更快的识别,比如h1标题,一般都是标题,nav导航等,智能识别和过滤。利于浏览器渲染与解析,乱使用标签或嵌套标签,浏览器内核计算速率会变复杂HTML语义化的所有标签1:定义上的:<!--...--> 定义注释。<!DOCTYPE> 定义文档类型。<html>定义 HTML 文档。<原创 2020-10-22 18:00:58 · 365 阅读 · 0 评论 -
横向拖拽滚动css
1.父元素 css:.parent { display: -webkit-box; white-space: nowrap; overflow-x: scroll; overflow-y: hidden;}子元素无需设置浮动交给父元素的display: -webkit-box; white-space: nowrap;原创 2020-08-28 18:38:56 · 1149 阅读 · 0 评论 -
手写兼容PC/M一体的滑拖拽动drag,banner切换
html:<div class="love-car obox"> <div id="seemycar"> <span class="tit pos"> 我的爱车 <!-- <i class="yc-icon-common yc-i-rzyl-i"></i> --> </span> <span id="goseemyca原创 2020-08-28 18:29:01 · 180 阅读 · 0 评论 -
css播放按钮,三角箭头
CSS.p-open-icon { width: 50px; height: 50px; display: block; position: absolute; left: 50%; top: 50%; margin: -25px; background原创 2020-07-21 16:08:43 · 785 阅读 · 0 评论 -
最易懂的高级前端面试题总结
一.js基础1.继承的几种方式和区别创建一个父类构造函数1. es5写法 function Animal( name ){ // 属性 this.name = name; // 方法 this.say = function(){ console.log(this.name + '说拜拜!'); } }2. es6 class语法糖 class Animal{...原创 2020-06-05 10:10:35 · 341 阅读 · 0 评论