你有没有独立完成过一些网页?如果还没有,请看下面的例子:
</html>
<head>
<title>我的网站</title>
</head>
<body>
<h1>标题</h1>
<p>一些文字。。。</p>
<h2>子标题</h2>
<p>一些文字。。。。</p>
</body>
</html>
看完了,然后呢?
现在要学习七个新元素。
前面学过,你可以通过用<b>和</b>把文本括起来,把文本设为粗体;类似地,你可以通过用<i>和</i>把文本括起来,把文本设为斜体。没错,这里的“i”是“斜体(italic)”的意思。
例1:
<i>这句话应显示为斜体</i>
该例在浏览器中将显示如下:
这句话应显示为斜体
同样,你可以用small标签把文本设为小字体:
例2:
<small>这句话应显示为小字体</small>
该例在浏览器中将显示如下:
这句话应显示为小字体
我可以同时应用多个标签吗?
你可以同时应用多个标签,只要你能避免标签交错起来。最好通过一个例子来说明:
例3:
如果你希望一段文本即是粗体又是斜体,你可以这样做:
<b><i>既是粗体又是斜体</i></b>
注意不能这样:
<b><i>既是粗体又是斜体</b></i>
二者区别在于:在前一个例子中,首先打开的标签最后关闭。这样可以避免混淆。
学习更多元素!
正如第3课中提到的,有些元素是没有尾标签(end tag)的。这种元素被称作空元素(empty element),它们不与特定文本段落相关。一个例子是<br />,它的作用是插入一个换行符。
例4:
写一些文字<br />重起一行再写一些文字
该例在浏览器中将显示如下:
写一些文字
重起一行再写一些文字
注意上面的空元素<br />:它没有尾标签,并且在首标签名称的后面加了空格和斜杠。
另一个空元素是<hr />,它的作用是画一条水平线。这里的“hr”是“水平线(horizontal rule)”的意思。
例5:
<hr />
该例在浏览器中将显示如下:
--------------------------------------------------------------------------------
HTML中的空元素还包括ul、ol和li,这三个元素用于制作列表。
ul代表“无序列表(unordered list)”,它的作用是为每个列表项显示一个粗点。ol代表“有序列表(ordered list)”,它的作用是显示每个列表项的序号。用<li>元素把多个列表项组织为一个列表,其中的li代表“列表项(list item)。感觉有些迷糊?那么,请看下面的例子:
例7:
<ul>
<li>一个列表项</li>
<li>另一个列表项</li>
</ul>
该例在浏览器中将显示如下:
一个列表项
另一个列表项
例8:
<ol>
<li>第一个列表项</li>
<li>第二个列表项</li>
</ol>
该例在浏览器中将显示如下:
第一个列表项
第二个列表项
哟!就这些啊?
嗯,这一课就学这么多。再次重申,请反复实验本课所学的元素,并在制作自己的网页时使用它们。
<i>斜体</i>
<small>小字体</small>
<br /> 换行
<hr /> 水平线
<ul>无序列表</ul>
<ol>有序列表</ol>
<li>列表项</li>
</html>
<head>
<title>我的网站</title>
</head>
<body>
<h1>标题</h1>
<p>一些文字。。。</p>
<h2>子标题</h2>
<p>一些文字。。。。</p>
</body>
</html>
看完了,然后呢?
现在要学习七个新元素。
前面学过,你可以通过用<b>和</b>把文本括起来,把文本设为粗体;类似地,你可以通过用<i>和</i>把文本括起来,把文本设为斜体。没错,这里的“i”是“斜体(italic)”的意思。
例1:
<i>这句话应显示为斜体</i>
该例在浏览器中将显示如下:
这句话应显示为斜体
同样,你可以用small标签把文本设为小字体:
例2:
<small>这句话应显示为小字体</small>
该例在浏览器中将显示如下:
这句话应显示为小字体
我可以同时应用多个标签吗?
你可以同时应用多个标签,只要你能避免标签交错起来。最好通过一个例子来说明:
例3:
如果你希望一段文本即是粗体又是斜体,你可以这样做:
<b><i>既是粗体又是斜体</i></b>
注意不能这样:
<b><i>既是粗体又是斜体</b></i>
二者区别在于:在前一个例子中,首先打开的标签最后关闭。这样可以避免混淆。
学习更多元素!
正如第3课中提到的,有些元素是没有尾标签(end tag)的。这种元素被称作空元素(empty element),它们不与特定文本段落相关。一个例子是<br />,它的作用是插入一个换行符。
例4:
写一些文字<br />重起一行再写一些文字
该例在浏览器中将显示如下:
写一些文字
重起一行再写一些文字
注意上面的空元素<br />:它没有尾标签,并且在首标签名称的后面加了空格和斜杠。
另一个空元素是<hr />,它的作用是画一条水平线。这里的“hr”是“水平线(horizontal rule)”的意思。
例5:
<hr />
该例在浏览器中将显示如下:
--------------------------------------------------------------------------------
HTML中的空元素还包括ul、ol和li,这三个元素用于制作列表。
ul代表“无序列表(unordered list)”,它的作用是为每个列表项显示一个粗点。ol代表“有序列表(ordered list)”,它的作用是显示每个列表项的序号。用<li>元素把多个列表项组织为一个列表,其中的li代表“列表项(list item)。感觉有些迷糊?那么,请看下面的例子:
例7:
<ul>
<li>一个列表项</li>
<li>另一个列表项</li>
</ul>
该例在浏览器中将显示如下:
一个列表项
另一个列表项
例8:
<ol>
<li>第一个列表项</li>
<li>第二个列表项</li>
</ol>
该例在浏览器中将显示如下:
第一个列表项
第二个列表项
哟!就这些啊?
嗯,这一课就学这么多。再次重申,请反复实验本课所学的元素,并在制作自己的网页时使用它们。
<i>斜体</i>
<small>小字体</small>
<br /> 换行
<hr /> 水平线
<ul>无序列表</ul>
<ol>有序列表</ol>
<li>列表项</li>