css
文章平均质量分 59
金lin
这个作者很懒,什么都没留下…
展开
-
CSS3动画实现高亮光弧效果,循环闪动效果
主要运用css动画进行循环播放,修改css渐变效果元素<!Doctype html><html> <head> <meta name="viewport" content="width=device-width,iitial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" /> <meta http-equiv="Content-Type" content原创 2021-09-08 09:38:34 · 1348 阅读 · 0 评论 -
css多边形制作简历小标题二级标题
使用css边框绘制加 transform: skewX(45deg);属性实现<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>css多边形</title> <style> .div { width: 100px; height: 0; border-width: 0 45px 45px; borde原创 2021-09-07 16:22:36 · 290 阅读 · 0 评论 -
css+js实现时钟
完整代码<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>css时钟</title> <style> html { /* background: #282828; */ text-align: center; font-size: 10px; } body { margin: 0; .原创 2021-08-03 10:00:16 · 162 阅读 · 0 评论 -
移动端网页禁止下拉刷新css
禁止下拉刷新下拉刷新是当前流行的移动开发模式。如果你不喜欢这样做,只需将overscroll-behavior-y属性的值设为contains即可达到此效果。body { overscroll-behavior-y: contain;}原创 2021-08-02 10:13:03 · 2425 阅读 · 1 评论 -
web前端兼容性问题
一直以来,Web前端领域最大的问题就是兼容性问题前端兼容性问题分三类:浏览器兼容性屏幕分辨率兼容性跨平台兼容性浏览器兼容性问题IE6、7、8不支持HTML5、CSS3、SVG标准,可被判定为“极难兼容”IE9不支持Flex、Web Socket、WebGL,可被判定为“较难兼容”IE10部分支持Flex(-ms-flexbox)、Web Socket,可被判定为“较易兼容”IE11部分支持Flex、WebGL,可被判定为“较易兼容”IE6、7、8、9可视为“老式浏览器”IE10、11可原创 2021-07-01 17:29:47 · 1376 阅读 · 0 评论 -
详细一步到位,快速掌握webpack,无缝衔接webpack5
webpack快速使用使用webpack准备1.创建webapck项目2.项目根目录创建webpack.config.js文件创建src文件夹写法规范source-map代码分割PWA(离线使用)externals多进程打包dll可以修改压缩配置入口文件webpack5使用webpack准备首先要安装有node,会使用npm 下载命令(这个非常简单,不会直接百度)1.创建webapck项目npm initnpm i webapck webapck-cli -D 下载webpack和cli2.项目原创 2021-04-22 15:21:32 · 223 阅读 · 0 评论 -
前端开发需掌握的技术
原创 2021-04-02 15:13:34 · 73 阅读 · 0 评论 -
uniapp中使用uview ui 安装使用
1.npm安装 npm install uview-ui2.全局配置 import uView from "uview-ui"; Vue.use(uView);3.pages.json配置"easycom": { "^u-(.*)": "uview-ui/components/u-$1/u-$1.vue" },4.uni.scss添加@import 'uview-ui/theme.scss';5.app.vue添加<style lang="scss">原创 2020-12-18 13:25:12 · 530 阅读 · 0 评论 -
less高级
条件表达式.test(@size) when (@size >= 10){ width: @size; color: #f00;}类型检测.test(@param) when (iscolor(@param)){ color: @param;}.test(@param) when (isnumber(@param)){ width: @param;}and、or、not.test(@size) when (@size > 10) and (@size <原创 2020-11-26 14:45:58 · 287 阅读 · 0 评论 -
less学习
less学习0.1less使用需要下载文件包less使用需要下载文件包npm 安装或者 引入less.js使用方法1.可以声明变量后引用,也可以声明属性名或者选择器@变量名@colors:#81F7F3;body {text-align: center;}.webd {background-color: @colors;height: 30vh;border: 1px solid saddlebrown;width: 20vw;.wc {margin: 0 auto;hei原创 2020-11-25 17:27:43 · 167 阅读 · 0 评论 -
github发布静态网站
创建仓库设置分支,gh-pages.在这个分支下才能部署静态网站。不会添加 分支怎么办?教你一个最简单的方法,在设置中找到选择分支下面的设置主题,选择主题就可以了。最后就是把静态网站放上去了,用git或者用网站上传文件或自己创建都可以,到设置中看看网站访问地址直接在浏览器上访问ok!...原创 2020-08-21 16:20:09 · 204 阅读 · 0 评论 -
去除滚动条显示,继续滚动
/* 滚动条 *//* 设置滚动条的样式 */::-webkit-scrollbar { display: none;}``.sd{ height: 52vh; overflow: hidden; scrollbar-width: none; /* border: 1px dotted rgb(14, 207, 255); */}`原创 2020-07-20 16:32:24 · 126 阅读 · 0 评论 -
sass,scss学习
Sass 是 CSS 扩展语言,可以帮助我们减少 CSS 重复的代码,节省开发时间。Sass 完全兼容所有版本的 CSS。Sass 扩展了 CSS3,增加了规则、变量、混入、选择器、继承、内置函数等等特性。Sass 生成良好格式化的 CSS 代码,易于组织和维护。Sass 文件后缀为 .scss。/* 定义颜色变量,要修改颜色值,修改这里就可以了 */$primary_1: #a2b9bc;$primary_2: #b2ad7f;/* 使用变量 */.main-header { b原创 2020-06-04 10:16:41 · 426 阅读 · 0 评论