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]
image
– 有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
–实例演示
image
image
image
image
• HTML元素和属性 
• 最基本的HTML元素和属性格式如下所示: 
image
image
image
image
• Style 和class 属性 
• Style和class 属性用来指定文本样式 
–style:直接使用样式 
–class:引用CSS样式表
image
•超级链接 
• 元素<a ...> 用来指定从当前页面跳转到其他页面的一个链接 
• 格式如下: 
–<a href="URL"> HYPERTEXT </a> 
• 示例
image
image
image
image
image
image
image
• 跳转到父文件夹“../”
image
image
image
image 
• 发送Email链接
image
image
image
image
image 
• 链接多媒体
image
• 跳转到同页面的其他部分的链接
image
image
image 
• 图片 
• 在网页中引用图片的格式如下: 
–<img src="WEBADDRESS" alt=TEXT height=NUM /> 
• 示例
image
• 标题 
• 标题有6个级别从h1到h6,他们的格式如下: 
–<h1> CONTENT </h1> 
• 示例
image
image
image
• 给文本分组 
• 跨区 
–<span> CONTENT </span>
image
image
image 
• 换行 
–<br/> 
• 水平线 
–<hr/>
image
image   
• 段落 
– <p>CONTENT</p> 
•层 
–<div>CONTENT</div>
image
image
•格式化文本 
• 一般用来显示程序代码,保留Tag和空格 
–格式如下: 
<pre> 
Pre 
Formatted 
Content 
</pre> 
• 示例
image
image
image
image
image
• 列表 
• HTML提供了多种不同的列表类型,这里只讲述两种类型: 
–Ul(unnumbered lists) 
» 没有数字顺序的 
–Ol(ordered lists) 
» 有数字顺序的 
• 示例
image
image
image
image
image
• 表 
• <table> 
–表元素 
• <tr> 
–行元素 
• <td> 
–列元素 
• <th> 
–<列标题>
image
image
image
image
上图说明了表格的几个属性,其中黑色部分就是巢(cell),白色的区域是巢补白(表格填充),灰色的区域是巢空间(表格间距)。
• 在表中的rowspan 和colspan 
• rowspan 
–一列跨多行 
• colspan 
–一行跨多列 
–示例
image
image
image
image
image
• 注释 
• 注释格式 
–<!-- comment --> 
• 示例
image
  image
image
image
################Michael分割线####################







本文转自redking51CTO博客,原文链接:http://blog.51cto.com/redking/147984 ,如需转载请自行联系原作者
相关文章
|
2月前
|
Java 关系型数据库 数据库连接
JDBC:Java与数据库的“黄金搭档”,为何它如此重要?
JDBC:Java与数据库的“黄金搭档”,为何它如此重要?
38 8
|
2月前
|
Java 数据库连接 API
JDBC:Java数据库连接的“黑科技”大揭秘
JDBC:Java数据库连接的“黑科技”大揭秘
35 7
|
2月前
|
SQL Java 数据库连接
为何JDBC是Java开发者的“心头好”?原因竟然这么简单!
为何JDBC是Java开发者的“心头好”?原因竟然这么简单!
35 3
|
18天前
|
XML JavaScript Java
NekoHTML 是一个基于Java的HTML扫描器和标签补全器
**NekoHTML** 是一个基于Java的HTML扫描器和标签补全器(tag balancer),由J. Andrew Clark开发。它主要用于解析HTML文档,并能够“修正”许多在编写HTML文档过程中常犯的错误,如增补缺失的父元素、自动用结束标签关闭相应的元素,以及处理不匹配的内嵌元素标签等。这使得程序能够以标准的XML接口来访问HTML文档中的信息。 ### NekoHTML的主要特点包括: 1. **错误修正**:能够自动修正HTML中的常见错误,如未闭合的标签等。 2. **DOM树生成**:将HTML源代码转化为DOM(Document Object Model)结构,便
|
4天前
|
SQL Java 数据库连接
如何在 Java 脚本中有效地使用 JDBC
如何在 Java 脚本中有效地使用 JDBC
12 0
|
2月前
|
缓存 Java 应用服务中间件
SpringMVC入门到实战------七、SpringMVC创建JSP页面的详细过程+配置模板+实现页面跳转+配置Tomcat。JSP和HTML配置模板的差异对比(二)
这篇文章详细介绍了在SpringMVC中创建JSP页面的全过程,包括项目的创建、配置、Tomcat的设置,以及如何实现页面跳转和配置模板解析器,最后还对比了JSP和HTML模板解析的差异。
SpringMVC入门到实战------七、SpringMVC创建JSP页面的详细过程+配置模板+实现页面跳转+配置Tomcat。JSP和HTML配置模板的差异对比(二)
|
2月前
|
SQL Java 关系型数据库
探索Java数据库连接的奥秘:JDBC技术全攻略
探索Java数据库连接的奥秘:JDBC技术全攻略
47 8
|
2月前
|
SQL Java 数据库连接
JDBC之旅:从陌生到熟悉的Java数据库连接之路
JDBC之旅:从陌生到熟悉的Java数据库连接之路
23 8
|
2月前
|
SQL Java 数据库连接
Java开发者必知:JDBC连接数据库的“三大法宝”
Java开发者必知:JDBC连接数据库的“三大法宝”
21 7
|
2月前
|
SQL 安全 Java
JDBC:Java与数据库的“月老红线”,你真的了解它吗?
JDBC:Java与数据库的“月老红线”,你真的了解它吗?
18 1