BlueOrange(蓝橙)

最近写CSS成了家常便饭，几乎每天就要出一个大的首页页面的设计和制作。
和同事交流起来，发现有一些标签层次问题是值得一提的。

1.整个页面定义了a和a:hover等的颜色之后，你再想定义某标记中的a的颜色就无法实现。
解决方法是，在该标签的外面加上id或class（要多层准备定位至这个类，一层的类仍然无法改变字体颜色。），把这个a标记包括起来定义。颜色的效果自然就出来了。

<table id="links">

<tr>

<td>

<a href="#">链接文字</a>

</td>

</tr>

</table>

样式定义为

：#links a

{

color:#a00;

}

2.将class定义在a标记里面，不能像平常习惯那样写成".classname a"，而应该按标记的顺序来写，因为此class是属于a的下一层。如，该a的标记外面还有一个div，div运用了一个叫“sub1”的ID。而该a标记里面运用了“bluec”类:

<div id="sub1">

<a class="bluec" href="#">链接文字</a>

</div>

这个样式应该这样写：

#sub1 a.bluec

{

somestyle;

}

3.如果你在样式中定义了某一标记的整体样式，如ul li{margin-left:10px; font-size:14px;}。但在应用到该CSS文件的页面中，有可能再用到一个不需要14px大小文字，或是不需要外框距的清单(ul li)。那么，同第1点一样，你需要另设一个ID，来详细定位到这个ul li。
或是将你之前定义的ul li标记的整体样式分部到各个具体需要这个样式的类或标记中去。
综合上说，就是在定义CSS样式表中，要慎重使用标记的整体样式。这才是顾全大局的作法。
我个人认为，不要在乎层次的繁琐，但要在乎位置的精确和命名的可识别性，也就是整个样式的规范性。

CSS2.0中对样式、标记的标准有了新的要求。但要如何把页面的类分配开来，如何真实的确定到定义某一个类名，某一个样式的层次，还没有这类统一的规则。
在此时，我只能通过一些过程来规范和统一自己的样式定义。
其实，看起我自己的样式代码来，不在其中的人，根本也是头大。
但我已经有我的习惯和自己的标准了，总会随着它的优化，和我自己的进步，发展到比较好的方向。
像是如果有真正实用的标准出来了，我的也许就近似呢？哈哈~~标准不还都是人用脑子综合起来的么~~~

下一篇，我将讲述一下我自己的定义，命名，层次使用习惯。
其实现在在公司，同事也在按我的方法去做，不过我那么繁杂的要求，还未能完全得到认可。
总之先按自己总结的走下去吧。

Fireworks中自带有虚线：三条破折线、加粗破折线、双破折线、基本破折线、实边破折线、点状线。
在网页设计中，我通常的用的是实边破折线。因为它和网页CSS中border的dotted、dashed两个参数效果相似。在制作网页时，不需要导出切割图片，而是用CSS定义。
但有时候需要效果，如：只是为了网页而设计图时；或是为了设计更有特色的网页设计图时。我们还需要用到其他的虚线。自带的那些，怎么看都觉得不够是不是？

这里有两种方法：

一是，画一个1像素高的矩形（边宽为0，填充所需色），然后给它添加纹理，纹理总量设为100%。
以下是一般可用的1像素高的纹理虚线效果图：

（说明：高于1像素的要多一个步骤：按Ctrl+Alt+Shift+Z把矩形转换成位图后，再把上面多余的黑色线删除。）
其实还有许多纹理，你不妨都去试一下“饼干”、“点”这些都是有效果的。
如果要画的不是横线而是纵线的话方法也有三：
1.选择“水平线”等可以直接出现虚线的纹理；
2.转成位图，然后旋转90度；
3.把矩形宽度用1个像素以上，直至出现虚线后，再转位图，去多余线。

二是，同上画一个矩形，然后在“填充-图案-其他”中选择自己画好的线段
通常也是1像素高的gif文件，按你需要的虚线形式，用画笔或是线段工具画一个几个像素宽的虚线。
要注意的是，按这个图案填充的矩形，如果你觉得效果不满意，想要改一下，也有两个方法：
1.在FW中图案真充是有一个填充拉伸杆的，拉伸这个杆，调整出你想要的效果；
2.如果填充杆依然要不到你想要的效果就改外部gif文件。但要另存为一个文件名，再在FW中把矩形的填充重新选一下。因为，你直接把填充外部文件的样式改了后，FW文件中的填充矩形是不会跟着外部文件改的。

发现自己还是经验不够，关键在于之前只是理论上懂一些，一直没有去真实的校验过（也许是不敢吧）
昨晚总算是鼓足勇气，把自己尝试做的新XHTML主页发到http://validator.w3.org/ 去校验了。
经过两次校验，才终于通过了。看到这个绿色牌牌的时候，很高兴^^

同时发现了自己之前不知道的东西，也许专业人的大家都知道了吧，所以也就不要笑话我。
就当我这只是总结给自己看的好了：
1.图片插入img一定要有alt，在DW中叫“替换”。
也就是图片不能正常显示时所替代的文字描述。
在标准的XHTML中，插入的图片都是要求表示其页面内容的。所以，不可能哪个无法描述的图片还出现在页面代码中。没有alt就是错误的。
其实之前我有注意到这点，只是插起图来，有时候又给忽略了。
2.target="_blank"现在不能用了，改用"new"，或是外部JS脚本打开新页面。
这个知识只要搜一下，就可以找到详细的解决方案，我就不加花说明了。
3.高height、宽width、边框border，这样的代表设计的性属已经不能出现在XHTML网页中了。
以前最先知道XHTML的时候我就听说过的，怎么又会把这东东给忽略了呢？
4.还有几个单边的标记忘了给加上关闭记号" />"，就是head里面的几个。因为平时不常去改动，所以没注意^^
5.页面属性中，不可以有非允许的半角字符，像是“:”、“"”、“/”。
我的解决方案是，把前两者转成全角，后者嘛，改成“”:D
6.属性，都用上引号吧，而且要用双引“"…"”
其实我没出这样的问题，只是后来再看了看常有问题，又给提示一下自己这一点了。

关于路径，以前总是碰到各种问题需要调改，改过之后又给忘。
没有去网上搜大文章，懒得为这样的小问题看那么多文字了。
自己找点时间总结一下吧（这里讨论的当然都是相对路径）：

页面中的文件路径

网页中的文件路径是以网页所在的文件为基准的。
嵌入式框架(iframe)的文件路径
该网页的路径只基于本网页路径，不管被嵌入哪个页面中去，其文件路径还是相对于被嵌入的文件本身的路径而言的。
交互式网页中的include文件
include文件，只是把一段外部的代码以源代码的形式插入网页中。因此，include中的文件路径，是以插入的网页为基准。
比如有根目录下面的pages文件夹中的index.htm中插入的include文件bn.htm，其内容是这样的：

<div>
<img src="banner.jpg" border="0" />
</div>

则插入的这张banner图片地址就是在pages文件夹下面的banner.jpg图片。
如果其他网页中插入了这个bn.htm文件，那么，插入的图片应该就是其他网页所在的目录的同级图片文件。

CSS里的文件路径

外联式
一般就是图片和自定义鼠标的路径。外联式的路径就以该CSS文件所在的为基准。如css目录下面的allstyle.css文件中有如下样式：

body
{
background:#eee url("../images/bgpic.gif") repeat-x;
}

就是CSS文件所在的目录的同级目录images下面的图片作背景图。不管是哪个路径的网页链接了这个外部allstyle.css文件，这个网页的背景图都是与css目录平级的images目录下面的bgpic.gif图片。
嵌入式和内联式
这与一般的网页中的路径中相同，以网页所在的位置为基准。

在XHTML中运用到list的机会很多。导航、菜单、列表都会用到如ul、ol这类的list标记。

好久没有操手XHTML了，这几天忙制作倒是没闲过。在List的运用中，有一些自己新发现的问题，但其实本就是存在解决方案，而我一直都是忽略带过了。

一、用图片作符号。

在运用列表中，常用到图片作为type标记点。把type设在li中作为背景图片，靠左，并且不重复，y轴上的位置根据point的大小来定位。然后再给li设定一个内距。如下:
.mylist ul li
{
background:url(images/li_point.gif) no-repeat left 3px;
}

虽然这样在浏览中，所需要的效果就已经出来了。但是，在DW的设计页中，常常可以看到一个黑点点(type)还会在li的左边出现，把本身定了宽的li拉长10多个像素。

DW在不能识别所有css参数的时候，会出现效果上的误差。要解决这样的问题其实很简单，在类中加上一句:
list-style-type:none;

2.关于ol和ul。

其实我对list还没有完全去了解CSS帮助文件中的内容。ol和ul的区别在哪也不清楚。不过，在制作过程中发现了一个问题，ol在去掉margin和padding之后，本有的数字符号就不见了。ul的lower-roman也是同样。

嗯，我是够懒的，其实很早就应该发现解决方案的。CSS2.0帮助文件中有关于list-style-type的介绍，想要自设marin和padding又不影响符号效果，只要如下就可以:
list-style : disc inside ;
list-style-type : disc ;

啊呀，真是我的失误，以后细心一点，勤快一点行不行啊？

运行 Visual Basic 应用程序的编辑器 【Alt】+【F11】
启动「这是什么?」帮助 【Shift】+【F1】
回复到上一个动作 【Ctrl】+【Z】
回复到上一个动作 【Alt】+【BackSpace】
复制选取的物件并置于「剪贴簿」中 【Ctrl】+【C】
复制选取的物件并置于「剪贴簿」中 【Ctrl】+【INS】
将指定的属性从另一个物件复制至选取的物件 【Ctrl】+【Shift】+【A】
剪下选取的物件并置于「剪贴簿」中 【Ctrl】+【X】
剪下选取的物件并置于「剪贴簿」中 【Shift】+【DEL】
删除选取的物件 【DEL】
将「剪贴簿」的內容贴到图文件內 【Ctrl】+【V】
将「剪贴簿」的內容贴到图文件內 【Shift】+【INS】
再制选取的物件并以指定的距离偏移 【Ctrl】+【D】
重复上一个动作 【Ctrl】+【R】
回复到上一个复原的动作 【Ctrl】+【Shift】+【Z】
打开「大小泊坞窗口」 【Alt】+【F10】
打开「缩放与镜像泊坞窗口」 【Alt】+【F9】
打开「位置泊坞窗口」 【Alt】+【F7】
打开「旋转泊坞窗口」 【Alt】+【F8】
包含指定线性度量线属性的功能 【Alt】+【F2】
启动「属性列」并跳到第一个可加上标签的项目 【Ctrl】+【ENTER】
打开「符号泊坞窗口」 【Ctrl】+【F11】
垂直对齐选取物件的中心 【C】
水平对齐选取物件的中心 【E】
将选取物件向上对齐 【T】
将选取物件向下对齐 【B】
将选取物件向右对齐 【R】
将选取物件向左对齐 【L】
对齐选取物件的中心至页 【P】
将物件贴齐格点 (切换式) 【Ctrl】+【Y】
绘制对称式多边形；按两下即可打开「选项」对话框的「工具箱」标签 【Y】
绘制一组矩形；按两下即可打开「选项」对话框的「工具箱」标签 【D】
为物件新增填色；在物件上按一下并拖动即可应用渐变填色 【G】
将物件转换成网状填色物件 【M】
绘制矩形；按两下这个工具便可建立页面框架 【F6】
绘制螺旋纹；按两下即可打开「选项」对话框的「工具箱」标签 【A】
绘制橢圆形及圆形；按两下这个工具即可打开「选项」对话框的「工具箱」标签 【F7】
新增文字；按一下页面即可加入美工文字；按一下并拖动即可加入段落文字 【F8】
擦拭一个图形的部份区域，或将一个物件分为两个封闭的路径 【X】
在目前工具及「挑选」工具间切换 【空格】
绘制曲线，并对笔触应用预设效果、笔刷、喷洒、书写式或压力感应效果 【I】
选取最近使用的「曲线」工具 【F5】
编辑物件的节点；按两下工具在所选取物件上选取全部节点 【F10】
将选取的物件放置到最后面 【Shift】+【PageDown】
将选取的物件放置到最前面 【Shift】+【PageUp】
将选取的物件在物件的堆叠顺序中向后移动一个位置 【Ctrl】+【PageDown】
将选取的物件在物件的堆叠顺序中向前移动一个位置 【Ctrl】+【PageUp】
选取整个图文件 【Ctrl】+【A】
打散选取的物件 【Ctrl】+【K】
解散选取物件或物件群组所组成的群组 【Ctrl】+【U】
将选取的物件组成群组 【Ctrl】+【G】
将选取的物件转换成曲线；「转换成曲线」可提供更多更有弹性的编辑功能 【Ctrl】+【Q】
将外框转换成物件 【Ctrl】+【Shift】+【Q】
组合选取的物件 【Ctrl】+【L】
打开「拼字检查器」；检查选取文字的拼字是否正确 【Ctrl】+【F12】
依据目前选取区域或工具显示物件或工具属性 【Alt】+【ENTER】
将标准填色应用至物件 【Shift】+【F11】
将渐层填色应用至物件 【F11】
打开「外框笔」对话框 【F12】
打开「外框色」对话框 【Shift】+【F12】
以大幅微调的设定值将物件向上微调 【Shift】+【↑】
将物件向上微调 【↑】
以大幅微调的设定值将物件向下大幅微调 【Shift】+【↓】
将物件向下微调 【↓】
以大幅微调的设定值将物件向右微调 【Shift】+【←】
将物件向右微调 【←】
以大幅微调的设定值将物件向左微调 【Shift】+【→】
将物件向左微调 【→】
储存作用中绘图 【Ctrl】+【s】
打开一个现有的绘图文件 【Ctrl】+【O】
打印作用中图文件 【Ctrl】+【P】
将文字或物件以另一种格式输出 【Ctrl】+【E】
输入文字或物件 【Ctrl】+【I】
建立一个新的绘图文件 【Ctrl】+【N】
打开「编辑文字」对话框 【Ctrl】+【Shift】+【T】
将文字变更为垂直 (切换) 【Ctrl】+【.】
变更文字为水平方向 【Ctrl】+【,】
设定文字属性的格式 【Ctrl】+【T】
新增/删除文字物件的项目符号 (切换式) 【Ctrl】+【M】
将美工文字转换成段落文字，或将段落文字转换为美工文字 【Ctrl】+【F8】
将文字对齐基准线 【Alt】+【F12】
重绘绘图窗口 【Ctrl】+【w】
在最后两个使用的检视品质间互相切换 【Shift】+【F9】
以全屏幕预览的方式显示图文件 【F9】
执行显示比例动作然后返回前一个工具 【F2】
打开「检视管理员泊坞窗口」 【Ctrl】+【F2】
按下并拖动这个工具便可平移绘图 【H】
缩小绘图的显示比例 【F3】
显示绘图中的全部物件 【F4】
仅放大显示选取物件的比例 【Shift】+【F2】
显示整个可打印页面 【Shift】+【F4】
将绘图向上平移 【Alt】+【↑】
将绘图向下平移 【Alt】+【↓】
将绘图向右平移 【Alt】+【←】
将绘图向左平移 【Alt】+【→】
打开「滤镜泊坞窗口」 【Alt】+【F3】
打开设定 CorelDRAW 选项的对话框 【Ctrl】+【J】
打开「图形与文字样式泊坞窗口」 【Ctrl】+【F5】
到上一页 【PageUp】
到下一页 【PageDown】
将字体大小缩减为前一个点数 【Ctrl】+数字键盘【2】
将字体大小缩减为「字体大小列表」中的前一个设定 【Ctrl】+数字键盘【4】
将字体大小增加为「字体大小列表」中的下一个设定 【Ctrl】+数字键盘【6】
将字体大小增加为下一个点数 【Ctrl】+数字键盘【8】
文字编辑
　
变更文字对齐方式为不对齐 【Ctrl】+【N】
变更文字对齐方式为强迫上一行完全对齐 【Ctrl】+【H】
新增/删除文字物件的首字放大 (切换式) 【Ctrl】+【Shift】+【D】
变更文字对齐方式为完全对齐 【Ctrl】+【J】
变更文字对齐方式为向右对齐 【Ctrl】+【R】
变更文字对齐方式为向左对齐 【Ctrl】+【L】
变更文字对齐方式为置中对齐 【Ctrl】+【E】
变更选取文字的大小写 【Shift】+【F3】
显示非打印字符 【Ctrl】+【Shift】+【C】
将文字的脱字号 (^) 移至框架终点 【Ctrl】+【END】
将文字的脱字号 (^) 移至框架起点 【Ctrl】+【HOME】
将文字的脱字号 (^) 移至文字起点 【Ctrl】+【PageUp】
将文字的脱字号 (^) 移到文字终点 【Ctrl】+【PageDown】
将文字的脱字号 (^) 向上移一段 【Ctrl】+【↑】
将文字的脱字号 (^) 向上移一个框架 【PageUp】
将文字的脱字号 (^) 向上移一行 【↑】
将文字的脱字号 (^) 向下移一段 【Ctrl】+【↓】
将文字的脱字号 (^) 向下移一个框架 【PageDown】
将文字的脱字号 (^) 向下移一行 【↓】
删除文字脱字号 (^) 右方单字 【Ctrl】+【DEL】
删除文字脱字号 (^) 右方字符 【DEL】
选取文字脱字号 (^) 右方单字 【Ctrl】+【Shift】+【←】
选取文字脱字号 (^) 右方字符 【Shift】+【←】
选取文字脱字号 (^) 左方单字 【Ctrl】+【Shift】+【→】
选取文字脱字号 (^) 左方字符 【Shift】+【→】
选取上移一段的文字 【Ctrl】+【Shift】+【↑】
选取上移一个框架的文字 【Shift】+【PageUp】
选取上移一行的文字 【Shift】+【↑】
选取下移一段的文字 【Ctrl】+【Shift】+【↓】
选取下移一个框架的文字 【Shift】+【PageDown】
选取下移一行的文字 【Shift】+【↓】
选取至框架起点文字 【Ctrl】+【Shift】+【HOME】
选取至框架终点文字 【Ctrl】+【Shift】+【END】
选取至文字起点的文字 【Ctrl】+【Shift】+【PageUp】
选取至文字终点的文字 【Ctrl】+【Shift】+【PageDown】
选取至行首文字 【Shift】+【HOME】
选取至行首文字 【Shift】+【END】
将文字的脱字号 (^) 移至行首 【HOME】
将文字的脱字号 (^) 移至行尾 【END】
将文字的脱字号 (^) 向右移一个字 【Ctrl】+【←】
将文字的脱字号 (^) 向右移一个字符 【←】
将文字的脱字号 (^) 向左移一个字 【Ctrl】+【→】
将文字的脱字号 (^) 向左移一个字符 【→】
打开「选项」对话框并选取「文字」选项页面 【Ctrl】+【F10】
寻找图文件中指定的文字 【Alt】+【F3】
显示图文件中所有样式的列表 【Ctrl】+【Shift】+【S】
变更文字样式为粗体 【Ctrl】+【B】
变更文字样式为有底线 【Ctrl】+【U】
变更全部文字字符为小写字母 【Ctrl】+【Shift】+【K】
变更文字样式为斜体 【Ctrl】+【I】
显示所有可使用或作用中的粗细变化 【Ctrl】+【Shift】+【W】
显示所有可使用或作用中的字体列表 【Ctrl】+【Shift】+【F】
显示所有可使用或作用中的 HTML 字体大小列表 【Ctrl】+【Shift】+【H】
将字体大小缩减为前一个点数 【Ctrl】+数字键盘【2】
将字体大小缩减为「字体大小列表」中的前一个设定 【Ctrl】+数字键盘【4】
将字体大小增加为「字体大小列表」中的下一个设定 【Ctrl】+数字键盘【6】
将字体大小增加为下一个点数 【Ctrl】+数字键盘【8】
显示所有可使用或作用中的字体大小列表 【Ctrl】+【Shift】+【P】

CD10:
菜单：
tools->customization，出现自定义对话框
customization->commands->右边的SHORTCUT KEYS标签
右下方VIEW ALL，就可以看到了，之后可以打印，也可以输出为execel可以打开的csv格式。

[摘合至“蓝色理想-经典论坛”]