在网页设计中加入背景图片,有很多的方法

当我们在过节日的时候,比如情人节、春节等,总会收到很多朋友们发过来的一个个祝贺性质的网址,当我们浏览时,总会发现,拖动右边的滚动条时,感觉只有网页的内容随着滚动条的滚动而滚动,而背景却完全没有动,这种效果又是如何实现的呢?

在网页设计中加入背景图片,有很多的方法,这里不一一列举,这是网页设计里面一个很简单的操作。如何让背景图片固定不动呢,我们只需要将<body>参数设置为以下代码,就可以实现了。

<body background="yx.gif"bgproperties="fixed">

或用CSS样式表定义:

<style type="text/css">

<!--

body { background-image: url(yx.gif); background-attachment: fixed}

-->

</style>

给超级链接进行颜色设置(CSS),鼠标形状设置,链接的下划线的设置

初学者打开很多门户性网站或者艺术性质的网站,总会被其中专业的链接惊喜很久,因为在烟台网站制作过程当中当中,我们进行简单的超级链接设置后,发现浏览出来的页面总是会有那么一点粗糙,无论我们怎么点击“链接”项,它的颜色总是一样,而且会在文字下方永远保持着一条下划线,同时鼠标也没有任何的变化,那么如何做,才能给超级链接进行颜色设置(CSS),鼠标形状设置,链接的下划线的设置呢?

这需要借助于我们Dreamweaver 自带的CSS样式进行,下面的代码分别实现下列的效果:

当正常链接时,链接的颜色为黑色,无下划线,字体大小为12像素。

当某个链接被访问过后,链接的颜色为灰色, 无下划线,字体大小为12像素。

当鼠标在链接上方停留时,链接的颜色为红色,有下划线,字体大小为14像素。

当我们点击链接时,链接的颜色显示为黄色,无下划线,字体大小为12像素。

只需要将下列的代码加入到<head>与</head>之间,即可。

<style type="text/css">

<!--

a:link {

font-size: 12px; color: #000000; text-decoration: none;

}

a:visited {

font-size: 12px; color: #666666; text-decoration: none;

}

a:hover {

color: #FF0000; text-decoration: underline; font-size: 14px;

}

a:active {

font-size: 12px; color: #FFFF00; text-decoration: none;

}

-->

</style>

其中的color就是用来设置网页设计中链接的颜色,text_decoration用来设置链接是否应该有下划线、上划线、删除线或者什么没有,而font-size是用来设置字体的大小的,但几种状态之间的font-size值的变化,让访问者产生一种动态的效果。

尤其要注意的是,网站制作过程当中写的时候一定要注意这个CSS样式的书写顺利,一定要按照a:link、a:visited、a:hover、a:active依次书写,否则这几种状态的效果将得不到正常的显示。

相关搜索:烟台网站建设烟台网络公司网络公司 网站制作 山东网亿

部分图片和文字来源于网络,出处无从查起,如涉及版权问题,请联系进行删除。

  • 发表于:
  • 原文链接https://kuaibao.qq.com/s/20190108A09N8Z00?refer=cp_1026
  • 腾讯「云+社区」是腾讯内容开放平台帐号(企鹅号)传播渠道之一,根据《腾讯内容开放平台服务协议》转载发布内容。

扫码关注云+社区

领取腾讯云代金券