|
使用缩写可以帮助减少你 CSS 文件的大小，更加容易阅读。 css 缩写的主要规则如下： 颜色
16 进制的色彩值，如果每两位的值相同，可以缩写一半，例如： #000000 可以缩写为 #000;
#336699 可以缩写为 #369; 盒尺寸 通常有下面四种书写方法 : property:value1;
表示所
有边都是一个值 value1 ； property:value1 value2; 表示 top 和
bottom 的值是 value1,
right 和 left 的值是 value2 property:value1 value2 value3;
表示 top 的值是 value1 ，
right 和 left 的值是 value2 ， bottom 的值是 value3
property:value1 value2 value3
value4; 四个值依次表示 top,right,bottom,left
方便的记忆方法是顺时针，上右下左。
具体应用在 margin 和 padding 的例子如下： margin:1em 0 2em 0.5em;
边框 (border)
边框的属性如下： border-width:1px; border-style:solid;
border-color:#000;
可以缩写为一句： border:1px solid #000; 语法是 border:width style
color; 背景
(Backgrounds) 背景的属性如下： background-color:#f00;
background-image:url
(background.gif); background-repeat:no-repeat;
background-attachment:fixed;
background-position:0 0; 可以缩写为一句： background:#f00
url(background.gif)
no-repeat fixed 0 0; 语法是 background:color image repeat
attachment position;
你可以省略其中一个或多个属性值，如果省略，该属性值将用浏览器默认值，默认值为：
color: transparent image: none repeat: repeat
attachment: scroll position:
0% 0% 字体 (fonts) 字体的属性如下： font-style:italic;
font-variant:small-caps;
font-weight:bold; font-size:1em; line-height:140%;
font-family:"Lucida Grande",
sans-serif; 可以缩写为一句： font:italic small-caps bold
1em/140% "Lucida Grande",
sans-serif; 注意，如果你缩写字体定义，至少要定义 font-size 和 font-family
两个值。
列表 (lists) 取消默认的圆点和序号可以这样写 list-style:none;, list
的属性如下 :
list-style-type:square; list-style-position:inside;
list-style-image:url
(image.gif); 可以缩写为一句： list-style:square inside
url(image.gif);
如何制作超级链接书签 超级链接书签是什么东东？大家可以看一下下面地址给出的演示：
http://www.rudang.org/01.htm
点点上面的演示页面中的链接试试，应该知道了吧。
注意： 这种效果适合在内容比较多的页面中使用。
那么下面我来谈一下如何来制作超级链接书签：
大家可以用 DREAMWEAVER 或者记事本打开网页文件，然后把光标放到想插入超级链接标签的
一个位置，写入这么一段代码
<a name="01"></a>
说明：以上的 name 后面的参数自己根据自己的命名习惯来写。
好了，接下来就是做超级链接了。
在该页内的链接代码的写法是：
<a href="#01"> 链接描述文字 </a>
如果是外部页面链接该超级链接标签呢，其代码该怎么写？
假设该做了超级链接标签的页面的地址是 http://www.jianzhan8.cn/1.htm
那么超级链接的代码写法如下：
<a heaf="http://www.jianzhan8.cn/1.htm#01">
链接描述文字 </a>
通过以上的描述，想必大家都已经对超级链接标签的做法已经有了了解了，赶紧自己试试去。
弹出窗口的相关参数该怎么设置 现在制作弹出窗口好象没有多大意义，至少我这么认为，
尽管仍然有很多网页制作初学者对这个东东很感兴趣。
3721 上网助手，百度搜霸和 google 工具条等这些都已经具备了拦截弹出窗口的功能了，其实弹
出窗口的制作是很不人性化的，在没有征求访问者的许可下就强制弹出，这种做法是对访问者的
极度不尊重。
因为问这个问题的的人多了，我还是来说明一下吧。
弹出窗口的代码如下所示
<script>window.open(" 弹出页面地址 "," 窗口名字
","width=200,height=300")</script>
代码分析
弹出页面地址可以是相对路径也可以是绝对路径，窗口名字可以根据所弹出页面的内容确定，
width 是弹出窗口宽度， height 是其高度。
代码使用方法
把上面的实例代码根据自己的需要把有关参数修改成自己的，然后把代码插入网页源代码的 <head>
与 </head> 之间就可以了。
附加内容：点击超链接弹出一个窗口
点击这里查看演示效果
代码内容
<a style="cursor:hand" onclick='window.open("
弹出页面地址 "," 名字 ","width=300,
height=400")'> 超链接描述文字 </a>
其他的一些功能的实现方法需要大家自己去摸索，我的建议是，弹出窗口尽量别用。
如何实现透明 flash 动画效果 在讲解这个问题之前，首先让大家看看透明 flash 效果：
点击这里查看演示
效果是不是酷？当然很酷了，它其实有时候比 flash 的动画效果还要好，建议大家以后在网
页中如果放动画的话采用这种形式，通过演示页面大家其实已经看到了最终效果是通过一张背景图片和一个 flash
动画结合而成的，这对于维护来说是很方便的，只要把背景图片更新就可以了， flash 可以不动它的。
实现方法如下：
基于网页排版的实现方法
你可以先准备好一张图片和一个适合做透明效果的 flash ，然后打开 DREAMWEAVER
中新建一个网页，插入一个一行一列的单元格，单元格的规格大小和事先准备好的图片宽高一样，然后把这个图片设为单元格的背景图片，设置完了后，在这个单元格中插入准备好的
flash 了，其中 flash 的大小规格也应该调成和单元格一样大小。用鼠标选中 flash
后，把网页编辑状态由“设计”切换到“代码中，你会看到 flash 部分在源代码中都变成了黑色了，代码实例如下：
<object
classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.
cab#version=6,0,29,0"
width="470" height="180">
<param name="movie" value="0.swf">
<param name="quality" value="high">
<embed src="0.swf" quality="high"
pluginspage="http://www.macromedia.com/go/getflashplayer"
type="application/x-shockwave-flash" width="470"
height="180"></embed>
</object>
在以上代码中插入这么一段代码： <param name="wmode"
value="transparent"> ，完整代码如下：
<object
classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.
cab#version=6,0,29,0"
width="470" height="180">
<param name="movie" value="0.swf">
<param name="wmode" value="transparent">
<param name="quality" value="high">
<embed src="0.swf" quality="high"
pluginspage="http://www.macromedia.com/go/getflashplayer"
type="application/x-shockwave-flash" width="470"
height="180"></embed>
</object>
基于 CSS 排版 把核心思想把握，在有背景图片的 DIV 标签中再插入 flash ，然后对 flash
部分加入以上代码就行了。 怎么解决网页页中出现乱码问题 很多网友反映他的制作的网页打开后出现了乱码，他们问我有没有解决方案。
既然问到了这个问题，下面我就来谈一下：
首先在你的网页代码的 <head> 与 </head>
之间查看一下没有有下面这段代码
<meta http-equiv=Content-Type
content=text/html;charset=gb2312>
看到了上面代码中的 charset=gb2312 么？它表示强制浏览器编码设为简体中文 (GB2312)
，很多朋友在编写网页的 html 语言的时候，把这段代码给落下了。现在 Windows 的 IE6.0 又支持简体中文
(GB18030) ，是采用 1/2/4 Bytes 混合编码，但它并不会完全兼容 GB2312
，要是以前低版本的浏览器，不写这段代码都没有问题的。
如果你的网页代码中缺少这个东东，那就赶紧补上吧！
如果我的网页代码中已经有了这段代码依旧出现了乱码，该怎么办？
这应该不会是你的网页原因，是浏览器的设置造成的。依次点击 浏览器上部菜单中的“查看” 》“编码”
，然后看浏览器选中的语言支持是简体中文 (GB2312) 么？如果不是那就赶紧调整为简体中文 (GB2312) 。
怎么改变超级连接的颜色和去掉其下划线 如果你网页的链接没有通过样式表 css
来控制的话，在默认状态下链接描述文字是蓝色的并且文字下面带有下划线的，访问过的链接描述文字会变成淡紫色。
那么下面，我来教大家使用 css 来打造自己的个性链接形式。
先在网页代码中 <head> 与 </head> 之间插入下面代码
<style type="text/css">
<!--
A:link {
color:blue; text － decoration: none
}
A:visited {
color:red; text － decoration:line － through
}
A:active {
color:white; text － decoration:underline
}
A:hover {
color:yellow;text － decoration:none;background －
color:black
}
-->
</style>
代码分析
A:link {color:blue; text － decoration: none}
是说明了超级链接还没有被访问，它没有下划线，颜色为蓝色。
A:visited {color:red; text － decoration:line －
through} 说明了超级链接被访问后，它的颜色变成了红色，有了一根删除线。
A:active {color:white; text － decoration:underline}
说明超级链接处于活动状态的时候，它的颜色变成了白色，有了下划线。
A:hover {color:yellow;text －
decoration:none;background － color:black}
说明鼠标移动到超级链接后，它没有下划线，文字颜色变成了黄色，背景颜色是黑色。
上面的颜色代码使用了英文，也可以使用 16 进制表示方法，希望大家能够根据上面的代码分析内容自己举一反三。
空格键和回车键使用说明 空格键和回车键的使用在网页设计中为网页制作初学者增添了不少麻烦，我想给大家系统地说明一下。
空格键的使用说明
首先得把一些常识性东西给大家说明一下，英文字母和数字是占一个字节，而中文汉字是占两个字节的，大凡学过计算机文化基础的朋友都应该清楚这一点的。输入法有全角和半角两中状态，在全角状态下输入一个空格键会空两个字节，相当于空一个汉字的效果；在半角状态下输入一个空格键会空一个字节，相当于空一个字母的效果。
中国人有个排版习惯，喜欢在每行文字的开头空出两个汉字的位置，你可以把输入法调整到全角状态，然后输入两个空格就可以了。但是有的朋友会问，我输入四个半角状态下的空格可以么？大家可以实际操作一下，你会发现每行开头半角状态下的空格根本输入不了。那半角状态下的空格在什么时候有效果，只有当它的前面有实际文字时才可以使用，并且只可以输入一个空格。
回车键的使用说明
使用回车键换行，这是大家都知道的操作。在 dreamweaver
默认的状态下，当大家使用回车键换行时，会发现行间距很大。有没有一种方法来实现使用回车键换行时减小行间距呢？有！其实大家使用的是“硬回车”，也就是在换行时直接输入“
Enter ” , 你不妨试试“软回车”，它是通过组合键“ Enter+Shift ”来实现的。
关于控制行间距的拓展说明：
其实采取“软回车”是一种取巧的方法，如果想精确控制行间距，最好是通过 css
来控制，它能精确到像素，下面简单说明一下使用 css 来控制行间距的方法。
有一段文字，它的代码是 <span class="style1"> 文字内容
</span> ，在 css 样式表中 style 的描述代码如下所示 .style {font-size:
12px;line-height: 18px} .
代码分析
.style 中 font-size 是控制文字大小的，参数是 12px ， line-height
这个就是控制行间距的了，参数是 18px 。
大家可以在实际操作中，根据自己的需要来调整参数的数值。 怎么区分相对路径和绝对路径
文章作者：柳焕斌 文章所属类别：常见问题 文章增加日期： 2005-5-27
这是个问题么？很多网页制作初学者仍然向我咨询，我个人也觉得很有必要来弄清楚这个问题。
下面我主要是通过实际实战来给大家解释说明一下相对路径和绝对路径的区别。
你在自己的电脑上创建了一个名字为 WEB 的文件夹用于来存放所有的网页文件， WEB 文件夹中有一个
index.htm 的网页文件和一个名字为 01 的文件夹，其中 01 文件夹里面有一个名字为 1.htm 的网页文件。
注意：一些特效代码一般说明是可以在某段具体指名标签的范围之间的任何位置（ <head> 与
</head> 之间或者是 <body> 与 </body>
之间），但是千万别插入已经的代码的尖括号中，这样特效不会有效，并且也会使已有的代码出现错误。
下面来解释一下绝对路径的问题。
比如你现在有一个虚拟主机，这个虚拟主机绑定的域名是 www.jianzhan8.cn
，那么你就可以在浏览器里通过输入 http://www.jianzhan8.cn
来访问你的网站了。先在我们把上面的例子中的网页文件全部上传到虚拟主机中，那么我们得出 index.htm 在因特网上的绝对地址是
http://www.jianzhan8.cn/index.htm, 网页文件 1.htm 的绝对地址就是
http://www.jianzhan8.cn/01/1.htm ，由 index.htm 链接描述指向 1.htm
使用绝对路径的代码写法是
<a href="http://www.jianzhan8.cn/01/1.htm"> 链接描述
</a> ，由 1.htm 链接描述指向 index.htm 使用绝对路径的代码写法是 <a
href="http://www.jianzhan8.cn/index.htm"> 链接描述 </a> 。
关于路径使用的建议
如果是站内文件，建议使用相对路径，因为它比绝对路径的代码短，另外相对位置也比较容易找，使网站维护比较方便。至于绝对路径，一般是做外部资源链接的时候才使用的。
<< 网页制作指导首页 >> 常见问题 怎么给网页加上背景音乐
当访问者打开你的网站，让他 / 她欣赏一首优美的歌曲，是个不错的选择。
很多朋友向我问过如何在网页中加入背景音乐，这其实很简单。你只需在网页的源代码的 <body> 与
</body> 之间插入下面的代码：
<bgsound src="http://www.abc.com/1.mid"
loop="-1">
代码分析
http://www.abc.com/1.mid 为音乐文件的绝对地址
loop="-1" 此属性控制背景音乐播放次数， "-1"
为不间断循环播放，请用相应的数字来控制其播放次数，如果是 1 就表示该背景音乐播放一次就停止了
怎样找出网上音乐文件的绝对地址
你可以先找到音乐文件的链接描述，然后把鼠标放在它的上面，点击鼠标右键，把该链接的属性调出来，然后把 URL
部分复制下来就可以了，你复制的地址就是音乐文件的绝对地址。
关于背景音乐的选择建议
上面代码实例中采用的是以 .mid
为后缀的音乐文件，建议大家在网页中加入背景音乐的时候尽量采用这种格式的音乐文件。以 .mid 为后缀的音乐文件很小，一般也就几百 K
，音质很不错，下载时间很段，一般情况下，打开网页就可以听到了音乐了。如果采用以 .mp3 或者 .rm
格式的音乐文件作为背景音乐，由于其文件比较大， mp3 一首音乐的大小为 3~4M
左右，下载时间比较长。别人已经看完网页的文字信息，背景音乐可能还没有播放出来。
哪些网站适合使用背景音乐
一般来说个人网站比较适合加入背景音乐，音乐的选择很能体现站长的个性相关的一些东西。对于企业网站或者带有商业性质的网站来说不适宜采用背景音乐，因为背景音乐影响了网站的严肃性。
另外说明一下，实现背景也有其他的一些方法，比如通过 javascript
也能实现背景音乐播放的效果，这里就不做介绍了，本文介绍的一个比较容易掌握和理解的方法。 怎么给网页添加网页特效
网页中加入一些特效，往往能激活网页的气氛，下面主要来说说如何在网页中加入网页特效。
首先来看一下网页源代码的结构形式：
<html>
<head>
<title> 网页的标题 </title>
<style type="text/css">
<!--
.style1 {font-size: 12px;color:
#990000;line-height:18px}
-->
</style>
< /head>
<body>
</body>
</html>
以上是一个比较精简的网页代码例子。
一般来说，大家上一些介绍关于网页特效的网站的时候，特效代码都是现有的，你只需要将其插入代码中相应的位置就可以了。特效代码都是用
javascript 编写的，插入网页中的位置大部分都是 <head> 与 </head> 之间或者是
<body> 与 </body> 之间。
那么现在我在 index.htm 上有一个链接描述的连接是指向网页文件 1.htm
的，那么我们可以通过相对链接的形式来实现，在 index.htm 文件的源码中链接描述应该是： <a
href="01/1.htm"> 链接描述 </a> 其中 01/1.htm 就是 1.htm 相对于
index.htm 的路径。那么从 1.htm 链接向 index.htm ，这样的路径描述应该怎么写呢？首先请大家看一下代码：
<a href="../index.htm"> 链接描述 </a>
大家会看到链接路径中出现了两个点，这里我们使用了父路径，两点的意思是返回上一级文件夹，依次类推，返回多少个上一级文件夹就应该出现多少个两点。到这里相对路径就已经解释完毕了。
| 
手机:13051360792
:010-51286369
:645311092
版权所有2007商机中国 京ICP证060865号