R·ex / Zeng


音游狗、安全狗、攻城狮、业余设计师、段子手、苦学日语的少年。 MUGer, hacker, developer, amateur UI designer, punster, Japanese learner.

【HTML教程第二篇】我有特殊的属性

注意:本文发布于 2084 天前,文章中的一些内容可能已经过时。

本文假设读者已经理解了HTML中标签的含义。

标签不是一成不变的。就和人一样,有的人长的高,有的人喜欢打篮球……对于标签来说,例如 <a> 是一个表示超链接的标签:链接到哪里,是否在新窗口中打开标签……这些差异注定了不是所有的 <a> 标签都一样。如何描述这样的差别呢?先看一下下面这句话:

<a href="https://blog.rexskz.info/html-lesson-props.html">【HTML教程第二篇】我有特殊的属性</a>

效果:【HTML教程第二篇】我有特殊的属性

咦,href 以及引号里的那串文字是什么意思?其实这句话就是想说:这里有一个 <a> 标签,它的链接地址是 http://blog.rexskz.info/?p=32,被设置超链接的文字是“【HTML教程第二篇】我有特殊的属性”。

这就是标签的属性。属性被嵌入在开放标签里,不同的属性用空格隔开。举个形象点的栗子吧,用所谓的“标签”和“属性”来描述一下我自己:

<student name="rex" age="19" sex="male" school="nuaa"></student>

这样好理解了吧?下文会介绍其它几个 HTML 中常用的标签。

链接
语法:<a href="链接地址" target="_blank表示在新窗口中打开">加链接的内容</a>
示例:<a href="http://www.baidu.com" target="_blank">百度</a>

图像(单标签)
语法:<img src="图像地址" width="图像宽度,可省略" height="图像高度,可省略">
示例:<img src="http://git.oschina.net/assets/logo-white.png" width="50" height="50">

表格(table 为表格整体,tr 为行,td 为列,th 为表头)
<table border-spacing="每一格的间距">
    <tr>
        <th>姓名</th><th>年龄</th>
        <td>rex</td><td>19</td>
        <td>chrics</td><td>20</td>
    </tr>
</table>

更多的标签和属性,请戳 W3School,这是个很好的教学网站。

任务:利用目前所学的标签和属性,写一个网页介绍你自己。

HTML 的基础教程到这里就结束了。内容不多,只要理解了当前的几个标签和属性,以后遇到新内容时接受起来会很快的。之所以 W3School 上讲的如此众多的标签我没有介绍,是因为我平常也很少用这些标签。至于为什么,等 CSS 教程出来之后就明白了。

版权声明:除文章开头有特殊声明的情况外,所有文章均可在遵从 CC BY 4.0 协议的情况下转载。
上一篇: 【HTML教程第一篇】多样的标签
下一篇: 【CSS教程第一篇】随心所欲挪元素

这是我们共同度过的

第 1553 天