网站导航网学 原创论文 原创专题 网站设计 最新系统 原创论文 论文降重 发表论文 论文发表 UI设计定制 论文答辩PPT格式排版 期刊发表 论文专题
返回网学首页
网学原创论文
最新论文 推荐专题 热门论文 论文专题
当前位置: 网学 > 设计资源 > DIVCSS技术 > 正文

CSS背景

论文降重修改服务、格式排版等 获取论文 论文降重及排版 论文发表 相关服务

CSS 背景

CSS 背景-CSS background

CSS背景基础知识
CSS 背景这里指通过CSS对对象设置背景属性,如通过CSS设置背景各种样式。
CSS中背景单词:
background CSS手册查询-background手册
background-color 设置颜色作为对象背景颜色
background-image 设置图片作为背景图片
background-repeat 设置背景平铺重复方向
background-attachment 设置或检索背景图像是随对象内容滚动还是固定的。
background-position 设置或检索对象的背景图像位置。

Html原始背景与CSS背景对照
Html是指对应效果的table背景设置,
Html背景单词:
Bgcolor设置背景颜色 与CSS 背景颜色对应background-color
Background设置图片作为背景与CSS背景图片对应background-image

最原始HTML背景设置演示代码:

 <table bgcolor="#996600">
<tr>
<td background="/uploadfile/201008/22/28145559766.gif" width="130" height="100">&nbsp;</td>
</tr>
</table>

这里设置了table背景颜色为#996600,然后设置了td的背景图片为/uploadfile/201008/22/28145559766.gif

背景颜色
如果是给table设置背景颜色可以使用bgcolor="颜色值"即可设置对象背景颜色。
如果是CSS 背景颜色,可使用background-color:颜色值;或 background:颜色值设置对象背景颜色。
CSS 背景颜色设置DIV+CSS演示图:
 

html背景,CSS 背景实例演示
以上截图分别使用background-color和background来设置对象背景颜色

CSS图片背景
这里说的是以图片作为背景图片 -  CSS 背景图片详细介绍:/uploadfile/201008/22/88145559512.gif);设置网学的LOGO图片作为背景

background-image:url(/uploadfile/201008/22/DC145559401.gif);具有相同效果。这样设置图片作为背景有个缺陷就是图片会上下左右的重复,接下来我们只需看以下图例教程即可掌握CSS background

CSS background解剖图
图片背景样式(固定、滚动)
实现这个效果使用CSS单词是background-attachment 当然通常情况下背景默认是固定的如果是自己使用CSS background简写则如上图。
background-attachment使用解析:
background-attachment:fixed; 背景固定
background-attachment:scroll 背景图像是随对象内容滚动


DIV CSS 背景居中
CSS 背景分为左右居中和上下居中,具体左右居中方法见上图。
背景图像上下居中,可以使用计算上下高度然后平分设置,如上下高度距离为500px,那就设置图片居顶部多少PX可以让图片实现上下居中。 copyright myeducs.cn 网学


CSS background(背景)总结:
使用图片作为背景在一个网页布局中常常会遇到,希望大家能在实际中掌握其知识。一般设置对象图片作为背景属性实例 background:#666 url(图片地址) no-repeat center top ;(解释首先设置背景颜色 紧跟设置图片作背景 紧跟图片是否重复 然后跟图片在对象位置。前面的背景颜色可以不用设同时不是必须,一般使用图片作为对象背景如果要设置图片是否重复显示距离位置将设置图片位置)
1、设置图片作为背景如果图片设置图片在X坐标方向重复,如果再设置图片在对象位置的左或右位置时将无效,可设置在对象上或下位置开始显示。
2、设置图片作为背景如果图片设置图片在Y坐标方向重复,如果再设置图片在对象位置的上或下位置时将无效,可设置图片在对象左或右位置开始显示。
3、如果设置背景完全重复显示,那设置图片在对象上下左右位置开始显示将无线。

希望大家好好理解有不懂的地方可以进入CSS 研教室讨论区发表问题,我们将尽力答复您。

相关阅读
CSS 高度
CSS 宽度
CSS 颜色
CSS 文本
 

  • 上一篇资讯: CSS加粗
  • 下一篇资讯: CSS颜色
  • 版权所有 网学网 [Myeducs.cn] 您电脑的分辨率是 像素
    Copyright 2008-2020 myeducs.Cn www.myeducs.Cn All Rights Reserved 湘ICP备09003080号 常年法律顾问:王律师