前端之旅—————HTML标签

HTML的标签

  • <title></title>标题标签,显示在浏览器选项卡处的标题。

  • <p></p>段落标签,它的语义是显示一个段落。

  • <h1></h1> 到<h6></h6>标题标签,是一级标题到六级标题。

  • <img src="路径" alt="替换文本" title="悬停文本"/>图片标签,用于将一个图片插入到网页中,其中src是存放图片的路径,alt是当图片未加载出来时出现的说明文字,title是将鼠标指向图片时随光标出现的说明文字。

  • <a href=“路径" title="悬停文本" target=""/> a标签用于链接网页,一个网站通常是由好多网页链接而成,href是想要到的目标地址。 可以是一个网页的地址,也可以是图片文件的地址。 title是当鼠标到链接上时出现的说明文字。 target表示是否在在新窗口中打开,如果没有则此链接打开是在当前的标签页,如果后面跟着"_blank"则会打开一个新的标签页显示链接的页面。
    a标签中也可以用name属性或者id属性作为页面内的锚点,例如到了网页的尾部想回到指定的位置,例如<a name="header">文章开始</a>或者<a id="header">文章开始</a><a href="#header">重新阅读文章<a/>就是将描点指向名叫header的地方,即文章开始的地方。

HTML中的组标签
  • <ul type="circle"或者"square"或者默认不写><li></li><li></li><li></li></ul>无序列表标签,type是指无序列表的先导符号,circle是指空心圆圈,square是指实心方块,默认不写的情况下是一个小圆点。标签是一个容器级别的标签,里面什么都可以放。

  • <ol type="1或者"i"或者"a"等等><li></li><li></li><li></li></ol>有序列表标签,type是指有序的列表的前导符号,1是指按照阿拉伯数字排序,i是按照希腊数字排序,a是指按照英文字母排序。和无序标签一样li只能被上一级包裹,而li里面可以包含各种标签。

  • <dl><dt></dt><dd></dd><dt></dt><dd></dd></dl>定义列表,dl中只可以有dt和dd,dt是指定义标题,dd是指定义描述,是对dt的解释说明。定义列表用法非常灵活,可以一个dt配很多dd。dt和dd都是容器级别的标签。

HTML中的两个重要的盒子
  • <div></div>div标签在浏览器中没有任何效果,但是增加了语义。是容器级别的标签可以放任何语义的标签。

  • <span></span>span标签里可以放文字 、图片、表单元素。span里面不能放p、h、ul、dl、ol、div等标签。

HTML中的input标签
  • <input type="text" value="默认值"/>文本框,一般用于输入用户的文本信息。

  • <input type="password" value="默认值"/>密码框一般用与输入用户的密码。

  • <input type="radios" name=""/>单选按钮,其中name的属性值是一样的,为一组单选按钮,只能选其中一个。

  • <input type="checkbox" name=""/>复选框,其中name的属性值是一样的为一组复选框,可以选中多个。

  • <input type="button" value="默认值"/>普通按钮,其中默认值指显示在按钮上的默认文字。

  • <input type="submit" value="默认值"/>提交按钮,默认值为提交字样,也可以根据需要修改按钮上的文字。此按钮可以将form标签中的值提交到表单的action的那个页面中。

  • <input type="reset">重置按钮。

HTML中的多行文本框
  • <textarea cols="" rows=""></textarea>文本域,其中cols是所需要的列数,rows是所需要的行数,即任意行任意列的文本框。
HTML中常用的几个字符实体

|字符|实体名|实体数|
|---  -|---------|---------|
|  ·  |         |%u25CF; |
|  *  |         | &#10052;|
|  "  |&quot;|   &#34;     |
|  & |&amp; |   &#38;     |
|  © |&copy;|                  |
|  < |&lt;  &#60;      |
|  > |&gt;  |  &#62;      |
|  空格  |&nbsp;|&#160;  |


猜你喜欢

转载自blog.csdn.net/qq_36647038/article/details/79903734