HTML常用标签

作者: 浮云都想对你说 | 来源:发表于2018-04-15 19:18 被阅读0次

HTML(HypeText Markup language)超文本标记语言

  • 版本历史:
    HTML 的版本(W3C 组织制定规范)
    1.HTML 4.01
    2.XHTML
    3.HTML 5(与H5没关系,可以运行在微信上的网页就叫H5)
    4.HTML 5.1(已经发布)
    HTML specifications标准文档由W3C组织编写
  • DOCTYPE
    用来选择文档类型
    html / head / body
    省略标签
    常见标签:a、form、input、button、h1、p、ul、ol、small、strong、div、span、kbd、video、audio、svg
    基本上,你知道标签对应单词的意思,就知道这个标签怎么用了(语义化)
    除了 div 和 span,其他标签都有默认样式
    html标签
    如果开始不是一个注释,开头标签可以省略
    如果结尾不是一个注释,那么结尾标签也可以省略
  • head标签
    根据协议规定,在没有内容的情况下是可以省略的
  • body标签
    只要第一个不是空格且没有注释的情况下也是可以不写的
    <a> anchor 锚点
    <form> 表单
    <input> 输入
    <buttom> 点击
    <h1>主标题
    <p>paragraph段落
    <ul>unordered list 没有顺序的列表
    <ol>ordered list 有顺序的列表
    <dl>description list 描述列表
    <dt>description term 描述词语
    <dd>定义
    <small>不重要的字
    <strong> 重要的字(有情感,逻辑)<bold>(物理状态)
    <div>divide 划分(没有任何意义的标签class)
    <span> 横向的划分(没有任何意义的标签,需要搭配class)
    <kbd> keyboard键盘
    <video> 视频
    <audio> 音频
    <svg> Scalable Vector Graphics不规则的图形
    <alt> alternative可选内容

除了 div 和 span,其他标签都有默认样式

  • a标签
    download属性:表示是用来下载
    跳转页面发起的是GET(获取)请求
  • form
    跳转页面一般发起的是POST(上传)请求
    如果form表单里面没有【提交按钮】就无法提交这个form
<form action="user" method="POST">  
<input type="text" name="username">  
<input type="password" name="password">  
<input type="submit" value="提交">  
</form>

type

  • button
    <button>button</button>如果没有type默认升级为subline
    <button type="button">button</button>没有提交作用
  • checkbox
    image.png
    设置label for与input的ID进行关联,此时点击文字就能勾选
    老司机是这样写的用labelinput包起来就可以达到和上面同样的效果
    image.png
  • radio 单选
    只能选择一个,前提是name要设定一致
  • -select 下拉列表


    image.png

    disable不可以选择,selected默认选择
    value是空 则没有值
    select中如果添加一个multiple则可以多选


    image.png
  • textarea 文本域
    一定要给一个name否则无法提交
    resize:none设置不可以被拉伸,用CSS设置宽高

table 表格

  • th(table row)表示表头 td(table data)表示信息
    colgroup中col设置每一列宽高


    image.png
  • <thead><tbody><tfoot>的顺序不影响呈现出的内容
    CSS中加入border-collapse:collapse;可以使表格之间的空隙取消
    image.png
                    <thead>
                <tr>
                    <th>姓名</th><th>学校</th><th>年级</th><th>班级</th>
                </tr>
            </thead>
            <tbody>
                <tr>
                    <th>小红</th><td>育红小学</td><td>三年级</td><td>七班</td>
                </tr>
            </tbody>
            <tfoot>
                <tr>
                    <th>小明</th><td>育红小学</td><td>三年级</td><td>八班</td>
                </tr>
            </tfoot>
        </table>
image.png

相关文章

  • html入门级常用标签

    html入门级常用标签 html的格式规范 html中常用的标签 html中常用标签有a、form、input、b...

  • HTML笔记-- 其他常用标签

    HTML笔记-- 其他常用标签 标签(空格分隔): HTML html中其他常用标签: b:加粗 s:删除线 u:...

  • HTML常用标签

    HTML常用标签 一、常用标签 1.iframe标签 标签用于嵌套页面。 常用属性 ...

  • CSS课程1

    HTML常见标签 HTML常用标签的重要属性

  • HTML常用标签总结

    HTML 常用的标签 在讲HTML常用标签之前,我们先认识下HTML。 HTML,超文本标记语言(英语:Hyper...

  • HTML常用标签总结

    HTML常用的标签 在讲HTML常用标签之前,我们先认识下HTML。 HTML,超文本标记语言(英语:HyperT...

  • 2019-08-09

    html常用标签及标签特点

  • CSS 和HTML注意事项

    目录 HTML常用标签 CSS使用规范 HTML常用标签 /可以单独或者配合ul ol标签使用/ CSS使用规范...

  • HTML标签

    HTML标签一览 这个部分就介绍一些常用标签。 那么Html标签一览就到这里... Html常用的标签就这些了,这...

  • HTML笔记-文字标签和注释标签

    HTML笔记-文字标签和注释标签 标签(空格分隔): HTML HTML中常用的标签 文字标签: 修改文字的样式 ...

网友评论

    本文标题:HTML常用标签

    本文链接:https://www.haomeiwen.com/subject/qwrvqftx.html