给大家简述一个常见的transform应用，就是当我们用鼠标滑向图标按钮时，图标会自动旋转一周，这个效果完全不依赖JS，由css3的transform就可以完成。Transform简介在CSS3中transform主要包括以下几种：旋转rotate、扭曲skew、缩放scale和移动translate以及矩阵变形matrix。1、旋转rotate() ：通过指定的角度参数对原元素指定一个2D ro
一、介绍
采用这种字体，我们可以避免网站制作中采用好多图片，一方面解决了浏览器的兼容性问题。另一方面，这些字体都是矢量字体，我们只要在调整这些图标时，将他们的字体大小以及颜色，我们就可以解决很多不是图片的图标了。
二、使用原因
今天在用到jquery.mmenu.js过程中（手机上的单个按钮菜单，具体将在下一节讲到），也是从网上找到的一个简单的demo，很简单的，如下图：
于
原创
2022-04-25 10:14:08
3272阅读
字体图标
原创
2022-03-10 13:34:32
1251阅读
字体图标
原创
2021-09-01 10:16:16
1849阅读
图标闪烁CSS代码 <!DOCTYPE html> <html> <head> <style> #markerDiv { position: absolute; float: left; left: 20px; top: 20px; width: 38px; height: 44px; backgr
感谢印记中文的 QC-L[1] 对本文进行翻译，英文原文: English Version[2]。在 重新构想原子化 CSS中，我提到了 UnoCSS[4] 的一个预设，它提供了在纯 C...
转载
2022-01-14 17:42:58
210阅读
父层class设置outdiv 子层设置为blingbling .outDiv { display: flex; justify-content: center; align-items: center; .blingbling { position: absolute; -webkit-anima ...
转载
2021-10-13 14:39:00
2915阅读
2评论
感谢印记中文的 QC-L[1] 对本文进行，英文原文: English Version[2]。在 重新构想原子化 CSS中，我提到了 UnoCSS[4] 的一个预设，它提供了在纯 C...
转载
2021-11-22 16:53:28
416阅读
引入ico图标<link rel="shortcut icon" href="favicon.ico" type="image/x-icon"/> 注意：它不是iconfont字体哦 也不是图片。位置是放到 head 标签中间。后面的type=“image/x-icon” 属性可以省略。（我相信你也愿意省略。）为了兼容性，请将favicon.ico 这个图标放到根目录下。下载及转换ico图标网站（方便）我们可以自己做的图片，转换为 ico图标，
原创
2020-07-09 14:41:22
1940阅读
# CSS 和 SVG 在 Android 图标中的应用
在移动应用的开发中，图标是用户界面设计的一个重要组成部分。Android应用中的图标通常需要在不同的尺寸和分辨率上保持清晰，因此CSS和SVG（可缩放矢量图形）成为了设计图标的热门选择。本文将探讨如何使用CSS和SVG创建Android图标，并通过代码示例来展示具体的实现方式。
## 一、什么是SVG？
SVG（Scalable Ve
文章目录web字体字体格式字体图标字体图标优点字体图标使用流程设计字体图标上传生成字体包下载兼容字体包字体引入到HTML第一步：在样式里面声明字体： 告诉别人我们自己定义的字体第二步：给盒子使用字体第三步：盒子里面添加结构追加新图标到原来库里面web字体字体格式不同浏览器所支持的字体格式是不一样的，
原创
2021-06-10 19:49:13
2228阅读
文章目录web字体字体格式字体图标字体图标优点字体图标使用流程设计字体图标上传生成字体包下载兼容字体包字体引入到HTML第一步：在样式里面声明字体： 告诉别人我们自己定义的字体第二步：给盒子使用字
原创
2020-07-09 14:34:24
10000+阅读
网站图标和字体图标1.网站图标作用：一个好的ico图标可以加深用户对于网站的记忆。降低用户记忆成本，就好像现在说道熊爪大家都能够想到度娘，更多的属于用户体验。有利于识别当前窗口是在哪个网站。制作流程： （1）一张图 （2）在网上将图片做成ico图标（网址：http://www.bitbug.net/） （3）在html中引入<link rel="shortcut icon"...
原创
2022-03-02 17:47:56
331阅读
网站图标和字体图标1.网站图标作用：一个好的ico图标可以加深用户对于网站的记忆。降低用户记忆成本，就好像现在说道熊爪大家都能够想到度娘，更多的属于用户体验。有利于识别当前窗口是在哪个网站。制作流程： （1）一张图 （2）在网上将图片做成ico图标（网址：http://www.bitbug.net/） （3）在html中引入<link rel="shortcut icon"...
原创
2021-08-18 02:04:29
456阅读
前言推荐到下面2个免费好用的字体图标网站，下面以阿里巴巴矢量图标库举例说明1. 阿里巴巴矢量图库2. Font Awsome 步骤1. 登录官网后，搜索要下载的图标，鼠标指向该图标后如下图所示，点击加入购物车图标 2. 然后点击右上角的购物车图标后如下图所示，选择下载代码 也可以选择添加至项目，这样会创建一个自定义文件夹，方便你后续新增下载图标
1. 使用css实现箭头图标:①. 一个div盒子,有border值.
②. border占满所有内容区,盒子是实心的.只剩4个边框.
③. 将div的宽度和高度设置为0,再设置边框样式:
.triangle{
width: 0;
height: 0;
border-top: 50px solid black;
border-right: 50px
转圈代码<i class="el-icon-loading"></i>
.el-icon-loading {
animation: rotating 2s linear infinite
}
.el-icon--right {
margin-left: 5px
}
.el-icon--left {
margin-right: 5px
}
@k
原创
2023-09-08 19:31:37
479阅读
# 使用CSS为jQuery按钮添加小图标
在Web开发中，经常需要使用按钮来触发某些操作。而为了提升用户体验，我们通常会在按钮上添加一些小图标，以便用户更直观地理解按钮的功能。本文将介绍如何使用CSS为jQuery按钮添加小图标。
## 准备工作
在使用CSS为jQuery按钮添加小图标之前，我们需要准备以下资源：
1. jQuery库：确保在项目中引入了jQuery库。
2. 图标资源
CSScss简介1.什么是CSS，有什么作用？CSS(Cascading Style Sheet) : 层叠样式表语言。CSS的作用是：修饰HTML页面，设置HTML页面中的某些元素的样式，让HTML页面更好看。CSS好比是HTML的化妆品一样。HTML还是主体，CSS依赖HTML。CSS的存在就是修饰HTML，所以新建的文件还是xx.html文件。2.CSS我们要求掌握到什么程度？常见的CSS样
背景实际项目中，一般都会遇到不同颜色的图标，例如 导航栏图标的不同状态方法方法1需要UI设计师给出不同颜色的图标，在不同状态下设置不同的元素背景。.icon { background-image: url(./home.png);}.icon.active { background-image: url(./home-active.png);}缺点是：当状态改变后，浏览器才
转载
2022-11-29 11:34:23
161阅读
