论坛登陆 注册 教程 笑话 影视 投稿
首页 | 页界资讯 | 网络应用 | 软件应用 | 组网技术 | 网络原理 | 聊天通讯 | 网管知识 | 帮助
笑话 | 操作系统 | 注 册 表 | 编程开发 | 数 据 库 | 媒体动画 | 网页设计 | 图形图象 | 地图
论坛 | 网络安全 | 安全防范 | 服 务 器 | 硬件学堂 | 路由技术 | 搜索研究 | 站长经验 | 投稿
影院 | 教育频道 | 特色专题 | 精文荟萃 | 注 册 码 | 论坛社区 | 网站地图 | 广告服务 | 旧版
设为首页 加入收藏
当前位置:首页>>文章>>网页设计>>HTML/CSS>>正文

用CSS控制网站总“队形”

www.xker.com 作者:7star 来源:赛迪 加入日期:2006-3-20 10:17:31

【问题提问、论坛交流】网页设计中我们通常需要统一网页的整体风格,统一的风格大部分涉及到网页中文字属性、网页背景色以及链接文字属性等等,如果我们应用CSS来控制这些属性,会大大提高网页设计速度,更加统一网页总体效果

  为了达到修改整个网页的目的,我们需要编辑一个外挂式的CSS文档根据这个文档定义和修改不同CSS属性并在页面元素相同或者相似的网页里调用它

  整体改变页面风格

  现在网页中流行宋体的9pt和10.5pt的字体,按快捷键“Shift+F11”打开“CSS Style控制面板”,单击“New Style”按钮,弹出“New Style”对话框,复选“Redefine HTML Tag”的“Type”类型,这时在Tag处会出现“body”、“br”、“cite”等选项,选择“body”后确认这样我们就建立了一个外挂的CSS文档,在保存对话框中保存为all后就进入“Style Definition for body in all.css”对话框(如图1)选择“Category”中的“Type”项,定义“Font”为“宋体”、“Size”参数为“9”,其后的下拉框选择“Points”、“Color”自定义为喜好颜色就可以了当然还可以选择“Category”中的“Background”项来定义“Background”颜色和其他背景属性这时您会看到页面中内容的整体改变


图1

  偏好元素风格的改变

  经过上面的改变有时不免给您带来一定麻烦,如果遇到页面中某个元素,比如突出显示的文字的字体、字号以及颜色怎么办!这里我们就需要再定义一个新的CSS样式单来对其进行控制,右键点击页面编辑区,在弹出快捷菜单中点击“CSS Style/Edit Style Sheet”命令,弹出“Edit Style Sheet”对话框,选择列表中的all.css,点击“New”按钮,在弹出的“New Style”对话框中选择“Make Custom Style(class)”的“Type”类型定义一个自己偏好的CSS控制如果想更改页面中某一元素的属性,选中它然后右键单击“CSS Styles”面板中“Apply Styles”中刚才定义的CSS,执行“Apply”命令就可以了(如图2)


图2

  统一控制超级链接

  超级链接也是网页中经常使用的,而网页的链接色默认都是蓝色,虽然可以更改,但单一色彩在不同背景色的网页上显示就不是那么奏效了,我们来看一下如何用CSS控制网页实现不同的个性链接颜色在“New Style”对话框中,选择“Use CSS Selector”的“Type”类型,在“Selector”下拉框中会列出“a:link(链接属性)”、“a:hover(鼠标移动到链接上的属性)”、“a:visited(链接被访问后属性)”、“a:active(链接焦点状态下的属性)”4个选项(如图3),这4个选项的设置会控制网页中所有的链接的属性,我们可以分别定义这4个属性,然后添加到“CSS Style”面板中与默认设置不同的CSS控制中,再将其“Apply”到需要改变的链接上就实现了如果将“Hover”的字体设置的比“Link”稍微大一点,就会出现鼠标移动到链接上时字体变大的效果,试试看是不是很奇妙!


图3

  名词解释:CSS即层叠样式表(Cascading Style Sheet)是在网页制作过程中普遍用到的技术采用了CSS技术控制的网页,设计者会更轻松、有效地对页面的整体布局、颜色、字体、链接、背景以及同一页面的不同部分、不同页面的外观和格式等效果实现更加精确地控制Dreamweaver MX推出后,其改进的CSS渲染和设计工具、通过增强CSS面板清晰显示内、外部定义的样式,让用户构建出符合最新CSS标准的站点

编辑:xker.com

上一篇:HTML文件中也玩include文件包含
下一篇:没有了
关闭窗口】【技术交流】【收藏此页
相关文章
·在DreamWeaver中应用CSS样式表技巧两·CSS属性中Display与Visibility的不同·实践DIV+CSS网页布局入门
·Css不朽的经典—3D文字特效·CSS中的滑动门技术研究
推荐文章 最新文章 热门文章
·优化MySQL数据库性能的八大“妙手”
·给系统减肥 卸载Windows中的集成组件
·MySQL数据库中mysqldump命令使用详解
·SqlServer存储过程/函数加/解密
·CSS属性中Display与Visibility的不同
·网管实战 远程管理让服务发布遭遇意外
·骗你不商量的系统优化秘籍
·教您30分钟打造Linux的VPN服务器
·Windows IIS WEB服务器配置安全规范(
·网管手册 70例网络故障排除方法(上)
·ASP.NET中实现大结果集分页研讨
·java写的查找重复电话号码程序
·ASP.NET1.0升级ASP.NET2.0的问题总结
·在Linux操作系统中如何截获系统调用
·照片处理:美女肖像照片简单靓肤技巧
·用CSS控制网站总“队形”
·MSN个人空间使用技巧
·J2EE面试题集锦(附答案)
·VC程序员之无法选择的命运
·Java异常处理的陋习展播
·故障代码大总结
·QQ新功能3D秀常见问题解答
·免费CAD图形管理软件DwgSee
·内网安全技术十大策略 打造坚固的内网
·考察禁用浏览器后退按钮
·解决光驱读盘打滑问题
·解决操作系统与硬盘的内部冲突(下) 
·程序员建立商业意识之避免坐井观天
·优化MySQL数据库性能的八大“妙手”
·为MySQL数据库添加新用户
·个人简历表格
·免费代理IP(每日更新)
·QQ收费头像免费使用的方法 
·QQ密码丢失后能做的事情:快速找回密码
·Norton AntiVirus 2006 注册码(激活
·系统优化 专题
·豪杰超级解霸V9.1正版注册码
·WinRAR 3.51 注册码
·找回QQ密码的注意事项 
·史上最强QQ个人档案资料欣赏
·Ajax技术开发指南
·最经典的黑客入门教材
·求职简历封皮
·ACDSee v8.0注册码
·应届毕业生求职信
评论

设为首页 - 版权声明 - 广告服务 - 关于我们 - 联系我们 - 友情连接
Copyright © 2003-2006 xker.com All rights reserved.小新技术网 合作广告QQ:12231446
本页浏览次数: