美文网首页饥人谷技术博客
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的使用)

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

  • HTML-语义化

    语义化 解释它的概念前,应该首先了解“结构 - 绩效 - 行为”是什么?如果解耦是高级代码,那么“结构 - 性能行...

  • 前端之路-学习笔记(一)

    前端必须掌握的三个技能 HTML-负责网页的结构语义化。 CSS-负责网页的样式美化。 JS-负责网页的动态效果。...

  • 常用的HTML/CSS知识总结

    1. HTML语义化 1.1 语义化和非语义化对比 两段代码可以看出,使用了语义化标签可以更清晰分辨出标题、段落...

  • HTML语义化

    HTML语义化 语义化就是指要使用合理、正确的标签。如标题应该使用h1 ~ h6来表示。 语义化的好处 1. 利于...

  • HTML

    语义化 HTML标签的语义化是指:通过使用包含语义的标签(如h1-h6)恰当地表示文档结构 css命名的语义化是指...

  • 编码规范

    1.html部分 语义化 语义化标签优先,如:aside、main等标签,再兼容性允许的情况下,尽量使用语义化标签...

  • HTML 语义化

    如何说 html 语义化 和为什么要语义化? 因为 html 本身是标记语言,使用语义化是便于代码理解 为了在 c...

  • 前端面试题总结

    HTML 1、你是如何理解web语义化的? Web语义化是指使用恰当语义的html标签、class类名等内容,让页...

  • html语义化

    参考:HTML编码规范html语义化标签探析 html语义化 根据html元素用途来使用它们。减少盲目过多使用di...

网友评论

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

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