HTML常用标签基础1

目录

1.标题标签

2.水平分割线标签

3.段落标签

4.文本标签

5.列表标签 

6.表格标签 ​

7.表单标签

8.超链接标签

9.空格

---

1.标题标签

 <Hn align="对齐方式">标题文字</Hn>                 n = 1、2、3、4、5、6 取1字体最大
         align:设置水平对齐方式，默认靠左对齐，center居中对齐,right靠右          自动换行

2.水平分割线标签<hr>

<hr size="8" width="500" align="center" color="red"> 
            size：  设置高度（粗细），默认为2px(像素)
            width：设置长度，数值可以取像素px和百分比
            align： 设置对齐方式，取值left | right | center,默认center。
            color： 设置颜色    

3.段落标签<p>

<p align="center">段落标签</p>
            被P标签包含的文字是个段落，自动换行
            align:设置水平对齐方式，默认靠左对齐，center居中对齐,right靠右

4.文本标签<font>

<font color="red" size="5" face="黑体">文本属性标签</font>
            size：  设置字体大小，取值1-7，默认取值3
            face：  设置字体，例如：黑体，宋体

5.列表标签 

<!--有序列表-->
<ol type="A">
		<li>1221</li>
		<li>123</li>
		<li>546</li>
	</ol>
<!--无序列表-->
<ul type="circle">
		<li>1221</li>
		<li>123</li>
		<li>546</li>
​​​​

 

6.表格标签<table>

<table cellspacing="1px" border="10px" width="300px" height="300px" bgcolor="yellow">
			<tr align="center" valign="middle" >
				<td width="33.3%">11111</td>
				<td width="33.4%">222</td>
				<td width="33.3%">333</td>2
			</tr>
			<tr>
				<td>444</td>
				<td rowspan="2" colspan="2">555</td>
			</tr>
			<tr>
				<td>666</td>
			</tr>
		</table>

 

注意：表格中的数据必须放在td标签中
            table:代表整个表格 tr:代表行 td:代表单元格
             rowspan合并单元格的行，colspan合并单元格的列
            table:
                border:控制整个表格的边框线 px
                widht:宽度
                height：高度
                bgcolor:背景颜色
                cellspacing:控制表格中单元格于单元格之间的间隙 px
            
            tr:
                align:控制行中的数据水平对其方式 
                valign:控制行中的数据垂直对其方式 middle中部对齐  bottom底部对齐 top顶端对齐
                height:控制一行中的高度
            td:
                align:控制单元格中的数据水平对其方式 
                valign:控制单元格中的数据垂直对其方式 middle bottom top
                height:控制当前单元格的高度
                width:控制当前单元格的宽度 

7.表单标签<form>

<form>
		账户:<input type="text" name="username" id="username" value="aaa"  maxlength="4" size="4"/><br/>
		密码:<input type="password" name="password" placeholder="请输入账号"/><br/>
		文件上传:<input type="file" name="file"/><br/>
		性别:<input type="radio" name="sex" value="man"  checked="checked"/>男
			<input type="radio" name="sex" value="woman" />女<br/>
		爱好:<input type="checkbox" name="happy" id="happy" value="sleep" />睡觉
			<input type="checkbox" name="happy" id="happy" value="eat" />吃饭
			<input type="checkbox" name="happy" id="happy" value="game" />打游戏
			<br />
		民族:<select  name="mz">
					<option value="">汉族</option>
					<option value="">白族</option>
					<option value="">傣族</option>
			</select>
			<br />
		<input type="submit" value="确定" />
		<input type="reset" value="重置" />
		<input type="button" value="普通" />
		<br />
</form>

 作用：用于向服务器发送传递数据
 格式： 注意：所有相关的表单标签都最好放在form标签中
                <form action="提交服务器地址" method="get/post">
                    <input type="声明当前表单类型" name="名字"  value="初始化默认值" maxlength="最大长度" placeholder="提示" autocomplete="off"不保留历史输入 />    
                                type="hidden"隐藏域    disabled="disabled"禁用表单不允许输入
                </form>
        文本输入框：text    
        密码输入框：password    
        提交按钮：submit
        重置按钮：reset
        普通按钮：button
        文件上传：file
        图片按钮：image
        单选按钮：radio
        复选框：checkbox

8.超链接标签<a>

锚链接：跳转页面指定位置

1. 设置锚位置<a name="name"></a>

      2.使用锚链接<a href="#name"></a>

9.空格