• linkedu视频
  • 平面设计
  • 电脑入门
  • 操作系统
  • 办公应用
  • 电脑硬件
  • 动画设计
  • 3D设计
  • 网页设计
  • CAD设计
  • 影音处理
  • 数据库
  • 程序设计
  • 认证考试
  • 信息管理
  • 信息安全
菜单
linkedu.com专业计算机教程网站
  • 网页制作
  • 数据库
  • 程序设计
  • 操作系统
  • CMS教程
  • 游戏攻略
  • 脚本语言
  • 平面设计
  • 软件教程
  • 网络安全
  • 电脑知识
  • 服务器
  • 视频教程
  • html/xhtml
  • html5
  • CSS
  • XML/XSLT
  • Dreamweaver教程
  • Frontpage教程
  • 心得技巧
  • bootstrap
  • vue
  • AngularJS
  • HBuilder教程
  • css3
  • 浏览器兼容
  • div/css
  • 网页编辑器
  • axure
您的位置:首页 > 网页设计 >心得技巧 > Web设计10个在线开发工具介绍

Web设计10个在线开发工具介绍

作者:佚名 字体:[增加 减小] 来源:互联网 时间:2017-08-06

本文主要包含Web,开发工具等相关知识,佚名 希望在学习及工作中可以帮助到您

1. 在线文本生成器

BlindTextGenerator:对设计师来说,这是一个简单又好用的文本生成小工具。内含许多种字体,可设置字符的大小,数量,样式,段落的数量及对齐方式等,还可以很方便且精确地调节文本区块的大小。

详细内容:http://www.blindtextgenerator.com/lorem-ipsum

Fillerati:很有设计感和风格现代的文本生成器。

详细内容:http://www.fillerati.com/

 

2. CSS生成器

Border Radius:没有比它更简单的了。进入网站在矩形一角的输入框里输入数值,就可以生成圆角矩形的CSS代码。

详细内容:http://border-radius.com/

CSS3 Gradient Generator:超好用的CSS渐变代码生成器,也很容易上手。

详细内容:http://gradients.glrzad.com/

Ultimate CSS Gradient Generator:熟悉Photoshop的话,对这款CSS渐变代码生成器会感到很亲切,当然它的功能也很强大。

详细内容:http://www.colorzilla.com/gradient-editor/

CSS Tricks Button Maker:一个按钮CSS代码生成器,没说的,实在是太方便了!

你可以自如定义按钮大小,颜色,边界半径,渐变,背景,边界,悬停,活动状态,设置好之后点击你的按钮,就可以拷贝CSS代码了。

详细内容:http://css-tricks.com/examples/ButtonMaker/

 

3.排版工具

Baseline CSS:对于包含大量文本的网站它是一个非常得力的工具。

详细内容:http://baselinecss.com/

TypeTester:可以方便快捷地测试最佳字体排版的工具!提供三种方案对照,并有安全字体列表。当你找到了完美的设置方案,还可以获取相应的CSS。

详细内容:http://www.typetester.org/

 

4.其它工具

Favicon.cc:这是个用于生成通常出现在浏览器状态栏或浏览器标签上的小图标(用于识别一个网站)的工具。完成后只需下载.ico文件并把它拖到Web服务器根目录下即可。很快很方便。

详细内容:http://www.favicon.cc/

JSONLint:简单易用的JSON验证器。只需把代码拷贝粘贴到文本区域即可。它甚至还可以支持仅输入网址(而不是代码)的验证。

详细内容:http://www.jsonlint.com/

您可能想查找下面的文章:

  • 浅谈前端网络、JavaScript优化以及开发小技巧
  • web网页开发面试笔试必备小知识(必看)
  • Web前端开发工程师需要掌握的核心技能
  • 分享10个最新的Web前端框架(翻译)
  • 前端开发必备常用工具函数小结
  • 0.1秒的价值!浅谈Web前端页面提速问题
  • Web前端开发中找错的基本思路
  • 怎么设计响应式WEB?响应式WEB设计的优缺点
  • 设计好用、易用web应用程序的10个技巧
  • 移动设备web开发关于html的head写法

相关文章

  • 2018-08-23想给用户提供帮助?先掌握这5个层级!
  • 2018-08-23视觉实验!一个让设计师大开脑洞的好方法!
  • 2018-08-23打破以往的思考方式,才有可能成为UXD设计师
  • 2018-08-23给设计师的2018年阅读推荐书单
  • 2018-08-23UI设计师进阶教程!如何以开发的视角做设计?
  • 2018-08-23该有的视觉元素全都有,设计不好到底差在哪里?
  • 2018-08-23做好这个交互文档细节,让你和工程师的合作效率提高50%
  • 2018-12-10Fluent Design
  • 2018-08-23卡片设计、分割线、无框设计哪个好?来看高级设计师的分析!
  • 2018-08-23超全面的 App 网络相关设计总结

文章分类

  • html/xhtml
  • html5
  • CSS
  • XML/XSLT
  • Dreamweaver教程
  • Frontpage教程
  • 心得技巧
  • bootstrap
  • vue
  • AngularJS
  • HBuilder教程
  • css3
  • 浏览器兼容
  • div/css
  • 网页编辑器
  • axure

最近更新的内容

    • 未来的趋势!好的 AI 对话体验应该是怎样的?
    • 用Keep的案例,让你轻松理解交互设计师的职责
    • 实例教学!如何将极简风格的原则运用到网站设计中?
    • 为了用户!让你的UI更加安全稳妥的5种设计策略
    • 设计的套路:10个小技巧让长表单填写更省事
    • 首席设计师从 10000 个UI界面中所学到的10件事
    • 超过10亿人使用的Facebook改版了,新版的设计细节都在这儿!
    • UI实战教程!从零开始做App 系列之项目立项+预估时间篇
    • 进阶教程!如何在设计中应用经典的双钻设计模型
    • 想做大数据可视化?来看腾讯高手的实战案例!

关于我们 - 联系我们 - 免责声明 - 网站地图

©2020-2025 All Rights Reserved. linkedu.com 版权所有