css画一个圈带一条线
发表于|更新于
|浏览量:
深窥自己的心,而后发觉一切的奇迹在你自己。——培根
用到的是css的background属性和radial-gradient
1 | /** 淡蓝渲染到20px |
效果:
相关推荐
2021-12-19
flex布局
他想给M打一个电话,告诉她,他要回家了。不再回来了。最后他只是发了短信道:“M,我不爱你,从来没有爱过,因为我心里装着别人。”窗外掠过的景,就好像他的泪一样,总是一闪而过。——灵遁者 flex布局是开发中最常用的布局之一 阮一峰的flex布局教程 下方摘自uniapp官方文档flex布局一栏 FlexboxFlex 容器Flex 是 Flexible Box 的缩写,意为”弹性布局”,用来为盒状模型提供最大的灵活性。 nvue布局模型基于 CSS Flexbox,以便所有页面元素的排版能够一致可预测,同时页面布局能适应各种设备或者屏幕尺寸。Flexbox 包含 flex 容器和 flex 成员项。如果一个nvue元素可以容纳其他元素,那么它就成为 flex 容器。 文档中未说明的 flexbox 属性均不支持:如 order、flex-grow 、flex-shrink 、 flex-basis、align-content、align-self 等。 在 nvue中,Flexbox 是默认且唯一的布局模型,所以你不需要手动为元素添加 display: flex; 属性。...
2023-05-09
元素下方超出换列
根本不应该为取悦别人而使自己失敬于人——卢俊 我们有时候需要这种需求:元素高度超出后换到下一列 则可以使用column-count column-count可以指定最大列数 123456column-count: 3;column-count: auto;column-count: inherit;column-count: initial;column-count: unset; 简写属性:columns 12345678910111213141516/* Column width */columns: 18em;/* Column count */columns: auto;columns: 2;/* Both column width and count */columns: 2 auto;columns: auto 12em;columns: auto auto;/* Global values */columns: inherit;columns: initial;columns: unset; 例子: HTML12345<p class="c...
2021-04-15
js日期、经纬度格式化
如果你不出去走走,你就会以为这就是全世界。——《天堂电影院》 如果你不出去走走,你就会以为这就是全世界。——《天堂电影院》 之前写过一篇js时间戳格式化以及一篇js中Date函数的api 今天写篇“人性化”的格式化的 1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889// 格式化 传入毫秒值,计时秒表用function formatTime(time) { if (typeof time !== 'number' || time < 0) { return time } var hour = parseInt(time / 3600) time = time % 3600 var minute = parseInt(time / 6...
2022-07-10
vue3配置jsx
正如自然忌讳真空一样,人类是讨厌平等的。——《我是猫》 首先按照官方文档创建项目: 1npm init vite hello-vue3 -- --template vue # 或 yarn create vite hello-vue3 --template vue 然后我们安装jsx插件:https://github.com/vuejs/babel-plugin-jsx 1npm install @vue/babel-plugin-jsx -D 然后配置vite.config.js 123456789101112import { defineConfig } from 'vite'import vue from '@vitejs/plugin-vue'import vuejsx from "@vue/babel-plugin-jsx"// https://vitejs.dev/config/export default defineConfig({ plugins: [vue(),...
2025-05-17
pickr
业精于勤,荒于嬉。—— 韩 愈《进学解》 https://github.com/simonwep/pickr Pickr:一个简单、多主题、响应式且可定制的颜色选择器库在网页设计和前端开发中,颜色选择器是一个不可或缺的工具。虽然许多框架提供了内置的颜色选择器,但它们往往难以扩展或自定义。Pickr 是一个轻量级、无依赖的颜色选择器库,它提供了丰富的功能,同时完全兼容所有主流 CSS 框架。 什么是 Pickr?Pickr 是一个开源的颜色选择器库,支持多种颜色格式(如 rgba、hsla、hsva 等),并提供多种主题和自定义选项。它专为现代前端开发设计,具有以下特点: 核心特点: 无依赖:不依赖任何第三方库(如 jQuery)。 多格式支持:支持 rgba、hsla、hsva、hex 和 CMYK 格式。 多主题:内置多种主题样式,兼容主流 CSS 框架(如 Bootstrap、Materialize)。 响应式设计:适配移动端和桌面端。 自定义能力:可通过 JavaScript 和 CSS 轻松自定义外观和功能。 支持透明度:包括 alpha 通道的选择。 轻量级:小巧...
2020-11-20
vue封装axios请求工具类
以勇气面对人生的巨大悲恸,用耐心对待生活的小小哀伤。——雨果 首先安装 12345678# axioscnpm i --save axios# 格式化参数插件cnpm i -- save qs# 对象合并插件cnpm i -- save lodash# cookie操作cnpm i -- save vue-cookie 然后我们自己封装一个请求组件 首先创建文件 然后放入我们的代码。。。 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132import ...

阿超
我的名字叫阿超 年龄25岁 家在北京市 职业是软件开发 每天最晚也会在八点前回家 不抽烟 酒浅尝辄止 晚上十二点上床 保证睡足八个小时 睡前写一篇博客 再做二十分钟俯卧撑暖身 然后再睡觉 基本能熟睡到天亮 像婴儿一样不留下任何疲劳和压力 就这样迎来第二天的早晨 健康检查结果也显示我很正常 我想说明我是一个不论何时都追求内心平稳的人 不拘泥于胜负 不纠结于烦恼 不树立使我夜不能寐的敌人 这就是我在这社会的生活态度
Follow Me公告
This is my Blog