第6课:学习更多元素


第6课:学习更多元素
你有没有独立完成过一些网页?如果还没有,请看下面的例子:


</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>


 

本文作者:



相关阅读:
Windows7操作系统无法玩魔兽3的问题
不支持fsockopen但支持culr环境下下ucenter与modoer通讯问题
掌握XML实例演练ASP+XML编程
B/S开发中常用javaScript技术与代码
Oracle的dual虚拟表介绍
php引用地址改变变量值的问题
简洁的一个实现网页全屏代码
不用组件实现Ajax效果
关于分页查询和性能问题
php5 mysql分页实例代码
php 各种应用乱码问题的解决方法
FreeBSD下架构Postfix的邮件系统
php下用GD生成生成缩略图的两个选择和区别
Javascript函数 判断数字的合法性
快速导航
PHP MySQL HTML CSS JavaScript MSSQL AJAX .NET JSP Linux Mac ASP 服务器 SQL jQuery C# C++ java Android IOS oracle MongoDB SQLite wamp 交通频道 作文范文 公司业务员2010年工作计划 《想飞的乌龟》教案 思念你在深夜 奶奶生气了作文600字 网海茫茫,情深几许 游鱼与飞鸟的爱作文100字 广西浦北县城文昌塔赋 随笔!二首诗作文300字 给同学的生日祝福语 思恋的痛 关于合作的语段 暑假交响曲作文700字 你若安好便是晴天 真想变成岸边的垂柳150字 可爱的花生作文 小议愚公移山800字 爱的世界作文800字 大兴安岭的冬天 工作总结格式:年终工作总结结尾怎么写 优秀想象作文600字:14年以后 坝上,有一道亮丽的风景 小学三年级作文300字:趣味运动会 2016年暑假大学生社会实践报告2篇 何为骗子 忙里偷闲作文 学校除四害工作方案 2011兔年元宵节最新最全灯谜 第十届田径运动会工作总结 学弹电子琴 最无奈的7夕 青蛙哭了作文 小学二年级作文200字:学习英语的好方法(A good way to learn english) 歌唱垃圾桶 我们失败,只是因为我们不再坚持_励志文章 一封情书(三) 这样的友情时时想起 法庭审判员先进事迹材料 龙年拜年祝福语短信 学校2015年常规检查自查报告 神奇的想象力 美丽的心灵 舞之精灵作文700字 告诉你职场发展10个障碍_职场励志 励志劝学的名言警句 会被愚笨和鄙陋的东西呛住 描写“母爱”好句 秋闺月 关于开放型经济的讲话 作文 战后城市月光曲 自荐书范文2 这一场不期的相遇

Copyright © 2016 phpStudy |