CSS样式

摘自:  http://zhidao.baidu.com/question/30159422.html

在DW中如何改变CSS中的字体大小和颜色?

悬赏分:50 - 解决时间:2007-7-11 12:03
我想在自己的网站中应用这个菜单,但是菜单的字体是固定的,应该怎样改变字体的大小(这个字体太小了,中文显示很难看!)和鼠标经过时的底色要改成其他颜色。最后时字体不要加粗效果。谢谢

代码如下:

<HTML><HEAD><TITLE>我的网站</TITLE>
<META http-equiv=Content-Type content="text/html; charset=utf-8">
<STYLE type=text/css>
@import url( css/dhtml-vert.css );
BODY {
PADDING-RIGHT: 30px; PADDING-LEFT: 30px; BACKGROUND: #fff; PADDING-BOTTOM: 30px; MARGIN: 0px; COLOR: #666; PADDING-TOP: 30px
}
H1 {
FONT: bold 36px "Times New Roman", Times, serif}
P {
FONT: 20px Arial, Helvetica, sans-serif
}
A {
COLOR: #900; TEXT-DECORATION: none
}
A:hover {
BACKGROUND: #900; COLOR: #fff
}
.style1 {font-size: 30px}
.style4 {
font-size: 24px;
font-family: Arial, Helvetica, sans-serif;
}
</STYLE>
<!--[if gte IE 5.5]>
<SCRIPT language=JavaScript src="js/dhtml.js"
type=text/JavaScript></SCRIPT>
<![endif]-->
<META content="MSHTML 6.00.2900.2963" name=GENERATOR></HEAD>
<BODY>
<UL id=navmenu>
<LI><A
href="http://www.baidu.com" class="style4">usb 系列</A>
<LI><A
href="http://www.makewing.com/lanren/" class="style1"> mini usb 系列</A>
<LI><A
href="http://www.makewing.com/lanren/" class="style1"> hdmi 系列</A>
<LI><A
href="http://www.makewing.com/lanren/" class="style1"> avi 系列</A>
<LI><A
href="http://www.makewing.com/lanren/" class="style1"> ac 系列</A>
<LI><A
href="http://www.makewing.com/lanren/" class="style1"> dc 系列</A>
<LI><A
href="http://www.makewing.com/lanren/" class="style1"> cable 系列</A>
</UL>
</BODY></HTML>
最佳答案
我想在自己的网站中应用这个菜单,但是菜单的字体是固定的,应该怎样改变字体的大小(这个字体太小了,中文显示很难看!)
先解这个问题:
修改这两个CSS即可
.style1 {font-size: 30px}
.style4 {
font-size: 24px;
font-family: Arial, Helvetica, sans-serif;
}
怎么修改:
.style1 {font-size: 30 px}
.style1 {字体 大小: 数值 PX是像素(这个是单位类似厘米)}
这里只要改数值大小,在一般网页中,大小都是12px
.style4 { font-size: 24px; (这个不用再说了和上面一样)
font-family: Arial, Helvetica, sans-serif;
}
font-family: Arial, Helvetica, sans-serif;
字体 类型:一种英文字体;
如:
font-family:"宋体"; 这就是中文宋体
font-family:"黑体"; 这就是中文黑体
一般网页中默认为宋体,大小为12像素
关于这个字体类型,就看你喜欢什么字体了,
注意的是,最好用系统自带的字体,这样出来的页面,所有人都能看到,如果用的字体在别人系统上没有这个字体,是看不到你这种字体的效果的,

2、鼠标经过时的底色要改成其他颜色
解决这个找到样式:
A { COLOR: #900; TEXT-DECORATION: none }
A:hover { BACKGROUND: #900; COLOR: #fff }
第一行是:鼠标还没经过时的样式,
这时字是血红色
第二行是:当鼠标放在上面的样式,
这时字是白色,背景为血红色
现在来解决:
A { COLOR: #900; TEXT-DECORATION: none }
COLOR: #900;
字体颜色: 颜色代码
#000000 黑色
#ffffff 白色
#ff0000 红色
#ffff00 黄色
等等,其它颜色,你有DW找一下就OK了
TEXT-DECORATION: 这个在DW里叫修饰;就是网页常见的链接有下划线,上划线,删除线之类的
none 而这个就是属性:无
他还有几种:比如你想要下划线:underline 上划线:overline删除线:line-through 等;

再来说说这个:
A:hover { BACKGROUND: #900; COLOR: #fff }
BACKGROUND: #900;
背景 颜色:血红色
#900也可以用#990000来表示,得是一样的
你要改的背景色就是这个颜色了
#900为什么等于#990000,
在颜色代码中遇到有规律的代码可以用三个数来代替
如:#000000 上面所说的黑色,就可以用#000
总结一下,#112233,像这样的,就可以用#123来代替

3、最后时字体不要加粗效果
加粗效果,在你上面给出的代码中没有体现出来但在样式中有一个是加粗的,你删除他就成了
H1 { FONT: bold 36px "Times New Roman", Times, serif}
你把bold删除
posted @ 2007-08-21 19:40  wj-conquer  阅读(246)  评论(0编辑  收藏  举报