2 HTML元素大全-表单( 六 )


文章插图
最基本的HTML表单布局思路:

  • 小部件:用<div><p>包装一个最小的部件 , 里面包含<label>表单项标题、<input><span>提示信息 。
<div><label for="uname">姓名:</label><!-- 标签 --><input type="text" name="uname" required maxlength="20"> <!-- 表单元素 --><span title="必填">*</span><!-- 作为额外提示 , 包括输入验证错误的提示信息 --></div>
  • 表单分区 , 对于复杂的表单 , 用<fieldset>、标题<h*>、分段<section>等来分区组织不同类型的内容 。
  • 表单布局:借助CSS表格布局、Grid、Flex等工具进行布局 。
  • 第三方表单组件:实际项目中都会引入第三方UI组件库 , 组件库里都会提供更丰富的布局支持 。
?版权申明:版权所有@安木夕 , 本文内容仅供学习 , 欢迎指正、交流 , 转载请注明出处!

经验总结扩展阅读