【转载】为什么html不可以编辑界面之后直接生成代码呢

最近初学web，有一个疑问，在利用vs编程的时候如果选择创建windows窗口程序，那么就可以生成一个窗口，创建并编辑元件，或者为它添加一段指向性代码，之后双击元件可以看到已经自动生成了代码，里面包含了对元件的大小、位置等信息进行定义的代码，MATLAB的gui界面也是类似的流程。那么，为什么到了html这里，就需要先手打代码然后实时预览呢？就不可以编辑完页面之后直接生成吗？
一开始以为是TCP/IP协议、http协议的原因，但是这个协议是网络传输协议，好像和代码生成的这一部分并不相关呀。那是为什么呢？难道是编译器的原因？百度一搜，真的找到了一篇博文，这篇博文提到了type anying，编辑好页面之后就会直接生成代码。ji

转载一下留个档。

 

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

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

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

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

step 1

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

step 2

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

step 3

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

step 4

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

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

原文地址：(1条消息) 一键代码生成html代码 - CSDNhttps://www.csdn.net/tags/MtTaAg0sOTg2OTQ2LWJsb2cO0O0O.html