HTML常用标签总结

HTML常用的标签

在讲HTML常用标签之前,我们先认识下HTML。

HTML,超文本标记语言(英语:HyperText Markup Language,简称:HTML)是一种用于创建网页的标准标记语言。

您可以使用 HTML 来建立自己的 WEB 站点,HTML 运行在浏览器上,由浏览器来解析。

<!DOCTYPE> 声明必须是 HTML 文档的第一行,位于html标签之前。<!DOCTYPE>是指示 web 浏览器关于页面使用哪个 HTML 版本进行编写的指令,有助于浏览器中正确显示网页。其它声明方式及最新html标准可以通过以下链接学习:
HTML简介:http://www.runoob.com/html/html-intro.html
HTML标准:https://www.w3.org/TR/html51/
MDN:https://developer.mozilla.org/zh-CN/

HTML常有标签基本用法

1. iframe 标签 (嵌套页面)

  • frameborder=0 用来消除很丑的边框
  • name属性基本要和a标签一起,不是没什么用,name=xxx 指定a标签的跳转窗口
  • src=source 一般接网址,也可以是一个相对路径

2. a标签 (跳转页面HTTP GET请求)

  • target 四个值

<a href="" target="_blank"></a>   空
<a href="" target="_self"></a>    自己
<a href="" target="_parent"></a>  父级
<a href="" target="_top"></a>     顶层
target的值可以为 iframe name的值
  • download属性

一个网页可以用浏览器查看,也可以下载,确定条件:
根据html响应的Content-Type for download
a标签可以download指定强制下载

<a href="" download </a>
  • href值:

  1. 无协议绝对路径,根据当前文件协议决定
<a href="//.qq.com"></a>
  1. 锚点,#xxx
<a href="#xxx"></a>
  1. 查询字符串 ?name=xxx
<a href="?name=xxx"></a>
  1. JavaScript
JavaScript:alert(1);   会直接执行
JavaScript:;     点击标签不会跳转,无反应

3. form标签:跳转页面(HTTP POST 请求)

  • form表单内必须要有input“提交”按钮,否则就无法提交这个form,除非你用JS
  • form标签主要是用来发起一个post请求
  • input的name最终会带到请求的第四部分/post
  • file协议不支持post
  • get会把input内的参数放到查询参数中
  • post默认会把input的参数放到请求的第四部分
  • post可以通过修改action的值来添加查询参数
  • form标签也有target与a标签一样

4. input/button

  • 如果form内的button没有type会自动升级为提交按钮
  • 如果写有type则会响应这个type响应的事情
  • 理论上label要写for 和id 但是可以用label包input的方法省略
  • checkbox是复选框,要将同属同一个类别name给同一个名字
  • radio单选框圆点 要将同类别的name给同一个名字
  • posswword是用来输入密码的,实际是在请求/响应里为明文
  • input与button的区别:input是没有子元素的

5.table

  • HTML规定table内只能有三个元素:<thead><tbody><tfoot>
  • th/td的区别:th用作表头,td用作数据
  • colgroup 控制表格内每列的宽度、bgcolor
  • table内的元素顺序会被浏览器自动排序,如果浏览器分辨不出table 的顺序,则会按代码顺序
  • table的border的默认是有空隙的,可用border-collapse:collapse;取消
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 204,921评论 6 478
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 87,635评论 2 381
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 151,393评论 0 338
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 54,836评论 1 277
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 63,833评论 5 368
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,685评论 1 281
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 38,043评论 3 399
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,694评论 0 258
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 42,671评论 1 300
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,670评论 2 321
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,779评论 1 332
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,424评论 4 321
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 39,027评论 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,984评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,214评论 1 260
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 45,108评论 2 351
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,517评论 2 343