仓酷云

标题: 来一发CSS使用技能十四例 [打印本页]

作者: 萌萌妈妈 时间: 2015-1-16 00:20
标题: 来一发CSS使用技能十四例
你的设计不仅仅用于web浏览器，也可以发布在其他设备上，比如PowerPoint。
CSS是CascadingstyleSheets的简称，中文译作“层叠款式表单”，我把它叫作“层叠款式表”，我感应如许顺口一点，没其余意义。实践上它是一组款式。你大概对CSS这个名词对照生疏，实践上不管你用InternetExplorer仍是NetscapeNavigator在网上冲浪，几近随时都在与CSS打交道，在网上没有利用过CSS的网页大概欠好找。不论你用甚么工具软件制造网页，都有在成心偶然地利用CSS。用好CSS能使你的网页加倍简练，为何一样内容的网页，有的人做出来有几十KB，而妙手做出来只要十几KB，CSS在个中的感化是不问可知的。我把我在利用CSS中的一些小履历和一些网友来信发问的成绩收拾出来，供诸位参考。

1、CSS在网页制造中一样平常有三种体例的用法，那末详细在利用时该接纳哪一种用法？
　　当有多个网页要用到的CSS，接纳外连CSS文件的体例，如许网页的代码年夜年夜削减，修正起来十分便利；只在单个网页中利用的CSS，接纳文档头部体例；只要在一个网页1、两个中央才用到的CSS，接纳行内拔出体例。

2、CSS的三种用法在一个网页中要以混用吗？
　　三种用法能够混用，且不会形成凌乱。这就是它为何称之为“层叠款式表”的缘故原由，扫瞄器在显现网页时是如许处置的：先反省有无行内拔出式CSS，有就实行了，针对本句的别的CSS就不往管它了；其次反省头部体例的CSS，有就实行了；在前二者都没有的情形下再反省外连文件体例的CSS。因而可看出，三种CSS的实行优先级是：行内拔出式、头部体例、外连文件体例。

3、在Dreamweaver中怎样使内部文件式CSS？
　　在Dreamweaver中利用外连文件式CSS并没有特别请求，一样是用记事本创立一个*.css文件，在网页的<head>与</head>之间加上一句如许的代码：<linkrel="stylesheet"href="在这里填上你的CSS文件地点（绝对路径+文件名）"type="text/css">就好了。

4、怎样用Dreamweaver疾速创立CSS外连式文件？
　　关于一个初打仗CSS的网页计划职员来说，要用记事之类的编纂器，往创立一个CSS外连式文件是相称坚苦的。因为Dreamweaver对CSS撑持的很好，用它来匡助就轻松多了。详细能够如许操纵：
　　1）先在纸上写幸亏网站的网页中大概要用到的格称号，然后在Dreamweaver的编纂窗中修改CSS面板，一个一个地界说，并在一个空缺页上得当地写一点相干内容，边界说边试用，效果不中意，当即修正；
　　2）全体界说好后，再用记事本创立一个空的CSS外连式文件，把在<head>与</head>之间的那段界说好的CSS复制到CSS文件中往，就半途而废了。全部历程就是点鼠标，便利吧？

5、在Dreamweaver中接纳行内拔出式CSS要手动写代码吗？
　　不必！先用CSS面板界说好要用的CSS，然后，在要拔出CSS的标志拔出：style=""，再把你方才界说的CSS从<head>前面拖到这个双引号中来，把花括号之外的部分删往就好了。

6、在方档头部体例和外连文件体例的CSS中都有“
</style>
　　在要用时拔取那段笔墨，再在CSS面板上点一下“bgstyle”就好了。

8、怎样给部分笔墨加背景图象？
　　与加背景致操纵相似，中是在背景在选择加载图像就是了，一个界说好的加背景图像的CSS例子的代码是如许的：
<styletype="text/css">

</style>
　　在要用时拔取那段笔墨，再在CSS面板上点一下“imgbgstyle”就好了。

9、怎样使页面的背景在笔墨“转动”时背景图案运动不动？
　　要使背景图案不随笔墨“转动”的CSS是如许的：
<styletype="text/css">

</style>

10、怎样界说字间距？
　　在DW3中CSS的属性界说对话框（styleDefinitionfor.style1)的“Block”上的“letterspaceing”属性界说的就
是字间距，它指的是每个字符之间的分外间距，经长度为单元，正负值都可，当取负值时发生字符挤在一同的效果。下
面代码是一个界说好的字间距CSS例子：
<styletype="text/css">

</style>

11、怎样给笔墨加上划线、下划线、删除线和闪灼？
　　在DW3中CSS的属性界说对话框(styleDefinitionfor.style1)的“Type”上的“decoration”属性界说的就是这些内容，要注重的是闪灼属性有些版本的扫瞄器不撑持，罕用为好。上面是一个界说好上述效果的CSS例子：
<styletype="text/css">

</style>
　　个中：“underline”是界说下划线；“overline”是界说上划线；“line-through”界说的是删除线；“blink”界说的是笔墨闪灼。

12、怎样使网页具有“首行缩进”功效？
　　因为DW3输出空格不便利，使用“首行缩进”将填补这个不敷。在DW3中CSS的属性界说对话框（styleDefinitionfor.style1)的“Block”上的“text-indent”属性界说的就是“首行缩进”，所谓“首行”是指每段内容的第一行，也就是间接按回车键就构成了一个新的段落。缩进最好以“em”（字符）为单元，好比：汉字编排请求每段入手下手缩进两个汉字，设置好的CSS以下所示：
<styletype="text/css">

</style>
　　在DW3要注重：在DW3中CSS的属性界说对话框（styleDefinitionfor.style1)的“Block”上的“text-indent”右
面的缩进单元选择框中“ems”指的就是“em”。

13、在用表格举行排版时，能使某一偏向上的内容分开表格线一点吗？
　　能够！在DW3中CSS的属性界说对话框（styleDefinitionfor.style1)的“Box”上的“margin”界说的就是内容分开边沿的间隔，分离可界说四个偏向：“top”“bottom”“left”“right”。上面就是界说在右边分开“10px”的CSS例
子代码：
<styletype="text/css">

</style>

14、能给某部份内容加边框吗？
　　用CSS能够给某部份内容加边框，在DW3中CSS的属性界说对话框（styleDefinitionfor.style1)的“Border”界说的就是边框线，“top”“bottom”“left”“right”四边可分离界说线的粗细和色彩，这些界说好后不要健忘鄙人面的“style”中界说线型，不然将看不边框线，由于默许的线型是“none”。上面是一个界说了上边框为：蓝色细线；右边框为：绿色中粗线的CSS例子：
<styletype="text/css">

</style></p>
表现和结构分离，在团队开发中更容易分工合作而减少相互关联性

作者: 谁可相欹 时间: 2015-1-18 06:08
滚动条)层属性--溢出(visible/hidden/scroll/auto)

作者: 柔情似水 时间: 2015-1-22 05:37
在刚开始接触网页的第一堂课上，听说网页制作会是一门很无聊并且很难听懂的过程，而事实却印证了这样一个事实。

作者: 第二个灵魂 时间: 2015-1-30 23:08
时间轴)窗口--时间轴--选中图层并拖图层到时间轴,将其放在指定帧上

作者: 变相怪杰 时间: 2015-2-6 16:57
您在所见即所得网页编辑器进行网页制作和在WORD中进行文本编辑不会感到有什么区别，但它同时也存在着致命的弱点。

作者: 蒙在股里 时间: 2015-2-17 16:08
Adobe Dreamweaver(前称Macromedia Dreamweaver)是Adobe公司的著名网站开发工具。

作者: 小女巫 时间: 2015-3-5 21:01
在Dreamweaver里可以很轻松的完成图文混排、插入图片、插入Flash、插入音频、插入视频。

作者: 小妖女 时间: 2015-3-12 15:09
Dreamweaver是集网页制作和管理网站于一身的所见即所得网页编辑器，在编辑时能同时看到源码和设计界面，非常方便新手学习制作网页。

作者: 简单生活 时间: 2015-3-19 23:28
由CS4 版本开始，则转用WebKit 排版引擎（亦即Google Chrome和Apple Safari浏览器所用的排版引擎）作为网页预览。

欢迎光临仓酷云 (http://ckuyun.com/)