Css样式技巧
关注
分享
扫一扫
安康全是山
我叫闰土，我是来找猹的。
展开
-
ps图片导svg，并上传到阿里图标库
之前一直用的Inksacpe转的，但是在删除背景时，图片极其容易虚化变形。最近发现ps导出的svg，也可以上传到阿里，最关键的一步是先把图片“形状化”。教程如下：1.打开ps，导入需要转换的图片；2.用快速选择工具，选中图片形状；3.在图片上单击右键，选择“建立工作路径”；4.点击左侧“钢笔”工具，并在图片上单击右键，选择“自定义形状”；5.点击左侧“矩形”工具，选择“自定义形状工具”，会发现顶部导航的“形状”处，会出现和图片一样的形状，如果没...原创 2021-07-16 15:36:44 · 2751 阅读 · 5 评论 -
亲测有效：解决inkscape转换的svg图标，上传到阿里图标库不显示问题
近期项目需求，需要把UI设计的图片转为图标，且合并到阿里现有的项目图标中。踩坑：试了好多次，SVG上传到阿里图标的都是空白的;注意：别用网上在线转SVG的图标，试了好多上传时都是空白实现方案：1.准备好图片转换工具inkscape；2.登录阿里图标；1.inkscape 0.92.3的中文版安装教程如下：百度网盘： https://pan.baidu.com/s/1sVzQiKcrXZf1SO93rU9Jmg提取码：swxf2.inkscape 0.92.3使用教程如原创 2020-06-03 17:10:26 · 2813 阅读 · 2 评论 -
精巧的导航栏样式
想仿一遍的导航栏样式：https://tympanus.net/Development/CreativeLinkEffects/css实现的图标：The Shapes of CSS转载 2018-12-13 18:02:34 · 314 阅读 · 0 评论 -
:before 和 :after的多用途实践 — 特效篇(2)
转自：https：//blog.youkuaiyun.com/FE_dev/article/details/72765447实现几个有关按钮的特效 <!doctype html><html lang="en"> <head> <meta charset="UTF-8"> <title>白光特效</title转载 2018-12-13 17:33:31 · 182 阅读 · 0 评论 -
:before 和 :after的多用途实践 — 白光特效篇（1）
转自：https://blog.youkuaiyun.com/fe_dev/article/details/72571110如何能生成一道光，当鼠标移入时，能有种闪光的效果 <!doctype html><html lang="en"> <head> <meta charset="UTF-8"> <title>白光特效转载 2018-12-13 16:55:57 · 275 阅读 · 0 评论 -
为了实现css特效，从认识:before 和 :after开始！
开始之前有有一个知识点需要知道：“：before”和“:: before”的区别单冒号（:)伪类，双冒号（：:)伪元素1.使用方法如下:before 选择器向选定的元素 前 插入内容。 :after选择器向选定的元素 后 插入内容。 使用 content 属性来指定要插入的内容。 例：<!DOCTYPE html><html><hea...原创 2018-11-26 13:08:54 · 559 阅读 · 0 评论 -
修改原生滚动条的样式，可兼容火狐，ie，谷歌
小天地，大世界：https://www.lyblog.net/detail/314.html转载 2018-09-10 16:31:34 · 18002 阅读 · 3 评论 -
解决因高度引起父元素塌陷的方法
只需要将 clearfix 这个类加入到高度塌陷的父元素中即可.clearfix{ zoom:1;}.clearfix:after{ content: ""; display: block; visibility: hidden; height: 0; clear: both;} ...原创 2018-09-10 15:56:22 · 507 阅读 · 0 评论 -
h5响应式布局，pc端和手机端的几种分辨率
1. 一般电脑屏幕分辨率 19120X1080 ,1366X768，1440X900，1600X9002.手机端常见分辨率（分辨率与手机屏幕大小无关）常见的级别：QVGA:240*320WQVGA:240*400CGA:200*320HVGA:320*480EGA:350*640NVGA:360*640WVGA:480*800FWVGA:480*854...原创 2018-09-10 11:37:42 · 10413 阅读 · 0 评论 -
字体主题宝库：25款很好看的液晶数字字体下载
25款很好看的液晶数字字体下载：点击打开链接转载 2018-07-05 17:51:28 · 21872 阅读 · 0 评论 -
CSS尺寸和字体单位-em、px还是%？？
在页面整体布局中，页面元素的尺寸大小（长度，宽度，内外边距等）和页面字体的大小也是重要的工作之一。到底哪种才是比较好的：点击打开链接转载 2018-06-27 17:26:47 · 187 阅读 · 0 评论