当前位置: 首页 > 网络学院 > 网页制作基础教程 > WEB设计综合 > CSS基础以及CSS代码

WEB设计综合
使用css让英文文本自动换行
兼容IE6/IE7/FF的页面最小宽度设置

WEB设计综合 中的 CSS基础以及CSS代码


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-03-01   浏览: 1235 ::
收藏到网摘: n/a

CSS_Code_ImageHere i will teach you the basics of CSS (Cascading Style Sheets) and will make a list of many many CSS codes for you to use :D
在这里,我将教你CSS(层叠样式表)的基本准则,并为你准备一些比较实用的CSS代码。

Ok, CSS codes are written like this:
CSS
代码的具体书写方式如下:

<style type="text/css">
All of the CSS code goes in here
</style>


And the code is inserted into the <head> and </head> tags of the page.
将上面的代码插入页面的 <head> </head> 之间。

These are just some CSS codes that I picked up somewhere or other over the internet, I didn't make them, I am just showing you them so you can use them :)
下面列举的这些CSS代码是我从其它地方或者是互联网上获取的,我并没有书写他们,我仅是将它展示给各位,以方便各位的使用。

Hope you find what you need!
希望它对你们有用!

Colourful scrollbar
多彩滚动条

<style type="text/css">
body{scrollbar-face-color:#EEEEEE; scrollbar-shadow-color:
#000000;scrollbar-highlight-color: #EEEEEE;scrollbar-3dlight-color:
#000000;scrollbar-darkshadow-color: #EEEEEE;scrollbar-track-color:
#EEEEEE;scrollbar-arrow-color: #000000;} </style>


Add a background
链接一个背景

<style type="text/css">
body {background:url(http://www.yoursite.com/the)} </style>


Add a background and have it fixed
添加一个固定背景

<style type="text/css">
body {background:url(http://www.yoursite.com/thebackground.gif) fixed} </style>


Change link text
改变链接文本样式

<style type="text/css">
a:link,a:visited{color:gold;font:9pt verdana}
a:active{color:red;font:9pt verdana}
</style>


Change link background on mouseover
鼠标经过时,该表链接背景

<style type="text/css">
a:hover{background:gold}
</style>


Text to capitols on mouseover
鼠标经过时,改变文本样式

<style type="text/css">
a:hover{text-transform:uppercase}
</style>


General font size, type and color
规定字体尺寸、类型和颜色

<style type="text/css">
body{font-family:verdana;font-size:8pt;font-color:red;}
</style>


Get rid of all the white stuff in images
取出图像中的白色

<style type="text/css">
img{filter:chroma(color=white)}
</style>


Get a crosshair as a cursor
让鼠标的形状变成十字形

<style type="text/css">
body{cursor:crosshair}
</style>


Put a picture anywhere you want
在你喜欢的地方放置一张图片

<style type="text/css">
i.anypic1 {background:url(http://www.yoursite.com/theimage.gif);
height:80;width:80;position:absolute;top:200;left:300}
</style>
<i class="anypic1"> </i>


Change table borders
改变表格边框

<style type="text/css">
table {
border-style: solid;
border-color: #CCCCCC;
border-width: 1px;
}
</style>

评论 (0) All

登陆 | 还没注册?