HTML介绍与入门

最新推荐文章于 2024-04-16 09:46:31 发布

世欢x

最新推荐文章于 2024-04-16 09:46:31 发布

阅读量588

点赞数 1

文章标签： html servlet java

本文链接：https://blog.csdn.net/x997997/article/details/126839767

版权

本文详细介绍了HTML的基本结构和常用标签，包括头部、标题、段落、超链接、表格、表单元素如文本框、密码框、按钮、下拉菜单等，以及表格的属性和样式设置。同时，讲解了表单在收集用户信息中的作用，各种输入类型的属性及用法，并展示了如何创建和使用表格。

摘要由CSDN通过智能技术生成

1.HTML创建

1.html结构：包括head body

2.html标签是以尖括号包围的关键字

3.html标签通常是成对出现的，有开始就有结束，包含成对标签、独立标签

4.html通常都有属性，格式:属性名＝“属性值”(多个属性之间空格隔开)

5.html标签不区分大小写, 建议小写

HTML标签

1. 注释标签

2.<a></a> 超链接标签

3.<b></b> 加粗标签

4.<br> 换行标签

6.<button> 按钮标签

7.<caption> 表格标题标签

8.<div> 盒子标签

9.<font> 字体标签

10.<form> 表单标签

11.<h1> 到 <h6> 标题标签

12.<head> 头部标签

13.<hr> 水平线标签

14.<input> 输入标签

15.<label> 用于标记

17.<ol> 有序列表标签

18.<p> 段落标签

19.<select> 下拉菜单标签

20.<ul> 无序列表标签

表单

1.表单的作用：
   通过浏览器收集用户信息
2.表单标签：
   <form> </form>
输入标签：
   <input>
3.文本框
   <input type="text">
   属性：
       value="默认值"
       placeholder="提示值"
       minlength="允许输入的最小值"
       maxlength="允许输入的最大值"
       size="文本框长度"
4.密码框
   <input type="password">
   属性：同文本框
5.单选框
   <input type="radio">
   属性：
       name="组名"
       value="提交给后台的值"
       checked   默认选中
6.复选框
   <input type="checkbox">
   属性：同单选框

7.文件上传
   <input type="file">
8.日期
   <input type="date">

9.按钮:普通按钮、提交、重置
   <input type="button / submit / reset">

10.文本域
   <textarea></textarea>
   属性：
       cols=""   行数
       rows=""   列数
11.下拉菜单
   <select>
       <option>选项</option>
   </select>
   属性：
       select的属性：
           size=""   显示的个数
       option的属性：
           value="给数据库的值"
           selected   默认选中

表格

1.表格的基本结构
   格式：
       <table>
           <tr>
               <td></td>
           </tr>
       </table>
   属性：
       border=" px"   边框
       width=" px"   宽度
       height=" px"   高度
       cellspacing=" px"   单元格间距（单元格单元格之间的距离）
       cellpadding=" px"   单元格边距（单元格中文字与边框之间的距离）
       align="left/center/right"       水平对齐方式="左、中、右"
       bordercolor=""   边框颜色
       bgcolor=""   背景颜色
       background=""   背景图片

2.表头单元格：
   <th></th>
3.单元格/列（td）的属性
   width=" px"   宽度
   height=" px"   高度
   align="left/center/right"       水平对齐方式="左、中、右"
   valign="top/middle/bottom"       垂直对齐方式="上、中、下"
   bgcolor=""   背景颜色
   background=""   背景图片
   colspan=""   水平/左右合并/跨列合并   kao死pan
   rowspan=""   垂直/上下合并/跨行合并   揉死pan
4.行（tr）的属性
   height=" px"   高度
   align="left/center/right"       水平对齐方式="左、中、右"
   valign="top/middle/bottom"       垂直对齐方式="上、中、下"
   bgcolor=""   背景颜色
   background=""   背景图片