Java EE WEB工程师培训—JDBC+Servlet+JSP整合开发之32. HTML简介

• 本季内容提要 
–HTML简介 
–简单HTML元素 
–HTML元素和属性 
–Style 和class属性 
–超级链接 
–图片 
–标题 
–给文本分组 
–格式化文本 
–列表 
–表 
–在表中的rowspan 和colspan 
–注释

##################Michael分割线########################

• 简单HTML元素 
–简单的HTML元素格式如下： 
    • <TAGNAME> 
    • ..... 
    • </TAGNAME> 
–TAGNAME是标签名称，完整的HTML 4.01元素列表可到如下站点找到： 
• [url]http://www.w3.org/TR/html4/index/elements.html[/url]

– 有90个不同的标准标签名称，这里我们只讲述如下核心标签的用法 
– TAGS ATTRIBUTES 
– ================================ 
– html 
– head 
– title 
– body 
– a href=URL name=STRING 
– img src=URL alt="TEXT" ;NUM" height="NUM" 
– h1 
– h2 
– ... 
– h6 
– hr 
– p 
– div 
– br 
– span 
– pre 
– ol 
– ul 
– li 
– table border="NUM" cellspacing=DISTANCE cellpadding=DISTANCE 
– tr 
– td 
– th

–实例演示

• HTML元素和属性 
• 最基本的HTML元素和属性格式如下所示： 

• Style 和class 属性 
• Style和class 属性用来指定文本样式 
–style：直接使用样式 
–class：引用CSS样式表

•超级链接 
• 元素<a ...> 用来指定从当前页面跳转到其他页面的一个链接 
• 格式如下： 
–<a href="URL"> HYPERTEXT </a> 
• 示例

• 跳转到父文件夹“../”

 
• 发送Email链接

 
• 链接多媒体

• 跳转到同页面的其他部分的链接

 

• 图片 
• 在网页中引用图片的格式如下： 
–<img src="WEBADDRESS" alt=TEXT height=NUM /> 
• 示例

• 标题 
• 标题有6个级别从h1到h6，他们的格式如下： 
–<h1> CONTENT </h1> 
• 示例

• 给文本分组 
• 跨区 
–<span> CONTENT </span>

 
• 换行 
–<br/> 
• 水平线 
–<hr/>

   
• 段落 
– <p>CONTENT</p> 
•层 
–<div>CONTENT</div>

•格式化文本 
• 一般用来显示程序代码，保留Tag和空格 
–格式如下： 
<pre> 
Pre 
Formatted 
Content 
</pre> 
• 示例

• 列表 
• HTML提供了多种不同的列表类型，这里只讲述两种类型： 
–Ul（unnumbered lists） 
» 没有数字顺序的 
–Ol（ordered lists） 
» 有数字顺序的 
• 示例

• 表 
• <table> 
–表元素 
• <tr> 
–行元素 
• <td> 
–列元素 
• <th> 
–<列标题>

上图说明了表格的几个属性,其中黑色部分就是巢(cell)，白色的区域是巢补白(表格填充)，灰色的区域是巢空间(表格间距)。

• 在表中的rowspan 和colspan 
• rowspan 
–一列跨多行 
• colspan 
–一行跨多列 
–示例

• 注释 
• 注释格式 
–<!-- comment --> 
• 示例

 

################Michael分割线####################

本文转自redking51CTO博客，原文链接：http://blog.51cto.com/redking/147984 ，如需转载请自行联系原作者