HTML中的标签

本文详细介绍了HTML中的超链接、锚点、列表(包括有序列表、无序列表和自定义列表)以及表单元素(如输入框、按钮、文本域、下拉框等)的使用方法,涵盖了form表单的action、target、method属性以及HTML的全局属性和CSS/JavaScript的应用。
摘要由CSDN通过智能技术生成

1.跳转超链接:

<a href="https://miaosha.jd.com/" target="_self">去秒杀</a>


<a></a>双页签,属于行内元素
 href:跳转到具体的位置
target:跳转时如何打开页面
_self:在本页签中打开
_blank:在新页签中打开
注意:代码中的多个空格或回车都会解析为一个空格
跳转到锚点:
<1.设置锚点,跳转锚点
(1).第一种方式

<a href="#diloireba">看美女</a>
<a name="dilireba"></a>


(2).第二种方式

<a href="#diloireba">看美女</a>
<h2 id="dilireba"></h2>


具有href的a标签是超链接,具有name属性的a标签是锚点
name和id是区分大小写的,且id最好是别以数字开头
唤起限定应用

<a href="tel:">电话联系</a>
<a href="mailto:">邮件联系</a>
<a href="sms:">短信联系</a>


超文本:是一种组织信息方式,通过超链接将不同空间的文字,图片,等各种信息组织在一起,能从当前阅读的内容,跳转到超链接所指向的内容.
2.列表:
有序列表(Ordered list)<ol>
无序列表(Unordered list)<ul>
自定义列表(Definition LIst)<dl>
<li></li>最好不要单独使用,最好写在<ul><ol>中
<dt></dt>中写的是术语名称
<dd></dd>中写的是术语描述
表格(table)的组成:
表格标题(caption)
表格头部(thead)行<st>单元格<th>
表格主题(tbody)行<tr>单元格<td>
表格脚注(tfood) 行<tr>单元格<td>
加边框<table border="1">这个"1"的单位是像素px “”里的数字改变只能改变表格最外侧边框,无法调节表格内部边框,css可以
边框与边框的距离cellspacing:0
align
<align="right/left/center">字体向右靠/向左靠/居中对齐
<valign="top/middle/bottom">
表单(form):
输入框<input type="text" name="wd">

type:设置输入框的类型 text表示普通文本 name表示提交数据 的名字
按钮<button>搜索</button>
method有表单提交有get和post方式
 action:用于指定表单的提交地址
target:
用于表单提交后,如何打开页面
_self:在本窗口打开
_blank:在新窗口打开

账户:<input type="text" name="account" value="wxy" maxlength="10"><br>


文本输入框
name :数据的名称
value: 输入框的默认输入值
maxlength:输入框的最大输入长度  

密码输入框:
<input type="password">
 checked是默认勾选的意思
 性别:<input type="radio" name="gender" value="male">男
                   <input type="radio" name="gender" value="female">女<br>
type为radio则为单选
 <!--隐藏框-->
            <input type="hidden" name="abc" value="123">


用处:用户不可见的一个输入区域,用处是提交表单的时候,携带一些固定的数据
设置按钮时不要用name属性
提交按钮(此时button的type默认属性是submit,button不需要指定name属性):

 <!--确认按钮的第一种写法-->
 <button type="submit">确认</button>
<!--确认按钮的第二种写法这里面的value是按钮中的文字-->
<input type="submit" value="确认">
重置按钮:
<!--重置按钮第一种写法-->
<button type="reset">重置</button>
<!--重置按钮第二种写法-->
<input type="reset" value="重置">
普通按钮(不引起表单提交和重置的按钮):
<button type="button" >检测账户是否被注册</button>


文本域:

<textarea name="place" rows="30" cols="25"></textarea>


rows:指定默认显示的行数,会影响文本域的高度
cols:指定默认显示的列数,会影响文本域的宽度
不能编写type属性,其他属性
下拉框

<select name="place">
                <option value="京">北京</option>
                <option value="豫">河南</option>
                <option value="鲁">山东</option>
                <option value="沪">上海</option>
</select>


如果设置value属性,提交的数据就是value中的数据,如果没有value属性,则提交的数据就是option的数据
selected是默认选中
disabled 禁用表单控件
点击账户就让账户获取焦点:
label标签可与表单控件相关联,关联之后点击文字,与之对应表单孔控件就会获取焦点
两种关联方式:
1.<label>表单控件</lable>
2.让label标签的for属性的值等于表单控件的id
fieldset可为表单控件分组
legend标签是分组的标题

<!--主要信息-->
            <fieldset>
                <legend>主要信息</legend>
            <label for="zhanghu">账户:</label>
            <input id="zhanghu" type="text" name="account"  maxlength="10"><br>
            
            <label for="mima">密码:</label>
            <input id="mima" type="password" name=""  maxlength="10"><br>


6.表单
form表单action:表单要提交的地址 target:跳转的新地址的打开方式_self当前页签_blank新页签 method:请求方式get post
 input:
type:指定表单控件的类型
可选值有:text,password,radio,checkbox,hidden,submit,reset,button
name:指定数据名称
value:
对于输入框:指定默认的输入的值
对于单选和复选框:实际提交的数据
对于按钮:显示按钮的文字 
disabled:禁用
maxlength:输入的最大长度
checked:默认勾选
textarea文本域:
name·:指定数据名称
cols:文本的高度
rows:文本的宽度
select下拉框:
name:指定数据名称
disabled:整个下拉框不可用
option下拉框里的选项:
如果设置value属性,提交的数据就是value中的数据,如果没有value属性,则提交的数据就是option的数据 
selected:默认选中
button:
submit(默认)提交
reset重置
边框iframe不是块元素
iframe:在网页里嵌入其他文件
name:框架名字可以与target配合使用
frameborder:是否显示边框,值:0或1
字符实体:
&nbsp;代表空格
&#160;代表空格
在文本里写类似于标签的文本的方法
例如在文本中显示<h1>
小于号&lt;h1&gt;大于号
和号:&amp;
人民币:&yen;
乘号:&times;
除号:&divide; 
HTML全局属性:
id:给标签指定唯一的标识,注意:id是不能重复的
作用:可以让label标签与表单控件相关联;也可以与css,JavaScript配合使用
不能在<head><html><script><style><title>
class:给标签指定类名,通过css设计样式
style:给标签设置css样式
dir:在<bdo></bdo>中是把字倒过来念
在<div></div>中是向左靠向右靠
不能在<head><html><script><style><title><meta>
<meta name="robots" content="fnjf"></meta>
noindex是要求搜索引擎不索引此页


5.
 

  • 23
    点赞
  • 8
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值