在线html代码生成器,支持网页快速排版 CSS代码一键生成的在线设计工具

在线html代码生成器,支持网页快速排版 CSS代码一键生成的在线设计工具用户体验现在作为很多工作的重中之重,设计师们更要把用户体验放在第一位,如果你曾经尝试过想把你的板面调整到最适合阅读的状态,就会知道多么令人抓狂。但是懒人总是会创造出新科技,国外开发者为我们带来了今天要讲的协助设计网页排版及字型等相关属性的便利工具。typeanything前段时间登上国外媒体网站后深获好评,这是一项非常方便的在线工具,功能设计很简单,主要提供一段文章模板(里头包含h1、h2…

大家好,又见面了,我是你们的朋友全栈君。

用户体验现在作为很多工作的重中之重,设计师们更要把用户体验放在第一位,如果你曾经尝试过想把你的板面调整到最适合阅读的状态,就会知道多么令人抓狂。但是懒人总是会创造出新科技,国外开发者为我们带来了今天要讲的协助设计网页排版及字型等相关属性的便利工具

type anything 前段时间登上国外媒体网站后深获好评,这是一项非常方便的在线工具,功能设计很简单,主要提供一段文章模板(里头包含 h1、h2 标题和文字),用户透过快速按钮来切换字型、文字大小、行高、字重、边缘等相关属性,预览效果。

当调整到你觉得最舒服的排版后,一键将 css 程序代码输出就能套用至自己网站。

step 1

开启 type anything 后,左侧是调整工具,右侧为默认的文章模板,你也可以把自己的文章复制贴上,透过这项在线服务来进行排版调整,从网页浏览器上实时看到效果。

01c6aa5dc5724f8fe0dab7ef28ae6323.png

step 2

它跟一般的文本编辑器有点相似,选取文字段落后可将它切换为 h1、h2 或 h3 标题,或加入粗体、斜体及底线效果,在设定完标题及内文位置后,利用左侧来进行样式编辑。

3e19fbf26d9f998211ac3e2ce23e4a7e.png

step 3

type anything 能切换调整不同的字型组合,输入字型名称就能实时搜寻 google fonts 里收录的免费字型,不过这里目前还无法使用中文字型,因此你可以先选择任一字型,最后导出 css 后再进行细部修改。提供免费的中文网页字型服务包括:

1a071dad7305c2d00a565c44f060dcff.png

step 4

从 type anything 左侧工具栏来进行排版的细节调整,包括字号、字重、行高、透明杜、顶部距离、底部距离、字距和全部显示为大写小写等设定值。

1456dba54a744060d6891dcdf62deb5f.png

最后,点选右上角的「get the code」就会产生刚才的排版 css 样式表单,之后应该知道该怎么做了吧?此外,type anything 会加载由 google fonts 提供的网页字型,若你是使用中文字型,可以将它做适当调整。

f380b629b241376a48aaa666852b723e.png

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/143598.html原文链接:https://javaforall.net

(0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • python之路

    python之路

    2021年9月15日
    86
  • Web安全 支付逻辑漏洞(不用钱 买任何东西.(也能让商家倒贴钱给我们.))

    Web安全 支付逻辑漏洞(不用钱 买任何东西.(也能让商家倒贴钱给我们.))?我们购买东西正常情况下都是要钱的,如果说平台出现了(支付逻辑漏洞.)那么我们就可以,利用这个漏洞实现不用钱买任何东西,???或者是商家倒贴钱给我们来购买他的东西.(这不学起来吗?)

    2022年6月2日
    27
  • 3.RT-thread 项目实战–LED驱动及finsh组件调试

    3.RT-thread 项目实战–LED驱动及finsh组件调试RT-thread在19年12月份推出了一个很好用的工具RT-threadstdio,比Env更加的方便,接下来的代码开发我们就使用这个工具进行,不使用keil和IAR了。工具的一些配置和入门使用直接看官方的教学视频就可以了,这里我们不做过多的介绍,下面开始进入今天的正题。打开我们的软件后,点击文件–》新建–》RT-thread项目,然后取个项目名字,就叫temp_prj吧,然…

    2022年5月21日
    39
  • 学习Spring框架这一篇就够了

    学习Spring框架这一篇就够了1.spring概述1.1Spring是什么(理解)Spring是分层的JavaSE/EE应用full-stack轻量级开源框架,以IoC(InverseOfControl:反转控制)和AOP(AspectOrientedProgramming:面向切面编程)为内核。提供了展现层SpringMVC和持久层SpringJDBCTemplate以及业务层事务管理等众多的企业级应用技术,还能整合开源世界众多著名的第三方框架和类库,逐渐成为使用最多的JavaEE企业应用

    2022年6月30日
    22
  • 计算机二级考试python考试大纲

    计算机二级考试python考试大纲全国计算机等级考试二级Python语言程序设计考试大纲(2018年版)基本要求1.掌握Python语言的基本语法规则。2.掌握不少于2个基本的Python标准库。3.掌握不少于2个Python第三方库,掌握获取并安装第三方库的方法。4.能够阅读和分析Python程序。5.熟练使用IDLE开发环境,能够将脚本程序转变为可执行程序。6.了解Python计算生态在以下方面(不限于)的主要第三方库名称:网络爬虫、数据分析、数据可视化、机器学习、Web开发等。考试内容一、Python语言基本语法元

    2022年10月19日
    1
  • 【HDU2865】构造矩阵+Burnside定理+欧拉函数类似poj2888[通俗易懂]

    【HDU2865】构造矩阵+Burnside定理+欧拉函数类似poj2888[通俗易懂]BirthdayToyTimeLimit:2000/1000MS(Java/Others)    MemoryLimit:32768/32768K(Java/Others)TotalSubmission(s):466    AcceptedSubmission(s):238ProblemDescriptionAekdyCoinloves

    2022年7月23日
    5

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号