HTML 常用标签

王振涛wzt
170 阅读3分钟

1. a 标签的用法

常用的属性：href   ;   trget  ;  download  ;  rel = noopener ;

✔ a 的 href 属性 ：

  • 网址的三种写法：

google.com ；

google.com ；

//google.com ；（最推荐）

  • 路径 ：

/a/b/c 以及 a/b/c ;

index.html 以及 ./html ;

  • 伪协议 ：
  1. javascript:代码; (javascript:alert(1); javascript:;) ;

注意 ：href="javascript:;" 不会刷新页面，任何变化都没有；href="#"会滚动页面；

  1. id ： href="#XXX" : 页面会跳转到id属性为XXX的节点；

  2. mailto:邮箱 ； （href="mailto:1052987294@qq.com"）；

  3. tel:手机号 ； （href="tel:18852673913"）;

✔ a 的 target 的取值 ：<a href="#"  target=""> ；

  1. _self :   当前页面加载，即当前的响应到同一HTML 4 frame（或HTML5浏览上下文）。此值是默认的，如果没有指定属性的话 ；
  2. _blank :   新窗口打开，即到一个新的未命名的HTML4窗口或HTML5浏览器上下文 ；
  3. _top :  在最顶级的父元素窗口打开， HTML4中：加载的响应成完整的，原来的窗口，取消所有其它frame。 HTML5中：加载响应进入顶层浏览上下文（即，浏览上下文，它是当前的一个的祖先，并且没有parent）。如果没有parent框架或者浏览上下文，此选项的行为方式相同_sel ；
  4. _parent :   在上一层的父元素窗口打开，加载响应到当前框架的HTML4父框架或当前的HTML5浏览上下文的父浏览上下文。如果没有parent框架或者浏览上下文，此选项的行为方式与 _self 相同 ； ✔ 程序员的命名 ：

  1. window 的 name :

    <a href=""  target="XXX"> 在页面为XXX的新窗口打开 ；

  2. iframe 的  name（iframe 内嵌窗口，已基本不用）

    在页面为XXX的iframe中打开 ；

2. img 标签的用法

<img src="./1.png" alt="">

  • 作用

    发出get 请求

  • 属性

  1.  alt : 当图片加载不出来时，用来替换的文本描述 ;
  2.  height/weiht : 图片的高/宽,只设置一个，两个都设置图片会变形 ；
  3.  src :  嵌入的图片的文件路径 URL ;
  • 事件
  1. onload :  onload 事件在图片加载完成后立即执行 ；
  2. onrrror :  onrror事件在图片加载失败后立即执行 ；

Image.png

  • 响应式

    max-weight : 100%;

3. table 标签的用法

常用标签 ：

  • table
  • thead
  • tbody
  • tfoot
  • th
  • tr
  • td 相关的样式 ：
  • table-layout  : (table-layout: auto;  table-layout: flex;)

  • border-collapse : (border-collapse; collapse;)

  • border-spacing : (border-spacing; 0;)

4. 其他方面

form 标签

作用

发 get或 post请求，然后刷新页面 ；

属性 

  • action :  处理表单提交的 URL。

  • autocopplete :  用于指示 input 元素是否能够拥有一个默认值

  • method :  浏览器使用这种 HTTP 方式来提交 表单. 可能的值有(此值可以被formmethod 属性覆盖)：

  1. post：指的是 HTTP POST 方法；表单数据会包含在表单体内然后发送给服务器.
  2. get：指的是 HTTP GET 方法；表单数据会附加在 action 属性的 URL 中，并以 '?' 作为分隔符，没有副作用 时使用这个方法。
  3. dialog：如果表单在  元素中，提交时关闭对话框。

target :  表示在提交表单之后，在哪里显示响应信息。在 HTML 4 中, 这是一个 frame 的名字/关键字对。在 HTML5 里，这是一个浏览上下文 的名字/关键字（如标签页、窗口或 iframe）。下述关键字有特别含义：

  1. _self：默认值。在相同浏览上下文中加载。

  2. _blank：在新的未命名的浏览上下文中加载。

  3. _parent：在当前上下文的父级浏览上下文中加载，如果没有父级，则与 _self 表现一致。

  4. _top：在最顶级的浏览上下文中（即当前上下文的一个没有父级的祖先浏览上下文），如果没有父级，则与 _self 表现一致。

此值可以被  formtarget 属性覆盖。

事件

💥onsubmit 事件 ：

当表单提交时执行 JavaScript:

<form action="demo-form.php" onsubmit="myFunction()">
  输入名字: <input type="text" name="fname"> 
  <input type="submit" value="提交"> </form>

此事件在表单提交时触发。

avatar
文章
阅读
粉丝