博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
a jquery 标签点击不跳转_html常用标签
阅读量:6359 次
发布时间:2019-06-23

本文共 1395 字,大约阅读时间需要 4 分钟。

a标签(HTTP GET(获取) 请求)

1,target 目标 _self当前 在当前窗口打开内容
2,_blank空白 在新的窗口打开内容
3,_parent 在父亲窗口打开内容 如嵌套2层 在最外面嵌套中打开
4,_top在顶层窗口打开,嵌套N层,在最外面嵌套中打开
3和4 结合ifarme标签理解
1, qq   2, qq   3, qq   4, qq

a标签下载属性

加入download下载html网页,

8da15be32cd25b6f6ecdd702c05377c6.png

a标签href属性,超链接

第一个/的意思是协议,当前页面是HTTP协议,点击链接就是HTTP协议,如果当前页面是本地file协议,点击链接就是file协议链接,1和2的写法实现效果一样

1,qq2,qq

3,href="#" 页面内跳转不发请求

3,qq

4,href里面不是#号,会发起请求,如下图

4,qq

5,href里面写js代码可以执行,写一个a标签不想它跳转可以写成 <a href="javascript:;">qq</a>这样a标签不会跳转也不会跳转到页面开头伪协议

5,qq  qq

a76eb9c5e7ededa3d8009976bb08a42a.png

48d5bca833538cfde18b5d50bc9cd5ca.png

iframe标签:

<iframe name=”xxx” src=”路径” frameborder=”0”></iframe>

<a target=”xxx”(这里引用了上面iframe的namexxx) href=”http://qq.com”>qq</a>

<a target=”xxx”(这里引用了上面iframe的namexxx) href=”http://baidu.com”>百度</a>

意思是:name:点击a链接时在iframe里打开a里面target为xxx的链接

frameborder:清除本身的边框

form(HTTP POST(上传)请求)

form加载input外层写上属性 发送请求form请求可以得到第四部分见图2 a标签也可以发生请求

cc1f62f9ddd308fd5466d4f13f132f23.png

677ea420a8bf27bb3c269dbad4c440ac.png

input标签

如果form里面buttom标签不写type值,那么button标签会当做提交按钮(submit)

3869b85d7081383a91c8589d5f643a48.png

form里面input type button 这个只是普通按钮不会当做提交按钮

403d38b4e49f102634511b648994a2ba.png

form里面input type submit 这个才是提交按钮。点击会发生post请求

32177715c1c7ea999b79eaba08979e43.png

checkbox

多选框 此时点击网页小方框会打勾勾,但是点击你好文字不会打勾,体验比较差,

f9a1afa8b4b113d899a99732bea4507f.png

a3e5d9823e340b00ed327a6e6bf1d325.png

修改代码加上lable标签写上属性,在input里添加id对应lable属性,此时点击你好文字会打上勾

87bc052f408d0f8f43a22ee40c8e735b.png

9d8caec1a5ecb2c156e30b8ed3daae22.png

还可以设置文本框,这样点击用户名,文本框会聚焦

3798c61d88a009685419da1c6ff00a1b.png

3c0af52f43b410369f73334d8a84a39e.png

优化写法,直接用label标签把input标签包裹

ef07629173d313b93b50cd6f6c06ddb7.png

input标签必须要写上name值,这样提交上去才会有保存,GET提交就到输入栏里面(不推荐)

f8e50ba7554c35df17326c98caa271dd.png

1b8d331312a31b68aa1a4cce1adcbfaa.png

7b0be5974df9ea873c40afb9fc7aca39.png

radio 单选框 n个单选框共同有1个name这样才能是单选框,没有同一个name的话就可以点很多(不推荐)

68bcf1cb8f3012ef341f512d4ecaaa1b.png

5a7b65a5ae31920cf9122f13af9b7b98.png

下拉列表

select(挑选)option(选项)disabled(失去,不能选中)selected(默认选中)

mltiple(多选,可以选中多个选项)

c36cd9f4ab680152816fbbdcf63c1e38.png

14e5e506393bceb5177f2f2eadb6af86.png

textarea

文本域,cols列 控制宽 rows行 控制高 一般用css控制宽高

506df4ba9bb202cf6e064113c7e8944d.png

e0f918b6939cdbd5acb178dbe5b4973a.png

table

ca84a6f5473acf1d2adaa44dd017192c.png

3fba39e6ed5310aa5d0ea4d8e7fdb8b6.png

加上colgroup表格列属性 col表示每一列的属性

74b2ab1ab08782076642ca39768c9de4.png

e2a690087206d1600b945d1b38b4ddfd.png

转载地址:http://kzfma.baihongyu.com/

你可能感兴趣的文章
python字符串函数
查看>>
ORM框架Hibernate (四)MyEclipse Hibernate Tool 逆向生成实体类
查看>>
去掉iphone连接电脑时会出现的弹出窗口
查看>>
【python】-- web开发之HTML
查看>>
vs2015 去除 git 源代码 绑定
查看>>
解决firefox的button按钮文字不能垂直居中
查看>>
网络协议端口号详解
查看>>
大话数据结构读后感——第一章
查看>>
各种排序
查看>>
ts 格式化日期输出
查看>>
Optional
查看>>
sed 命令编辑文本
查看>>
LRUCache 具体解释
查看>>
Activity调用isDestroyed()方法报出,java.lang.NoSuchMethodError
查看>>
使用AFNetworking第三方下载类
查看>>
fhq-treap小结
查看>>
about porting
查看>>
MySQL事务及ACID特性
查看>>
Hadoop_31_MapReduce参数优化
查看>>
linux运维常见英文报错中文翻译(菜鸟必知)
查看>>