java web 27 : HTML

 

标签:不带/表示开始,/在前表示结束 ,

  有些标签开始和结束之间没有内容要包裹,通常可以写成自闭标签,比如<br/>

属性:在开始标签上可以加属性,多个属性之间用空格分隔。标签上的属性值可以用单引号或者双引号括起来。

注释:被 <!--    --> 包裹的内容为注释

空格:英文字符 &nbsp;    中文字符 &emsp;   

换行:<br/>  或使用块元素包裹

HTML中不区分大小写

**********************************************************************************************************

 

*****************************************************************************************************************

容器标签:

div/span/p  都是容器标签,用于包裹其他html内容

span:行内元素,可以和其他的行内元素显示在同一行,但是不能设置宽高

div/p:块元素,可以设置宽高,但不能和其他元素显示同一行,默认独占一行

p 元素表示段落,默认带有段间距,通常用于包裹文章中的某一段

*****************************************************************************************************************

图片标签:<img src="相对路径"/>

超链接标签:<a href="https://www.baidu.com">百度</a>    默认为target="_balnk"

保留之前的窗口并新开一个窗口:<a href="https://www.baidu.com" target="_blank">百度</a>   

 

 

 *********************************************************************************************************************************************

表格标签

 

rowspan的用法:

 

 

 

 *********************************************************************************************************************************************

表单标签

 1 <!DOCTYPE html>
 2 <html>
 3     <head>
 4         <meta charset="utf-8">
 5         <title>注册页面</title>
 6     </head>
 7     <body>
 8         <h1 align="center">欢迎注册</h1>
 9         <!-- 表单标签 -->
10         <form action="#" method="" >
11             <table border="1px"  cellspacing="0" 
12             cellpadding="5px" bordercolor="black"
13              bgcolor="lightgray" align="center">
14                 <tr><!-- 用户名 -->
15                     <td align="center">用户名</td>
16                     <td><input type="text" name="username" /></td>
17                 </tr>
18                 <tr>
19                     <td align="center">密码</td>
20                     <td><input type="password" name="password"/></td>
21                 </tr>
22                 <tr>
23                     <td align="center" >性别</td>
24                     <td >
25                         <input type="radio" name="gender" value="male"/>26                         <input type="radio" name="gender" value="female"/>27                     </td>
28                 </tr>
29                 <tr>
30                     <td align="center" >爱好</td>
31                     <td>
32                         <input type="checkbox" name="basketball" />篮球
33                         <input type="checkbox" name="football" />足球
34                         <input type="checkbox" name="badminton" />羽毛球
35                     </td>
36                 </tr>
37                 <tr>
38                     <td align="center">城市</td>
39                     <td>
40                         <select name="city">
41                             <option value="beijing">北京</option>
42                             <option value="shanghai">上海</option>
43                             <option value="guangzhou">广州</option>
44                             <option value="shenzhen" >深圳</option>
45                         </select>
46                     </td>
47                 </tr>
48                 <tr>
49                     <td align="center">自我描述</td>
50                     <td>
51                         <textarea rows="5" cols="30" 
52                         placeholder="请输入描述信息..." name="description"></textarea>
53                     </td>
54                 </tr>
55                 <tr>
56                     <td colspan="2" align="center" >
57                         <input type="submit" value="提交" name/>
58                     </td>
59                 </tr>
60                 
61             </table>
62         </form>
63     </body>
64 </html>

为input 和select 选项添加name属性,才能向服务器提交数据

将单选选项赋同一个name 值实现单选提交

单选框和复选框添加 checked="checked"默认选中

下拉选项添加selected="selected" 默认选中

 

posted @ 2020-07-28 15:55  Saturn5  阅读(29)  评论(0)    收藏  举报