首页
关于我们
网站建设
经典案例
网络推广
技术中心
建站指导
联系我们
网站套餐 Package
最新推荐 Recommended  
  您现在的位置: 天诚世纪 >> 技术中心 >> 网页设计 >> 网页基础 >> 正文
CSS代码之半透明的表格和背景图片的设置
作者:天诚世纪 更新时间:2009-11-6 17:04:15 来源:天诚世纪
    

想让表格变得半透明:

<STYLE type=text/css>
<!--
table{FILTER: Alpha(opacity=80);}
-->
</STYLE>

括号中的透明数值可以根据需要调整。

背景图片固定在页面角上不动  
<style>body {background-attachment: fixed; background-image: url(图象地址); background-repeat: no-repeat; background-position: right bottom}</style>

代码最后background-position还有两个选项:top和left。
可以单独使用,也可以象本例一样组合使用。
top:顶部
bottom:底部
left:左边
right:右边
top left:左上角
top right:右上角
right bottom:右下角
left bottom:左下角

颜色和背景属性

body {background-color:yellow}

h1 {background-color:red}

上面的语句指整个页面的背景色为黄色,h1中的背景色为红色

 

body {background-image:url(/back.jpg)}

P {background-image:none}

上面的语句指页面的背景图片是back.jpg,P中没有背景图片,当然你也可以加入背景图片

 

body {background:red url(/back.jpg);background-repeat:repeat-y}

上面的语句指页面为红色(如果没有背景图片时),而且背景图片垂直排列。

注意:repeat-x指水平排列,repeat-y指垂直排列,no-repeat指不重复。

 

body {background:red url(/back.jpg);background-repeat:repeat-y;background-attachment:scroll}

注意:background-attachment:fixed 表示背景图片永远静止,文字在背景上面"流动"

background-attachment:scroll 表示背景图片随着页面上的文字一起"流动"

body {background:url(/back.jpg) right top} /*right top=100% 0% */

body {background:url(/back.jpg) top center} /*top center=50% 0% */  

body {background:url(/back.jpg) center} /*center=50% 50% 指背景图片居中*/  

body {background:url(/back.jpg) bottom} /* bottom=50% 100% */  

   自己想的解决办法是把图调整成1024*768的  


background-repeat:repeat 缺省值。背景图片横向和纵向都重复平铺。  
background-repeat:no-repeat 背景图片不重复平铺。  
background-repeat:repeat-x 背景图片横向重复平铺。  
background-repeat:repeat-y 背景图片纵向重复平铺。

网页背景没有拉申功能,css中背景图片的设置:  
不平铺:background-repeat: no-repeat;  
横向平铺:background-repeat: repeat-x;  
纵向平铺:background-repeat: repeat-y;  
固定:background-attachment: fixed;  
滚动:background-attachment: scroll;  
水平居中:background-position: center;  
水平居中并垂直居中:background-position: center center;  

例如:  
<style type="text/css">  
<!--  
.mybg {  
background-image: url(背景图片和路径);  
background-attachment: scroll;  
background-position: center center;  
}  
-->  
</style>  
<body class="mybg">

本文链接:http://www.tc-21.com/ITCenter/200911/20091106170415.html

  • 上一篇文章:
  • 下一篇文章:
  •   更多关于网页基础的新闻
      相关文章
    没有相关文章