HTML标签hello-segmentfault

21次阅读

共计 1687 个字符,预计需要花费 5 分钟才能阅读完成。

let’s code -HTML 标签 篇


简介一些基础常用的 html 标签

HTML 标签是由尖括号包围的关键词,比如 <html>
HTML 标签通常是成对出现的,比如 <b> 和 </b>

通用声明

HTML5 声明
<!DOCTYPE html>

常用标签介绍

  • head,link,meta,style,title
  • h1~h6, p, article, main, nav…
  • div,iframe,a,form…

head

 规定文档相关的配置信息(元数据),包括文档的标题,引用的文档样式
和脚本等 

link

 规定了当前文档与外部资源的关系。该元素最常用于链接 [样式表]
(https://developer.mozilla.org/zh-CN/docs/Glossary/CSS),此外也可以被用来创建站点图标 ( 比如 PC 端的“favicon”图标和移动设备
上用以显示在主屏幕的图标 )。

meta

 表示那些不能由其它 HTML 元相关元素 (<base>, <link>, 
<script>, <style> 或 <title>) 之一表示的任何元数据
信息.

style

 包含文档的样式信息或者文档的部分内容。默认情况下,该
标签的样式信息通常是 CSS 的格式。

title

 定义文档的标题,显示在浏览器的标题栏或标签页上。它只
可以包含文本,若是包含有标签,则包含的任何标签都不会
被解释。

h1~h6, p, article, main, nav

 内容分区元素,h1~h6 主要用于文章标题,p 用于包裹段落,article 用与包裹文章,main 包裹页面的主体,nav 常用于
包裹目录或者链接的索引 

div

 作为容器使用,不代表任何特定内容,很适合用来对元素进
行分组,<div class = 'one'> 常用 class 进行分类控制 

iframe

 页面内套用页面
<iframe src=""frameborder="0"></iframe>
    name 属性  与 a 标签结合使用
    frameborder ="0" 清除自带的边框
    默认高度 50 长度 100
    穿插 css 特性宽度可以 100% 设置 高度不能进行 100% 设置 

a

    <a target =ss href=""> 点击跳转 </a>
    target 属性:可以指定打开一个页面 _blank(空页面打开) _self(当前页面)  _parent(父级页面打开)_top(顶层页面内打开)
    download 属性:下载页面或文件
    href 属性:简单也复杂   
        特殊情况 锚点 href="#" 不会发发起请求
                    请求 href="?name= framk"   就会发起请求 参数为 framk
    javascript 伪协议 href="javascrip:;"  

form

    用来发请求标签 与 a 标签的区别  

    a get 请求  form 是 post 请求  

    如果 form 表单里面没有提交按钮 就不能提交(如果里面只有一个 button 标签,button 标签就会自动升级成提交        按钮)

input

type 属性  
    button
    text
    checkbox
        <input type="checkbox" id="option1"><label for="option1"> 香蕉 </label>
        <label ><input type="checkbox" name="fruit"  value="banana"> 香蕉 </label>
        lable 的 for 和 input 的 id 要对应    但是把 input 用 lable 包起来 就可以直接建立联系 
    理解 name 和 value 的作用
    radio
        <label ><input type="radio" name="choice" value="yes">ok</label>
        <label ><input type="radio" name="choice" value="no">no</label>
    selection
        <section name="group" multiple>
            <option value="1">1</option>
            <option value="2">2</option>
            <option value="3" disabled> 3</option>
            <option value="4" selected>4</option>
        </section>
    textarea
    table

正文完
 0