java程序员从笨鸟到菜鸟_Java程序员从笨鸟到菜鸟之（十四）Html基础积累总结（上）...

【新朋友】点击标题下面(↑)蓝色字“Java那些事”关注

【老朋友】点击右上角，转发或分享本页面内容

这是我以前写的《java程序员由笨鸟到菜鸟》系列博客，每天更新一篇。下面是系里博客的第十四篇——Html基础积累总结(上)

注：由于本文内含有大量html标签，在排版上有些困难，所以排版不太美观，请大家见谅

一：首先看页面标记

1. html文件结构

, , , ,

HTML 文件的正文写在这里... ...

2. 语言字符集(Charsets)的信息

#可以是gbk，utf-8等

3. 背景色彩和文字色彩

bgcolor --- 背景色彩

text --- 非可链接文字的色彩

link --- 可链接文字的色彩

alink --- 正被点击的可链接文字的色彩

vlink --- 已经点击(访问)过的可链接文字的色彩

#=rrggbb

色彩是用 16进制的 红－绿－蓝(red-green-blue, RGB)值来表示。

16 进制的数码有: 0,1,2,3,4,5,6,7,8,9,a,b,c,d,e,f.

背景图象

4.链接(Link)

基本语法 ...

这是一个

链接的例子。

点一下带下划线的文字!

跳转到页面的另外一个地方

...

...

跳转到下一个"链接点"

下一个链接点

跳转到另一个页面的某个地方

...

...

跳转到另一个页面的某个地方。

开一个新的(浏览器)窗口(Target Window)

...

开一个新窗口!

5.标尺线

---

---

---

---

---

---

---

---

#=left, right

---

---

---

---

---

#=rrggbb 16 进制RGB数码，或者是下列预定义色彩：

Black, Olive, Teal, Red, Blue, Maroon, Navy, Gray, Lime,

Fuchsia, White, Green, Purple, Silver, Yellow, Aqua

---

二：然后来看一下字体的设置

1.标题字体(Header)

... #=1, 2, 3, 4, 5, 6

今天天气真好！

今天天气真好！

今天天气真好！

今天天气真好！

今天天气真好！

今天天气真好！

今天天气真好！

今天天气真好！

今天天气真好！

今天天气真好！

今天天气真好！

今天天气真好！

· --- 这些标记显示黑体字。

· --- 这些标记自动插入一个空行，不必用

标记再加空行。

因此在一行中无法使用不同大小的字体。

2.字体大小

... #=1, 2, 3, 4, 5, 6, 7 or +#, -#

#=1, 2, 3, 4, 5, 6, 7

今天天气真好！今天天气真好！

今天天气真好！今天天气真好！

今天天气真好！今天天气真好！

今天天气真好！今天天气真好！

3.物理字体(Physical Style)

今天天气真好！今天天气真好！

今天天气真好！今天天气真好！

今天天气真好！今天天气真好！

今天天气真好！今天天气真好！

^{今天天气真好！}今天天气真好！

_{今天天气真好！}今天天气真好！

今天天气真好！今天天气真好！

今天天气真好！ 今天天气真好！

4.逻辑字体(Logical Style)

今天天气真好！今天天气真好！

今天天气真好！今天天气真好！

今天天气真好！今天天气真好！

今天天气真好！今天天气真好！

今天天气真好！今天天气真好！

今天天气真好！今天天气真好！

今天天气真好！今天天气真好！

今天天气真好！今天天气真好！

5.指定“字体大小”的标记和“指定字体”的标记的组合使用

今天天气真好！

今天 天气真好！

6.字体颜色

指定颜色 ...

#=rrggbb 16 进制数码，或者是下列预定义色彩：

Black, Olive, Teal, Red, Blue, Maroon, Navy, Gray, Lime,

Fuchsia, White, Green, Purple, Silver, Yellow, Aqua

White &

White

7.客户端字体(Font Face)

...

#=客户端可获得的字体(微软雅黑，roman等)

Hellow World!

Hellow World!

8.字符实体(Entities)

#=字符实体名称 或者ascii值

HTML2.0 的字符集

& &

< <

> >

" "

HTML2.0 字符实体名称列表

HTML3.2 字符实体名称列表

ISO 字符实体名称列表

三：在看一下文字布局

1.行的控制

段(Paragraph)(可以看作是空行)

你好吗？

很好。

你好吗？

很好。

换行

你好吗？
很好。

你好吗？

很好。

不换行

请改变您浏览器窗口的宽度， 使之小于这一行的宽度， 看看这个标记的作用！

请改变您浏览器窗口的宽度，使之小于这一行的宽度，看看这个标记的作用！

2.文字的对齐(Alignment)

...

...

#=left, center, right

Hello

Hello

Hello

Hello

... Hello

Hello

3.文字的分区(Division)显示

...

...

Can you feel happiness without unpleasant?

Please show me your smile.

4.列表

无序列表

• ...

• Today
• Tommorow

· Today

· Tommorow

有序列表

1. ...

1. Today
2. Tommorow

1 Today

2 Tommorow

定义列表(Definition lists)

...

...

Today

Today is yesterday.

Tomorrow

Tomorrow is today.

Today

Today will be yesterday.

Tomorrow

Tomorrow will be today.

5.预格式化文本(Preformatted Text)

...

Please use your card.

VISA Master

Here is an order form.

• Fax
• Air Mail

Please use your card

VISA Master

Here is an order form.

· Fax

· Air Mail

...

Please use your card.

VISA Master

Here is an order form.

• Fax
• Air Mail

Please use your card.

VISA Master

Here is order form.

• Fax
• Air Mail

闪烁 ...

闪烁！闪烁！

四：下一个看一下图象

1.链入图象的基本语法

#=图象的URL

#=在浏览器尚未完全读入图象时，在图象位置显示的文字。

2.图象和文字的对齐

#=top, middle, bottom

My face!

My Face!

· 只有一行文字才可以放在图象的两边。(不知道翻译的对不对？)

· Only one text line can be flown into the both side of Image.

3. 图象在页面中的对齐/布局(Floating Image)

My Face!

It is always

smiling.

Hahaha....

My Face!

It is always

smiling.

Hahaha....

My Face!

It is always

smiling.

Hahaha....

My Face!

It is always

smiling.

Hahaha....

#=value

My Face!

It is always

smiling.

Hahaha....

My Face!

It is always

smiling.

Hahaha....

4.边框

#=value

5.客户端图象映射图

示例代码：

五：下面看一下常用的表单

1.基本语法

...

...

*=GET, POST

表单中提供给用户的输入形式

*=text,文本框 password密码框, checkbox复选框, radio单选框, image图象坐标 , hidden隐藏表单, submit提交, reset重置

**=Symbolic Name for CGI script

2.列表框(Selectable Menu)

基本语法

...

Banana

Apple

Orange

注意，是用 Ctrl键配合鼠标实现多选。

(和MS-WINDOWS的File Manager一样)

3.文本域

...

对于很长的行是否进行换行的设置(Word Wrapping)

...

不换行，是缺省设置。

...

“软换行”，好象MS－WORD里的“软回车”。

...

“硬换行”，好象MS－WORD里的“硬回车”。

本文来自：曹胜欢博客专栏。转载请注明出处：http://blog.csdn.net/csh624366188

下一篇写：

Java程序员从笨鸟到菜鸟之(十五)——Html基础积累总结(下)