首页 > 其他分享 > 试试用Markdown来设计表单

试试用Markdown来设计表单

时间:2023-09-12 17:26:41浏览次数:61  
标签:Markdown Form 试试 表单 HTML ___ Email

相信很多后端开发。对于前端知识是比较零碎的,所以很多时候写表单这样的工作,一般就是复制黏贴,然后改改字段。对于HTML格式,一直觉得比较杂乱,不够简洁。

最近TJ发现了一个有趣的小工具:Create HTML Form

看看上面它的Slogan,是不是很有意思?居然可以通过Markdown来编写HTML的表单?下面就来一起看看这款工具的能力。

下面是官方页面给出的Markdown案例:

## Example Form

name* = ___ 
Email = ___[@] Enter Email
Password = ___[*] ***

city = {Boston, SFO -> San Francisco, (NYC -> New York City)}

size = () small (x) medium () large            

I agree to share my information with partners = ___[checkbox]

Publish on my profile = ___[switch]
User Number = ___[1-10]
Phone Number* = ___[r2002000000-9999999999]
Color = ___[color]
Date = ___[date]

Save = ___[+]

通过上面的Markdown内容,将获得如下图所示的结果内容:

其中,左边是表单的可视化结果,右边是具体的HTML代码(包括:pico.css、bootstrap、tailwindcss三种),根据自己需要选择性的复制就用就可以了。怎么样?是不是很有趣?

如果你觉得写Markdown还麻烦,也可以通过官方给出的表单库去找找是否有自己需要的,可以直接去复制黏贴:

表单库

好了,今天的分享就到这里。最后,奉上该站点地址:https://createhtmlform.com/,有需要的就冲吧~

欢迎关注公众号:TJ君,订阅每日推荐,了解更多效率工具、发现优质开源项目

欢迎关注我的公众号:程序猿DD。第一时间了解前沿行业消息、分享深度技术干货、获取优质学习资源

标签:Markdown,Form,试试,表单,HTML,___,Email
From: https://www.cnblogs.com/didispace/p/17697279.html

相关文章

  • Markdown语法
    字体Hello,World! 加粗使用**字体**Hello,World!  斜体 使用 *字体*Hello,World! 加粗斜体 使用  ***字体***Hello,World!  Hello,World!引用使用>Hello分割线使用 ---或者***图片![截图](图片地址)超链接跳转到Java学......
  • MarkDown语法
    •推荐文本编辑器:Typora•文件后缀;xxx.md •样式:     标题     字体样式     链接,列表     表格      图片      代码      。。。。。......
  • 都2023年了,别再用ifconfig啦! 试试这个吧!
    下午好,我的网工朋友。ifconfig这玩意儿,还有多少人在用?举个手看看总在说ifconfig即将被淘汰,但其实很多网工还在用吧。比如说组合使用诸如ifconfig、route、arp和netstat等命令行工具(来源于安装包net-tools)来配置网络功能,解决网络故障。net-tools起源于BSD的TCP/IP工具箱,后来成为老版......
  • Markdown学习
    Markdown学习二级标题三级标题四级标题字体Hello,World!Hello,World!Hello,World!Hello,World!引用选择狂神说java,走向人生巅峰分割线图片超链接点击跳转到狂神博客列表Adc\51表格名字性别生日张三男2000.12.15代码ddda......
  • Markdown语言学习总结(软件:Typora)
    Markdown1.标题:#+标题——一级标题##+标题——二级标题###+标题——三级标题####+标题——四级标题#####+标题——五级标题######+标题——六级标题最多到六级标题2.字体**加粗**加粗*斜体*斜体***斜体加粗***斜体加粗~~删......
  • Markdown
    Markdown学习二级标题三级标题ctrl+数字:建立数字几标题。一级标题即为ctrl+1字体helloworldhelloworldhellowordl引用大于号引用分割线分割线---图片![截图]超链接点击跳转狂神学java视频列表abcabc表格右键插入......
  • HTML5 Form表单
    Form表单使用来用户填写信息,从而能采集用户信息,使网站有交换功能,所有用户输入的地方;<!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><metaname="viewport"content="width,initial-scale=1.0"><t......
  • 提升 Markdown 文档协作:Let's Markdown介绍与部署
    在当今数字化的世界中,我们经常需要分享文本和文档。Markdown是一种流行的轻量级标记语言,用于格式化文本和创建文档。但是,有时在不同的平台和编辑器之间共享和处理Markdown文档可能会带来一些麻烦。为了解决这些问题,诞生了Let'sMarkdown。GitHub地址:https://github.com/Cveinnt......
  • 小白markdown学习记录
    Markdown学习芙卡洛斯水神芙卡洛斯美图吉祥物评价摆了很久的姿势了,就是为了让你们第一眼看到她的时候她能展现出自以为最帅气的样子--那维莱特图片列表在等芙芙审判非儿戏,与你共枕栖属性姓名属性生日芙宁娜水1.21小白代码......
  • 表单引擎的自定义控件的概念与设计
    基本概念概述控件的定义:用于展示或者采集数据的表单元素,称为控件,比如:文本框、下拉框、单选按钮、从表等.自定义控件:表单引擎提供的基础控件之外的控件称为自定义控件,这些控件由开发人员自己定义,比如:评分、公文字号、定位等.基本控件分类字段控件:文本字段、数值字段、日期字段、......