新闻 | 天津 | 民生 | 广电 | 津抖云 | 微视 | 读图 | 文娱 | 体育 | 图事 | 理论 | 志愿 | 专题 | 工作室 | 不良信息举报
教育 | 健康 | 财经 | 地产 | 天津通 | 旅游 | 时尚 | 购物 | 汽车 | IT | 亲子 | 会计 | 访谈 | 场景秀 | 发布系统

"津云"客户端
  您当前的位置 : 北方网  >  IT浪潮  >  滚动新闻
关键词:

Dreamweaver教程:CSS制作细框表格


http://www.enorth.com.cn  2007-08-08 08:39

  作者:易水寒

  【IT168实用技巧】细线框表格是我们在网页制作中经常需要用到的效果之一,制作细线框表格的方法很多,代码兼容性最高的还是单元格背景填充法,不过常规写法产生的垃圾代码较多,今天我们转换思路用CSS来实现该效果。整个过程完全在Dreamweaver可视化界面下完成,不需要大家手工写任何代码,非常简单。

新建CSS样式

  运行Dreamweaver,点击菜单“窗口”→“CSS样式”调用CSS面板。在面板中点击“新建CSS规则”按钮,如图1。


图1

  进入“新建CSS规则”对话框,将“选择器类型”设置为:高级;键入“选择器”名称:.bk(名称由大家任意确定,但该样式以后会反复调用,不可搞错);“定义在”设置为“仅对该文档”,点击“确定”按钮完成,如图2。


图2
下面正式进入“CSS规则定义”对话框,点击选择分类中的“背景”,设置“背景颜色”为所需,本例值为“#000000”,即黑色(利用软件提供的颜色选择器,具体颜色代码并不需要手工输入)。这也是我们最终看到的表格边框颜色,点击“确定”按钮完成设置,如图3。


图3

  现在名为“.bk”的CSS就建立好了,接下来我们为它添加一个子选择器。继续在CSS面板中点击“新建CSS规则”按钮,基本设置如图2,不过选择器名称定义为“.bk td”(表示这是一个依附于.bk的子样式)。依然进入“CSS规则定义”对话框,继续设置背景颜色,本例值为“#FFFFFF”,即白色,点击“确定”按钮完成。

  至此在CSS面板中就能看到两个新建好的CSS样式了,以后你就可以任意调用了,如图4。


图4

[1]  [2]  下一页  尾页
编辑:赵国栋 新浪
[进入IT论坛]
请您文明上网、理性发言并遵守相关规定,在注册后发表评论。
 北方网精彩内容推荐
无标题文档
天津民生资讯
天气交通 天津福彩 每月影讯 二手市场
空气质量 天津股票 广播节目 二手房源
失物招领 股市大擂台 天视节目 每日房价
热点专题
北京奥运圣火传递和谐之旅 迎奥运 讲文明 树新风
解放思想 干事创业 科学发展 同在一方热土 共建美好家园
2008天津夏季达沃斯论坛 《今日股市观察》视频
北方网网络相声频道在线收听 2008高考招生简章 复习冲刺
天津自然博物馆馆藏精品展示 2008年天津中考问题解答
带你了解08春夏服饰流行趋势 完美塑身 舞动肚皮舞(视频)
C-NCAP碰撞试验—雪佛兰景程 特殊时期善待自己 孕期检查
热点新闻排行 财经 体育 娱乐 汽车 IT 时尚 健康 教育

Copyright (C) 2000-2021 Enorth.com.cn, Tianjin ENORTH NETNEWS Co.,LTD.All rights reserved
本网站由天津北方网版权所有