• 网络学院
  • IT资讯
  • 操作系统
  • 网络技术
  • 软件应用
  • 办公软件
  • 编程技术
  • 网站架设
  • 数据库类
  • 平面设计
  • 多媒体类
  • 游戏资讯
  • 教学论文
  • 认证考试
深潜网页制作学就用技巧
  站点:
  • 首 页
  • 最新软件
  • 文章教程
  • 国内软件
  • 国外软件
  • 绿色软件
  • 源码下载
  • 字体下载
深潜网页制作学就用技巧
软件发布 深潜网页制作学就用技巧
网络软件 系统工具 应用软件 联络聊天 图形图像 多媒体类 行业软件 游戏娱乐 编程开发 安全相关 教育教学 数码软件 绿软下载
热门软件: QQ 瑞星 pplive e话通 木马克星 千千静听 office2000 五笔字根 Photoshop 视频分割
返回文章教程首页 >> 文章首页 >> 网站架设 >> HTML/CSS >> 深潜网页制作学就用技巧

深潜网页制作学就用技巧

添加时间: 2005-6-9 5:14:31  作者: 网络收集  阅读次数:56   来源: http://d9soft.com

       

一、让文字改变颜色 

在有些网页我们可以看到一些文字,当鼠标移上去是一种颜色,移开就是另外一种颜色,这是怎么样实现的呢?

原来我们只需要在Head内预先定义两个类,分别定义了两种颜色,这在后面的HTML源文件中会用到这个颜色的定义:

  <style>
   .normal {color:red;}
   .start {color:blue;}
  </style>

  然后我们在要改变的字前后加上下面的代码:

  <SPAN onmouseover = "this.className = 'normal'" 
   onmouseout = "this.className='start'" class=start> here </SPAN>

这里的“class=start”是将这行字的默认值设为 start {color:blue;},要是不加上这句 的话,你这行字的颜色就会变成HTML预先设定的数值。

当我们把鼠标移动到“here”上的时候,颜色为“normal”定义的颜色,而当鼠标移开的时候“here”的颜色为“start”定义的颜色(这种效果只有在IE浏览器中才可以看到)。

二、给置网页加上背景图像 

网页的背景色和背景图选择得好,会给页面增色不少。如果选取单一的背景色,难免显得单调,如果选择整个图片做背景,由于图片本身的文件大,造成网页的加载时间长,一般用户很难有耐性等待下去。那么带背景的网页是如何制作出来的?

很简单,一般是采用一幅很小的图片,然后铺展开,形成很漂亮的背景。对背景图的要求当然是越漂亮越好,文件越小越好。当你有了一幅可以自然拼接的图像后,在Dreamweaver中,我们可以设置background图片。

打开源文件我们可以看到〈BODY〉标签中多了一串代码。代码的表达式如下:

<BODY BACKGROUND="images/background.gif" BGCOLOR="#FFFFFF" >

这里的images/background.gif就是BACKGROUND的值,其图像文件名为一个URL。 当然我们可以在源代码中直接加入上面的代码。

三、去掉超链接的下划线

在访问一些页面的时候,我们会发现,当鼠标移动到具有超级连接的文字上的时候,有的会产生相应的下划线。然而有些网页却没有。主页超链接的下划线是如何去掉的呢?

我们在<HEAD>...</HEAD>之间插入下面的代码。

  <style>B {font-weight: 700; }
   P {padding: 5px 0px;
     margin: 0px;
     font-family: 宋体,黑体,宋体;
    }
   A {text-decoration: none}
   TD { font-family: 宋体,黑体,宋体; }
  </style>
  <script language="javascript">
   var contents = true;
  </script>

更简单的方法是:

   <style>
    <!--
     a {text-decoration:none}
     a:hover {color: red;text-decoration:none}
    --!>
   </style>

 

上下文章:

 

上一篇文章: 网页制作超级技巧(一) 下一篇文章: 从HTML语言到网上家园.一

相关文章:

  • 教你如何用零框架技术加密网页
  • 彻底DIY Vista主题制作教程(上)
  • 教你如何用PhotoImpact 来制作逼真的温度计
  • 上网高效率 宽带路由优化技巧放送
  • Photoshop技巧:让模糊照片变清晰

相关软件:

  • 名片制作专家 6.5.6
  • 网页配色精灵 5.5
  • 网页特效生成器(Green Tea) V2.60
  • 网页特效小精灵(javatx) V2.0
  • 雨声网页特效大师 V2.0
  • 百艺精品网页特效 V1.25

 

快速导航

  • 网络学院
  • 精品汇聚
  • 字体下载
  • 教程下载
  • ASP源码
  • PHP源码
  • Net源码
  • JSP 源码

网站架设分类导航

  • DreamWeaver
  • HTML/CSS
  • Flash
  • Firework
  • FrontPage
  • 建站指南

本类经典文章推荐

  • 总结:CSS在IE与Firefox下的兼容性
  • 经典:CSS应用常见问题大总结
  • 网站设计的标准时代
  • 用层模拟下拉列表框
  • 苏沈小雨样式表中文手册系列
  • 用CSS控制网页总体风格
  • WEB界面设计五种特征
  • 深入透析样式表滤镜(上)
  • HTML的基本元素
  • 网页中多层效果的灵活使用

HTML/CSS阅读排行

  • 用层模拟下拉列表框
  • 突破网页文字无法复制局限
  • 流程图软件Visio作“高难度”网页
  • 苏沈小雨样式表中文手册系列
  • WEB界面设计五种特征
  • 用CSS控制网页总体风格
  • 图片模糊转清晰
  • 制作精美圆角表格两种方法
  • 网页制作小工具大全(下)
  • 网页制作小工具大全(中)

网站架设阅读总排行

  • 用层模拟下拉列表框
  • 教你如何用Dreamweaver制作电子相...
  • 用Dreamweaver插件制作动态下拉菜...
  • 突破网页文字无法复制局限
  • 如何设计首页???(解答)
  • Dreamweaver基础技巧-布局阶段
  • 动态QQ表情DIY Fireworks轻松搞定
  • 流程图软件Visio作“高难度”网页
  • 网页制作隐藏对象巧利用
  • 站点-网页布局设计基础

广告位置

字母检索 A B C D E F G H I J K L M N O P Q R S T U V W X Y Z 回到顶部

关于我们 | 版权声明 | 免责条款 | 广告联系 | 软件发布 | 下载帮助 | 下载排行 | 网站地图 | 特别鸣谢 | 友情连接

copyright; 2005-2008 D9soft.com 第九软件网 版权所有