HTML的一些标签以及表单
HTML的一些标签以及表单
图片标签
属性 | 说明 |
|---|---|
src | 图像的路径 |
alt | 图像不能显示时的替换文字 |
title | 鼠标悬停时显示的内容 |
border | 设置图像边框的宽度 |
align | 对齐方式 |
相对路径
相对路径分类 | 符号 | 说明 |
|---|---|---|
同一级路径 | 图像文件位于HTML文件同一级 <img src="baidu.gif"/> | |
下一级路径 | / | 图像文件位于HTML文件下一级 <img src="images/baidu.gif"/> |
上一级路径 | …/ | 图像文件位于HTML文件上一级 <img src="../baidu.gif"/> |
超链接
属性 | 作用 |
|---|---|
target | 用于指定链接页面的打开方式，-self是默认值，_blank为在新窗口的打开方式 |
锚点链接
通过给内容中特定位置加id值来标记位置，然后用<a href="#id名">来实现位置的跳转
表格的基本语法
属性 | 说明 |
|---|---|
<table> </table> | 定义表格的标签 |
<tr> </tr> | 定义表格的行，嵌套在table标签中 |
<td> </td> | 定义表格的单元格，嵌套在tr标签中 |
<th> </th> | 定义表头部分，可以使单元格里的内容加粗居中 |
cellspacing | 单元格之间的空白位置的大小，就是表格线的宽度 |
cellpadding | 单元边沿与其内容之间的空白，就是内容与表格线的距离 |
<table border="1" cellspacing="0" cellpadding="4">
<tr> <th>球员</th> <th>薪资</th> <th>年龄</th> </tr>
<tr> <td>salah</td> <td>2亿欧元</td> <td>28岁</td> </tr>
<tr> <td>salah</td> <td>2亿欧元</td> <td>28岁</td> </tr>
</table>合并单元格
- 跨行合并：
rowspan="合并单元格的个数" - 跨列合并：
colspan="合并单元格的个数"
三部曲
- 先确定跨行还是跨列
- 把合并代码写在目标单元格内（跨行就写在最上侧的单元格，跨列就写在最左侧的单元格）
- 删除多余的单元格
列表
属性 | 说明 |
|---|---|
ul元素 | 无序列表，没有层级，都是并列的，列表项前会有点 |
li | 嵌套在ul，ol里面的列表项 |
ol元素 | 有序列表，会有顺序，1，2，3， |
start | 加在ol里面，可以设置编号的起始值<ol start="2"> |
dl元素 | 自定义列表，列表项前什么都没有，dt，dd |
表单
form：用来定义表单域，就是创建表单
<form action="网址" method="提交方式" name ="表单名称">input 标签中的type属性
- 单行文本输入框
<input type="text"/> - 密码输入框
<input type="password"/>,输入的内容用圆点显示 - 单选按钮
<input type="radio"/>，几个选项添加相同name值后，可以单选（小圆圈） - 复选框
<input type="checkbox"/>常用于多选（小正方形） - 普通按钮
<input type="button"/> - 提交按钮
<input type="submit"/> - 重置按钮
<input type="reset"/>
input 中的其他标签
属性 | 说明 |
|---|---|
value | 规定input控件的默认文本值 |
maxlength | 规定输入字段中的最大长度 |
checked | 首次加载就被选中，就是默认选中 |
textarea元素：创建多行文本框
<textarea cols="每行中的字符数" rows="显示的行数"></textarea>select元素：创建下拉菜单
<select>
<option>选项1</option>
<option>选项2</option>
<opyion>选项3</opyion>
...
</select>在option中可以添加selected="selected"来设置默认选项
本文参与 腾讯云自媒体同步曝光计划，分享自作者个人站点/博客。
原始发表：2020/12/16 ，如有侵权请联系 cloudcommunity@tencent.com 删除
评论
登录后参与评论
推荐阅读
腾讯云开发者
