美文网首页饥人谷技术博客
HTML-语义化-(iframe-a-form的使用)

HTML-语义化-(iframe-a-form的使用)

作者: 饥人谷_黄洪涛 | 来源:发表于2018-03-18 15:35 被阅读1次

    语义化

    参考资料:
    semantic-html
    关于语义化 HTML 以及前端架构的一点思考
    如何理解 web 语义化

    语义化的含义就是用正确的标签做正确的事情,html语义化就是让页面的内容结构化,便于对浏览器、搜索引擎解析;在没有样式CCS情况下也以一种文档格式显示,并且是容易阅读的。搜索引擎的爬虫依赖于标记来确定上下文和各个关键字的权重,利于 SEO。使阅读源代码的人对网站更容易将网站分块,便于阅读维护理解。

    列举几个常见的标签:
    标题从大到小: h1 , h2 , h3 , h4 , h5 , h6
    超链接: a
    段落: p
    无序列表: ul>li
    有序列表: ol>li
    自定义列表: dl>{dt , dd}
    <header>
    <main>
    <section>
    <footer>
    <article>

    a标签

    作用

    跳转页面。 发起 HTTP GET 请求

    target 属性

    • _blank 在新页面打开网页
    • _self 在当前页面打开网页
    • _parent 在父页面打开网页 , 这种要在当前页面被嵌套在一个iframe网页中容易体现出来
    • _top 在最外围页面打开网页 , 这种要在当前页面被嵌套在多个iframe网页中容易体现出来

    download

    • 表示下载href所对应的网页

    iframe标签

    默认宽高为300 * 150大小

    作用

    • 可以在一个网页嵌套一个网页
      例如:
      image

    与 a标签

    看图:

    image
    <iframe name=xxx src="http://baidu.com" frameborder="0"></iframe>
        <a href="http://qq.com" target="xxx">QQ</a>
        <p>我是iframe外面的P标签</p>
    

    QQ为 a 标签链接 ,它的target 属性等于 xxx,点击QQ 就会在iframe 中打开qq.com的网页
    iframe 标签中本来打开的网页时baidu.com ,iframe 有一个属性时namename属性等于 a标签的target属性的值,所以点击a标签的时候就会在iframe中打开a标签中的URL。

    form标签

    跳转页面。 发起 HTTP POST 请求
    常用属性

    • action : 规定当提交表单时向何处发送表单数据。值为:URL
    • method : 规定用于发送表单数据的 HTTP 方法。值只能是: GET 或 POST请求
    • target : 规定在何处打开 action URL。值为:
      i. _blank
      ii. _self
      iii. _parent
      iv. _top
      和 标签是一样的。
    • <form> 元素包含一个或多个如下的表单元素: ```<input>
      <textarea>
      <button>
      <select>
      <option>
      <optgroup>
      <fieldset>
      <label>
    
    ### input标签
    type属性:
     1. text: 简单文本输入
     2. password: 加密文本输入
     3. radio: 单选框 ,相同的name ,为一组单选框
     4. chekbox: 复选框 , 相同的name ,为一组复选框
     5. reset: 重置按钮 ,value为按钮名字,重置之前所有的输入
     6. submit:提交按钮 ,value为按钮名字 ,将输入的内容提交至 form 标签的 action属性对应的URL中
     7. button: 普通按钮 ,value为按钮名字
    - 注意: 要想输入的内容能提交 , 需要加一个name属性
    
    require属性: 加了这个属性就表示,输入框中必须有输入
    
    lable : lable for id , lable标签for 中值  ,对应lable想关联的标签的id 值。
    
    textarea: 文本输入框
    
    select : 下拉菜单 , option为选项

    相关文章

      网友评论

        本文标题:HTML-语义化-(iframe-a-form的使用)

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