本文来自:曹胜欢博客专栏。转载请注明出处:http://blog.csdn.net/csh624366188
注:由于本文内含有大量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)
今天天气真好!
今天天气真好!
今天天气真好!
今天天气真好!
今天天气真好!
今天天气真好!
今天天气真好!
今天天气真好!
今天天气真好!
今天天气真好!
今天天气真好!
今天天气真好!
·
·
因此在一行中无法使用不同大小的字体。
2.字体大小
... #=1, 2, 3, 4, 5, 6, 7 or +#, -#
今天天气真好!今天天气真好!
今天天气真好!今天天气真好!
今天天气真好!今天天气真好!
今天天气真好!今天天气真好!
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)
...
Hello<\h3>
Hello<\h3>
Hello
Hello
Hello
3.文字的分区(Division)显示
Can you feel happiness without unpleasant?
Please show me your smile.
4.列表
无序列表
· Today
· Tommorow
有序列表
1 Today
2 Tommorow
定义列表(Definition lists)
Today
Today will be yesterday.
Tomorrow
Tomorrow will be today.
5.预格式化文本(Preformatted Text)
...
Please use your card.
VISA Master
Here is an order form.
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.
Please use your card.
VISA Master
Here is order form.
闪烁
四:下一个看一下图象
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)
基本语法
注意,是用 Ctrl 键配合鼠标实现多选。
(和 MS-WINDOWS 的 File Manager 一样)
3.文本域
对于很长的行是否进行换行的设置(Word Wrapping)
不换行,是缺省设置。
“软换行”,好象 MS-WORD 里的“软回车”。
“硬换行”,好象 MS-WORD 里的“硬回车”。
本文来自:曹胜欢博客专栏。转载请注明出处:http://blog.csdn.net/csh624366188