10个有用的css编辑网站

  1. Neumorphism

官方网站:https://neumorphism.io/
此网站不但可以为section或div生成软UI,还可以自定义border-radius、box-shadow等。

  1. Shadows Brumm

官方网站:https://shadows.brumm.af/
可以生成多个分层阴影,提供非常酷的效果,你也可以自定义颜色。

  1. CSS Clip-path Maker

官方网站https://bennettfeely.com/clippy/
可以生成具有各种不同形状的漂亮剪辑路径,非常方便。

  1. Fancy Border Shape Generator

官方网站https://9elements.github.io/fancy-border-radius/
通过操纵border-radius生成各种形状,并且可以在项目的任何地方使用。你还可以更改形状的大小,以便根据项目偏好检查其外观。

  1. Cubic Curve

官方网站https://cubic-bezier.com/
基本上,它的作用是为你在css中的动画生成贝塞尔曲线(cubic-bezier)。我们知道,使用动画的ease-in、ease-out等属性可以告诉浏览器动画的流程是什么。而你则可以在这里自定义这些属性。

  1. CSS Gradient

官方网站https://cssgradient.io/
如果你经常要用到渐变,那么你一点会喜欢CSS Gradient。我已经用了很长时间,非常完美。而且你还可以在CSS Gradient上获得一些工具,比如渐变按钮等等。

  1. CSS波形生成器

7.1 CSS Waves
官方网站https://getwaves.io/
通过一些自定义生成简单的波纹。
7.2 Gradient Multiple Waves
官方网站https://www.softr.io/tools/svg-wave-generator
可以生成多个渐变波,非常棒。
7.3 Multiple Animated Waves
官方网站https://svgwave.in/
可以生成多个渐变波,但主要特点是还能生成实时动画。

  1. CSS网格生成器

8.1 CSS grid
官方网站https://cssgrid-generator.netlify.app/
可以为Grid生成很棒的css,你可以使用div对其进行自定义,它还将为此创建子元素。
8.2 CSS Grid Area
官方网站https://grid.layoutit.com/
生成Grid Area。你可以根据需要命名并自定义该区域。

  1. Loading Animated GIFs/SVGs

官方网站https://loading.io/
在这里你可以生成多个加载动画并将其下载为SVG、GIF、PNG和其他格式,但它最棒的特点是你可以将这些动画自定义到一个新的水平。值得尝试。

  1. 免费图标库

10.1 Flaticons
官方网站https://www.flaticon.com/
这个库有570+万个以上的矢量图标。所以你可以在这里找到任何可能的图标,然后使用它。
10.2 icons8
官方网站https://icons8.com/
这个库也有大量图标,你可以自定义,也可以直接使用图标而无需下载。

(文章来源:https://mp.weixin.qq.com/s/AzzPmxmdF8cQcQuU_IHSlA)

10个有用的css编辑网站相关推荐

  1. CNET选出的50个我们认为是有用或者有趣的网站

    CNET选出的50个我们认为是有用或者有趣的网站: 帮助     Wikipedia     www.wikipedia.org     一个在线的百科全书:任何人都可以编辑入口.你不仅仅可以修正文本 ...

  2. 你应该知道的25个非常有用的CSS技巧

    在我们的前端CSS编码当中,经常要设置特殊的字体效果,边框圆角等等,还要考虑兼容性的问题, CSS网页布局,说难,其实很简单.说它容易,往往有很多问题困扰着新手,在中介绍了非常多的技巧,这些小技巧与知 ...

  3. 10个顶级的CSS UI开源框架

    随着CSS3和HTML5的流行,我们的WEB页面不仅需要更人性化的设计理念,而且需要更酷的页面特效和用户体验.作为开发者,我们需要了解一些宝贵的CSS UI开源框架资源,它们可以帮助我们更快更好地实现 ...

  4. 10条有用的可用性结论和指南

    为什么80%的码农都做不了架构师?>>>    原文: 10条有用的可用性结论和指南 译自:http://www.smashingmagazine.com/2009/09/24/10 ...

  5. 10个找资源必备的网站,精准搜索,想要的全都有

    我们平时在网上搜索资源,就如同茫茫大海一般,下面我分享10个珍藏多年的资源网站,让你瞬间成为资源富人! 01*果汁排行榜(工具资源) 这是一个集合了百度.搜狗.谷歌等主流搜索引擎的导航网站,还覆盖了实 ...

  6. 设计师必备的10 个顶尖的国内外设计网站详解!

    作为一名室内设计师,痛苦的莫过于缺少灵感以及素材来源了,这次我从自己收藏的上百个设计灵感网站里,整理出10 个顶尖的国内外设计网站:Behance.Pinterest.Awwwards.CSS AWA ...

  7. CSS入门-五个简单,但有用的CSS属性

    今天说的这5个CSS属性,你可能会很熟悉,但是你可能会很少会去使用.这个教程所讲得不是关于CSS3的属性,而是依旧使用CSS2属性来说明,这些属性广泛的被各种浏览器所支持:clip,min-heigh ...

  8. Web 开发中 20 个很有用的 CSS 库

    在过去的几年中,CSS已经成为一大部分开发者和设计者的最爱,因为它提供了一系列功能和特性.每个月都有无数个围绕CSS的工具被开发者发布以简化WEB开发.像CSS 库,框架,应用这样的工具能够为开发者做 ...

  9. 【云速建站】按照给定模板从0开始编辑网站页面

    [摘要] 本文以一个示例网站为模板,用云速建站从0开始一步步编辑网站页面内容. 1      示例网站 这次已示例网站为模板,从零开始编辑建设网页 示例网站地址:http://security-456 ...

最新文章

  1. Python开发植物大战僵尸游戏(附github项目地址)
  2. 6 js 比较两个数组的差异_每天一道算法题(js)(3)——寻找两个有序数组的中位数...
  3. datetime 取分钟_datetime-Javascript,时间和日期:获取给定毫秒值的当前分钟,小时,天,周,月,年...
  4. 2017年度最值得读的AI论文评选 | 大张旗鼓送福利
  5. java excel 字体大小_Java将数据按列写入Excel并设置格式(字体、背景色、自动列宽、对齐方式等)...
  6. 可应用于实际的14个NLP突破性研究成果(三)
  7. easyui tree动态加载_动态路由:Gin vs SpringMVC
  8. PHP如何释放内存之unset销毁变量并释放内存详解
  9. 10A 的GROUP和CUI使用
  10. 【C++入门】C++类和对象
  11. Gradle简单使用
  12. iOS开发之UIControlEventEditingChanged失效
  13. Postman汉化补丁
  14. 全球IP将告罄,美国已摇号限购
  15. npm install报错10054,Error while executing
  16. 如何解决 U盘 文件变成.exe文件
  17. 解决Win2016提示 “发生身份验证错误 要求的函数不受支持“的问题
  18. Linux——详解进程控制之终止
  19. QQ无法访问个人文件夹,修复失败问题
  20. 直播平台软件开发中选择点播播放器哪家强?

热门文章

  1. 分析中国潮流文化展览会的目标市场
  2. cocos2.x 小游戏Scrollview滚动视图 控制滚动的方法
  3. 网易笔试 android,网易android笔试题目
  4. JQuary中的FullPage属性的用法
  5. 使用Git 本地代码提交到 GitHub
  6. 源代码管理工具 SVN
  7. 20200521,看到Java的爱情我羡慕了...
  8. 网络笔记(23)移动网络:去巴塞罗那,手机也上不了脸书
  9. CSS入门基础(样式,css文件,选择器)
  10. Chrome 调试技巧(二) console 篇