版面风格控制

控制

 §4.1 字体大小
  html有七种字号,1号最小,7号最大。缺省字号为3,可以用<basefontsize=字号>设置缺省字号。
  设置文本的字号有两种办法,一种是设置绝对字号,<font size=字号>;另一种是设置文本的相对字号;<font size=±n>。用第二种方法时“+”号表示字体变大,“-”号表示字体变小。
  <font size=7>Today is fine!</font>Today is fine!
    <font size=6>Today is fine!</font>Today is fine!
    <font size=5>Today is fine!</font>Today is fine!
    <font size=4>Today is fine!</font>Today is fine!
    <font size=3>Today is fine!</font>Today is fine!
    <font size=2>Today is fine!</font>Today is fine!
    <font size=1>Today is fine!</font>Today is fine!

  §4.1.2 字体风格
    字体风格分为物理风格和逻辑风格。物理风格直接指定字体,物理风格的字体有<b>黑体,<i>斜体,<u>下划线,
    <tt>打字机体。逻辑风格指定文本的作用。
  <em>强调 <srrony>特别强调 <code>源代码
    <samp>例子 <kbd>键盘输入 <var>变量
    <dfn>定义 <cite>引用 <small>较小
    <big>较大 <sup>上标 <sup>下标
    物理风格
    <b>Today is fine!</b>Today is fine!
    <i>Today is fine!</i>Today is fine!
    <u>Today is fine!</u>Today is fine!
    <tt>Today is fine!</tt>Today is fine!
    逻辑风格

  §4.1.3 字体颜色
    字体的颜色用<font color=#>指定#可以是6位16进数,分别指定红、绿、兰的值,也可以是black,olive,teal,red,blue,maroon,navy,gray,lime,fudrsia,white,green,

purple,sliver,yellow,aqua 之一。

  §4.1.4 闪烁
    <blink>文本</blink>使文本闪烁,闪烁频率为1秒钟一次。

  §4.2 横线 (hr)
  横线,一般用于分隔同一文体的不同部分。在窗口中划一条横线非常简单,只要写一个<hr>即可。横线的宽度用<hr size=n>指定,width=#>指n是线宽,单位是象素。例:<hr size=10>。 <hr 定横线长度,可以指定绝对线长,也可以指定横线长度占窗口宽度的百分比。
    例<hr width=50> 、<hr width=50%>。
  横线的位置用<hr align=#>指定。
  #是left成right之一,left表示左端与左边界对齐,right是右端与右边界对齐,缺省,横线出现在窗口正中。

  4.3 行间图象
  行向图象使你的页面更加漂亮,但是行向图象会导致网络通讯量急剧增大。使访问时间延长。所以在主页(homepage),不宜采用很大的图象。如果确实需要一些大图象,最好在主页中用一个缩小的图象指向原图,并标明该图的大小。这样读者可以快速地访问您的主页,自己选择看还是不看那些图象。
  图象的基本格式为:
   <img src="image-url">或<img src="image-urd" alt="text">image-url是图象文件的url。目前,大部分浏览器支持 .gif 和 .xbm文件,netscape还支持jpeg文件。alt属性告诉不支持图象的浏览器用text代替该图。

  4.3.2 图象与文本的对齐方式
    图象在窗口中会占据一块空间,在图象的左右可能会有空白,不加说明时,浏览器将随后的文本显示在这些空白中,显示的位置由align属性指定。
 
    用align=left,righr时,图象是一个浮动图象。比如align=left,图象必须挨着左边框,它把原来占据该块空白的文本“挤走”,或挤到它右边,或挤到它上下。
    文本与图象的间距用vspace=#,hspace=#指定,#是整数,单位是象素,前者指定纵向间距,后者指定横向间距。

  4.4 分行<BR>和禁止分行<nobr>
    <Br>表示在此处分行,<nobr>....</nobr>叫通知浏览器,其中的内容在一行内显示,若一行内显示不了,则超出部分被裁剪掉。
  <br clear=#>clear属性标明下一行的情况,如clear=left,表示下一行从左边界处开始。#可以是left,right,all之一。例:

  §4.5 背影和文本颜色
    窗口背景可以用下列方法指定
  <body background="image-url">
    <body bgcolor=# text=# link=# alink=# vlink=#>
    前者指定填充背景的图象,如果图象的大小小于窗口大小,则把背景图象重复,直到填满窗口区域。
  后者指定的是16进制的红、绿、兰分量。
  bgcolor 背景颜色
    Text 文本颜色
    Link 链接指针颜色
    alinik 活动的链接指针颜色
    vlinik 已访问过的链接指针颜色
    例 <body bgcolor=FFoooo>大红背景色.
    注意,此时体元素必须写完整,即用<body>结束

  4.6 转义字将与特殊字符
  html中< , >,&有特殊含义,(前两个字符用于链接签,&用于转义),不能直接使用。使用这三个字符时,应使用它们的转义序列。
     & 的转义序列为 & amps 或 & #38;
     < 的转义序列为 & Lt; & #60;
     > 的转义序列为 & gt; & #62;
  前者为字符转义序列,后者为数字转义序列。
  例如 & Lt; font &Lgt;显示为<font>若直接写为<font>则被认为是一个链接签。
  需要说明的是:
    a. 转义序列各字符间不能有空格;
    b. 转义序列必须以“;”结束;
    c. 单独的&不被认为是转义开始。
  如“ & Lt; ”被解释为 “& Lt;”而不是<
    “ 62 ;”被解释为 “& # 60;”而不是>
    另一个需要转义的字符是引号,它的转义序列为"""或""",例如
    <img src="http://www.webjx.com/htmldata/2005-02-20/image.gif"alt="A &quol; real " example">

    html使用的字符集是ISO &859 Larin-1字符集,该字符集中有许多标准键盘上无法输入的字符。对这些特殊字符只能使用转义序列。

时间: 2024-09-27 09:13:00

版面风格控制的相关文章

Photoshop把人物图片转为美漫风格海报

  Photoshop把人物图片转为美漫风格海报.美漫我想大家都不陌生,特点是比较粗旷,人物造型扎实,黑白对比强烈,画风视觉冲击力很强.这类风格控制得好的话,比较容易出效果. 原图 最终效果 1.新建一个PSD文件,尺寸按照你所选的图片大小而定. 2.拖入你选定的图片到画面中. 3.复制这个图片,然后先隐藏,后面需要用到. 4.对图像应用:滤镜 > 滤镜库 > 艺术效果 > 海报边缘,参数设置如下图. 5.对图像再次应用滤镜 > 滤镜库 > 艺术效果 > 木刻效果,参数

巧用Dreamweaver模板统一站点风格

话说阿蒙的主页建设的也差不多了,不过问题也出现了,为了使整个网站的风格保持一致,很多网页的版式都是相同的,但是每次都做一个版面风格相同的网页势必很麻烦,况且阿蒙本来就是一个懒人.鸣涧看不过去了,告诉阿蒙还是使用模板吧,这样可以方便许多. 阿蒙不解,模板是什么意思啊?打个比方吧,在一批版面风格类似的网页中,比如网页上面的标题.导航都是相同的,而下方的正文部分不同,那么就可以使用模板了,建模板可以将网页中无需变化的对象固定下来,然后再用来应用到其他风格类似的网页中.这样就可以实现,只修改部分页面就可

WPS 2012文字排版通用技巧点睛

  炫酷的WPS Office 2012终于来了,无论是界面还是全新操作模式都将新版的WPS装点得华丽无比.功能再丰富,离不开娴熟的操作技能;操作再简便,也离不开烂熟于心的经验.借助软件"生产"出啧啧称赞的页面才是最终归宿.请跟我一起来用各路招数编排一页文稿.要知道,只有精美的页面呈现在您的面前,那才是响当当的硬道理.我们边说边用,您来仔细体验WPS Office 2012文字给我们带来的方便与专业. 先来看看成品的页面,这是中英文混排的一个关于观测太阳的页面,页眉和页脚处是深蓝色的色

DIV+CSS制作专业信息网站的制作规范

css|规范 专业信息网站制作规范 一. 导航要求 在此站点的每一个页面都出现 内容包括:主页,网站介绍,站点视图,联系方式,反馈,搜索工具,常见问题解答,实际内容栏目(包括相关站点链接.新闻页) 栏目如果采用图标,下面应附有文字说明,以避免图像表达不清. 无任何链接内容的不做成按钮的形式 纯文本like用常用颜色.避免在链接处使用特殊的颜色.应该使用标准.醒目的颜色. 屏幕上显示的页面所对应的按钮应该相应变成灰色.突出显示或以其它方式表示出来. 每个页面都应包括: 版权及网站管理员的E-mai

菜鸟快速读懂HTML语言

HTML语言是网页制作的基础,是初学者必学的内容.虽然现在有许多所见即所得的网页制作工具,但是说到底,还是有必要了解一些HTML的语法.这样,您可以更精确的控制页面的排版,可以实现更多的功能.HTML语言可直接使用普通的文本编辑器进行编辑(例如:DOS下的EDITWindows中的记事本等). 小技巧:如何查看别人网页的HTML 你只要用浏览器(例如:IE)打开某网页(例如:),然后用鼠标右键点击网页中的空白位置,选择"查看源文件",此时这个网页的源文件就一览无遗了.如果遇到有些网页屏

设计案例浅析:浅谈“懒人”设计思路

文章描述:"懒人"设计思维. 设计师总会说设计是一件很累人的事,但这部分原因可能是你自找的.时间与设计出来的效果也并不一定成正比.平面设计师或许应该培养一种"懒人"设计思维,面对一个设计时,心里应该想着的只是如何以最简单的方式完成,出来的效果可能也会更出色,毕竟,简洁的设计往往也是最好的设计. 大多数的设计都会同时涉及到文字与图片,这两者的差异是非常大的,也很难事先预料到两者一起使用时的互相影响,图片与文字如何搭配得漂亮,往往也是设计师的一个很大的挑战,一不留神,就

CSS 循序渐进(二)字的艺术

css  说到CSS,笔者用的最多的还是它的排版和字型设计功能.因为网页嘛,最终还是要做给人家看的,要传递信息给对方的,所以不管怎么说,这种传递形式非常重要,具体说来,也就是字的控制和版面的控制.另外一个很重要的原因就是中文相当难处理,Windows自带的中文字库很少,而中文的美术效果又很难做,远不如英文那么随随便便写几个字就很舒服.所以借助CSS的帮助就更显得有必要.好,废话也不多说了.大家还是跟我一起看一看CSS到底对字能起些什么作用吧. 首先,给朋友们说说样式表关于字型的一些功能.总的说来

WPS2012文字排版通用技巧点睛

炫酷的WPS2012终于来了,无论是界面是全新操作模式都将新版的WPS装点得华丽无比.功能再丰富,离不开娴熟的操作技能;操作再简便,也离不开烂熟于心的经验.借助软件"生产"出啧啧称赞的页面才是最终归宿.请跟我一起来用各路招数编排一页文稿.要知道,只有精美的页面呈现在您的面前,那才是响当当的硬道理.我们边说边用,您来仔细体验WPS2012文字给我们带来的方便与专业. 先来看看成品的页面,这是中英文混排的一个关于观测太阳的页面,页眉和页脚处是深蓝色的色彩条,题目和页数使用了风格类似的形状快

“懒人”设计思维:以不变应万变

设计师总会说设计是一件很累人的事,但这部分原因可能是你自找的.时间与设计出来的效果也并不一定成正比.平面设计师或许应该培养一种"懒人"设计思维,面对一个设计时,心里应该想着的只是如何以最简单的方式完成,出来的效果可能也会更出色,毕竟,简洁的设计往往也是最好的设计. 大多数的设计都会同时涉及到文字与图片,这两者的差异是非常大的,也很难事先预料到两者一起使用时的互相影响,图片与文字如何搭配得漂亮,往往也是设计师的一个很大的挑战,一不留神,就会造成风格矛盾.细节冲突,对比错误.而且就算有一次