HTML快速入门2
三、版面风格控制
1. 字体控制
A. 字体大小
用 <font Size=#> 和 </font> 表示，＃为字号： 1 － 7 ，缺省为 3 ，可用 <basefontsize= 字号 > 改变缺省字号。
设置字号有两种办法：
l 设置绝对字号； <font size= 字号 >
l 设置相对字号； <font size= ± n> ，以缺省字号为基础，“＋”号表示字体变大，“－”号表示字体变小。
B. 字体风格
字体风格分为物理风格和逻辑风格。
物理风格直接指定字体，物理风格的字体有 <B> 黑体， <I> 斜体， <U> 下划线， <TT> 打字机体。
逻辑风格指定文本的作用。 <EM> 强调； <STRONG> 特别强调； <CODE> 源代码； <SAMP> 例子； <KBD>
键盘输入； <VAR> 变量； <DFN> 定义； <CITE> 引用； <SMALL> 较小； <BIG> 较大； <SUP> 上标； <SUB> 下标。
<B>Today is fine!</B>
<I>Today is fine!</I>
<U>Today is fine!</U>
<TT>Today is fine!</TT> 如图：
}" align="baseline" border="0" />
逻辑风格指定文本的作用
<DFN> 定义 : 用于定义词的风格。通常是按斜体字体显示
<EM> 强调 : 通常也是显示为斜体。
<STRONG> 特别强调 : 用加粗字体显示。如 ( 重要事项 )
<CODE> 源代码 : 显示摘录的程序代码，用固定大小的字体显示
<KBD> 键盘输入 : 用于显示用户的键盘输入。用粗体加亮字体显示，许多浏
览器直接用等宽字体显示
<VAR> 变量 : 表示变量，通常用斜体显示
<SMALL> 较小
<BIG> 较大
上标 <SUP> 上标
下标 <SUB> 下标
C. 字体颜色
页面的颜色是由 "red" "green" "blue" 三原色组合而成，在 HTML 中对于颜色深度的定义采用十六进
制，对于三原色 HTML 分别给予两个十六进位去定义，也就是每个原色可有 256 种深度，故此三原色
可混合成一千六佰多万的颜色（ 16777216 ）。
例如
白色 red=ff, green=ff, blue=ff, RGB 值即为 ffffff
红色 red=ff, green=00, blue=00, RGB 值即为 ff0000
绿色 red=00, green=ff, blue=00, RGB 值即为 00ff00
蓝色 red=00, green=00, blue=ff, RGB 值即为 0000ff
黑色 red=00, green=00, blue=00, RGB 值即为 000000
应用时常在每个 RGB 值之前加上符号 # 以示分别，不加亦可。
请看常用RGB色彩对照表
也可以使用以下预定义的颜色 black, olive （橄榄色） , teal （黑绿色，水鸭） , red, blue, maroon （栗子色） ,
navy （海蓝） , gray （灰） , lime （酸橙） , fudrsia （紫红） white, green, purple( 紫色 ),
sliver, yellow, aqua （浅绿）之一。
|
颜色 |
颜色实效 |
英文名 |
十六进制 RGB 值 |
|
黑色 |
Black |
#000000 |
|
|
银灰色 |
Silver |
#C0C0C0 |
|
|
灰色 |
Gray |
#808080 |
|
|
白色 |
White |
#FFFFFF |
|
|
绛紫色 |
Maroon |
#800000 |
|
|
红色 |
Red |
#FF0000 |
|
|
紫色 |
Purple |
#800080 |
|
|
紫红色 |
Fudrsia |
#FF00FF |
|
|
绿色 |
Green |
#008000 |
|
|
草绿色 |
Lime |
#00FF00 |
|
|
橄榄色 |
Olive |
#808000 |
|
|
黄色 |
Yellow |
#FFFF00 |
|
|
海蓝色 |
Navy |
#000080 |
|
|
蓝色 |
Blue |
#0000FF |
|
|
黑绿色 |
Teal |
#008080 |
|
|
淡蓝色 |
Cyan |
#00FFFF |
<Font Size=7 Color=Red> 电子科技大学 ( 红 )</Font><br>
<Font Size=6 Color=Fudrsia> 电子科技大学 ( 紫红色 )</Font><br>
<Font Size=5 Color=Silver> 电子科技大学 ( 银灰 )</Font><br>
<Font Size=4 Color=Lime> 电子科技大学（草绿） </Font><br>
<Font Size=3 Color=Blue> 电子科技大学（蓝色） </Font><br>
<Font Size=2 Color=Maroon> 电子科技大学（栗色） </Font><br>
<Font Size=1 Color=Black> 电子科技大学 ( 黑色 )</Font><br>
2. 横线 (hr)
横线，用于分隔同一文体的不同部分。
Size=n , 横线的垂直宽度 , n 的单位是象素 , 如： <hr Size=10>
width ＝ #, 横线长度 , # 可以是象素、百分比两种表示方式
<hr width=50> 、 <hr width=50%> 。
align=# 横线的位置。 # 定义如下。
left 左对齐；
right 右对齐；
center 居中对齐 （缺省）
<hr Size=3 width=50% align=center >
1. 图文混排
A. 在页面中添加图象
图象使页面更漂亮，但图象会导致网络流量增大。访问时间延长。所以在主页 (homepage) ，不宜采
用多个很大的图象。
图象的基本格式为： <img src="data:image-url">
比如：<img src="http://263.aka.org.cn/flyinglother.gif">(这个是绝对路径)
?/P>
或 <img src="data:image-urd" alt="text">
image-url 是图象文件的 url 。大部分浏览器支持 .gif 和 .jpg 文件， alt 属性告诉不支持图象的浏览
器用 text 代替该图。
假设图片为 Top-1.gif, 通常 SRC 有以下几种形式：
l SRC=”Top-1.gif”
l SRC=”image/Top-1.gif”
l SRC=”../Top-1.gif”
l SRC=http://www.rwsky.com/image/Top-1.gif
第一种 : SRC=”Top-1.gif” ： Top-1.gif 必须与该 html 文件放在同一文件夹。
第二种 :SRC=”image/Top-1.gif” ： Top-1.gif 必须放在该 html 文件所在文件夹下的 image 子文件夹中。
第三种 :SRC=”../Top-1.gif” ： Top-1.gif 必须放在该 html 文件所在文件夹的上一层文件夹 ( 父文件夹 ) 。
第四种 :SRC=”http://www.rwsky.com/image/Top-1.gif ” ：图象文件 Top-1.gif 必须放在www.rwsky.com这个 web 服务器宿主目录（默认为 wwwroot ）的 image 子目录下。
前三种叫做相对 url ，第四种叫做绝对 url 。
<body background="image-url"> 指定背景图片
<body bgcolor=# text=#> 指定背景和文字颜色
image-url ：填充背景的图象，如图象的尺寸小于窗口，则背景图象重复填
满窗口区域。
bgcolor ： 景颜色 16 进制的红、绿、兰分量如 00FF00( 绿色 ) 。
Text ： 文本颜色
Link ： 链接指针颜色
Alinik ： 活动的链接指针颜色 ( 即当鼠标在链接上按下了左键还没有
松开的状态 )
vlinik ： 已访问过的链接指针颜色
例：背景图片的平铺
<body background="fish.jpg">
<body bgcolor=Silver text=#ff0000>
<font size=4> 精彩的网络 </font>
</body>
HTML快速入门2的更多相关文章
- Web Api 入门实战 （快速入门+工具使用+不依赖IIS）
平台之大势何人能挡? 带着你的Net飞奔吧!:http://www.cnblogs.com/dunitian/p/4822808.html 屁话我也就不多说了,什么简介的也省了,直接简单概括+demo ...
- SignalR快速入门 ~ 仿QQ即时聊天，消息推送，单聊，群聊，多群公聊（基础=》提升）
SignalR快速入门 ~ 仿QQ即时聊天,消息推送,单聊,群聊,多群公聊(基础=>提升,5个Demo贯彻全篇,感兴趣的玩才是真的学) 官方demo:http://www.asp.net/si ...
- 前端开发小白必学技能—非关系数据库又像关系数据库的MongoDB快速入门命令（2）
今天给大家道个歉,没有及时更新MongoDB快速入门的下篇,最近有点小忙,在此向博友们致歉.下面我将简单地说一下mongdb的一些基本命令以及我们日常开发过程中的一些问题.mongodb可以为我们提供 ...
- 【第三篇】ASP.NET MVC快速入门之安全策略（MVC5+EF6）
目录 [第一篇]ASP.NET MVC快速入门之数据库操作(MVC5+EF6) [第二篇]ASP.NET MVC快速入门之数据注解(MVC5+EF6) [第三篇]ASP.NET MVC快速入门之安全策 ...
- 【番外篇】ASP.NET MVC快速入门之免费jQuery控件库（MVC5+EF6）
目录 [第一篇]ASP.NET MVC快速入门之数据库操作(MVC5+EF6) [第二篇]ASP.NET MVC快速入门之数据注解(MVC5+EF6) [第三篇]ASP.NET MVC快速入门之安全策 ...
- Mybatis框架 的快速入门
MyBatis 简介 什么是 MyBatis? MyBatis 是支持普通 SQL 查询,存储过程和高级映射的优秀持久层框架.MyBatis 消除 了几乎所有的 JDBC 代码和参数的手工设置以及结果 ...
- grunt快速入门
快速入门 Grunt和 Grunt 插件是通过 npm 安装并管理的,npm是 Node.js 的包管理器. Grunt 0.4.x 必须配合Node.js >= 0.8.0版本使用.:奇数版本 ...
- 【第一篇】ASP.NET MVC快速入门之数据库操作（MVC5+EF6）
目录 [第一篇]ASP.NET MVC快速入门之数据库操作(MVC5+EF6) [第二篇]ASP.NET MVC快速入门之数据注解(MVC5+EF6) [第三篇]ASP.NET MVC快速入门之安全策 ...
- 【第四篇】ASP.NET MVC快速入门之完整示例（MVC5+EF6）
目录 [第一篇]ASP.NET MVC快速入门之数据库操作(MVC5+EF6) [第二篇]ASP.NET MVC快速入门之数据注解(MVC5+EF6) [第三篇]ASP.NET MVC快速入门之安全策 ...
- Vue.js 快速入门
什么是Vue.js vue是法语中视图的意思,Vue.js是一个轻巧.高性能.可组件化的MVVM库,同时拥有非常容易上手的API.作者是尤雨溪,写下这篇文章时vue.js版本为1.0.7 准备 我推荐 ...
随机推荐
- [codevs 1306]广播操的游戏（Trie)
题目:http://codevs.cn/problem/1306/ 分析:题意一看就知道就是要求Trie有多少个节点.但是如果每次单独取原串的所有子串加入Trie会超时,为什么呢?比方说AAABBBC ...
- 使用github托管代码心
这次使用github托管代码并没有下载客户端git for windows,而是使用eclipse里面自带的git上传了hello world这个项目,步骤如下: 1.首先创建项目:file-> ...
- 【转载】Velocity模板引擎的介绍和基本的模板语言语法使用
原文地址http://www.itzhai.com/the-introduction-of-the-velocity-template-engine-template-language-syntax- ...
- ansible-3 主机清单hosts的设置
主机清单的设置参考:http://www.ansible.com.cn/docs/intro_inventory.html [ceshi]192.168.220.98log ansible_ssh_h ...
- poj1308 并查集
比较恶心 1: 0 0 空树是一棵树 2: 1 1 0 0 不是树 3: 1 2 1 2 0 0 不是树... 4: 1 2 2 3 4 5 不是树 森林不算是树 5: 1 2 2 3 3 4 4 5 ...
- Html-Css-div半透明
源码 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.o ...
- Java设计模式-访问者模式（Visitor）
访问者模式把数据结构和作用于结构上的操作解耦合,使得操作集合可相对自由地演化.访问者模式适用于数据结构相对稳定算法又易变化的系统.因为访问者模式使得算法操作增加变得容易.若系统数据结构对象易于变化,经 ...
- Java原来如此-比较器(Comparable、Comparator)
有时候需要对Collection或者不为单一数字的Array进行比较,有两种方法,1是实现Comparable接口,2是实现Comparator接口. 1.ComParable接口 Comparabl ...
- CATransform3D
本章介绍图层的几何组成部分,及他们之间的相互关,同时介绍如何变换矩阵可以产生复杂的视觉效果. 1.1 图层的坐标系 图层的坐标系在不同平台上面具有差异性.在iOS系统中,默认的坐标系统原点在图层的中心 ...
- Nagios配置和命令介绍（二 ）
Nagios配置 Nagios 主要用于监控一台或者多台本地主机及远程的各种信息,包括本机资源及对外的服务等.默认的Nagios 配置没有任何监控内容,仅是一些模板文件.若要让Nagios 提供服务, ...