CSS样式表基础(五)——CSS背景

7、CSS 背景

CSS 背景属性

属性 —————————————————— 描述

  • background ————————————— 简写属性,作用是将背景属性设置在一个声明中。
  • background-attachment———————— 背景图像是否固定或者随着页面的其余部分滚动。
  • background-color ———————————设置元素的背景颜色。
  • background-image —————————— 把图像设置为背景。
  • background-position —————————设置背景图像的起始位置。
  • background-repeat ——————————设置背景图像是否及如何重复。

1) background-color 属性,背景色
如:p { background-color: #cff; padding: 5px; }

2) background-image 属性,背景图像
如:body { background-image: url(image/背景1.jpg); }

3)background-repeat 属性,背景重复
background-repeat 设置是否及如何重复背景图像。值如下

  • repeat 默认。背景图像将在垂直方向和水平方向重复。
  • repeat-x 背景图像将在水平方向重复。
  • repeat-y 背景图像将在垂直方向重复。
  • no-repeat 背景图像将仅显示一次。

4) background-position 属性,背景定位
有以下三种值
top left、top center、top right、center left、center center、center right、bottom left、bottom center、bottom right
x% y% 第一个值是水平位置,第二个值是垂直位置。
xpos ypos 第一个值是水平位置,第二个值是垂直位置。

5) background-attachment 属性,背景关联
background-attachment 设置背景图像是否固定或者随着页面的其余部分滚动。
值如下:

  • fixed 当页面的其余部分滚动时,图像固定,背景图像不会移动。
  • scroll 默认值。背景图像会随着页面其余部分的滚动而移动

6) background 简写属性
在一个声明中设置所有的背景属性。
如:background: url(images/1.png) no-repeat fixed center;

例:

<html>
<head>
<title>CSS</title>
<style>
body {
  background-color: #cff;
  background-image: url(images/2.png);
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-position: center;
  background-size: 1400px 600px;
/*    background: #cff url(images/2.png) no-repeat fixed center;   */
}
h1 {
  text-align: center;
}
p {
  font-size: 24pt;
  color: azure
}
</style>
</head>
<body>
<h1>宜春学院</h1>
<p>宜春学院座落于风景秀丽的宜春市城西文教新区,占地面积达1250多亩。
  新校园依山傍水,风光旖旎;南邻浙赣线,西接320国道;
  交通便利,地理位置优越,是莘莘学子读书研学的理想之地。</p>
</body>
</html>

图片说明

全部评论

相关推荐

06-23 11:43
门头沟学院 Java
allin校招的烤冷...:我靠,今天中午我也是这个hr隔一个星期发消息给我。问的问题还是一模一样的😅
点赞 评论 收藏
分享
避坑恶心到我了大家好,今天我想跟大家聊聊我在成都千子成智能科技有限公司(以下简称千子成)的求职经历,希望能给大家一些参考。千子成的母公司是“同创主悦”,主要经营各种产品,比如菜刀、POS机、电话卡等等。听起来是不是有点像地推销售公司?没错,就是那种类型的公司。我当时刚毕业,急需一份临时工作,所以在BOSS上看到了千子成的招聘信息。他们承诺无责底薪5000元,还包住宿,这吸引了我。面试的时候,HR也说了同样的话,感觉挺靠谱的。于是,我满怀期待地等待结果。结果出来后,我通过了面试,第二天就收到了试岗通知。试岗的内容就是地推销售,公司划定一个区域,然后你就得见人就问,问店铺、问路人,一直问到他们有意向为止。如果他们有兴趣,你就得摇同事帮忙推动,促进成交。说说一天的工作安排吧。工作时间是从早上8:30到晚上18:30。早上7点有人叫你起床,收拾后去公司,然后唱歌跳舞(销售公司都这样),7:55早课(类似宣誓),8:05同事间联系销售话术,8:15分享销售技巧,8:30经理训话。9:20左右从公司下市场,公交、地铁、自行车自费。到了市场大概10点左右,开始地推工作。中午吃饭时间大约是12:00,公司附近的路边盖饭面馆店自费AA,吃饭时间大约40分钟左右。吃完饭后继续地推工作,没有所谓的固定中午午休时间。下午6点下班后返回公司,不能直接下班,需要与同事交流话术,经理讲话洗脑。正常情况下9点下班。整个上班的一天中,早上到公司就是站着的,到晚上下班前都是站着。每天步数2万步以上。公司员工没有自己的工位,百来号人挤在一个20平方米的空间里听经理洗脑。白天就在市场上奔波,公司的投入成本几乎只有租金和工资,没有中央空调。早上2小时,晚上加班2小时,纯蒸桑拿。没有任何福利,节假日也没有3倍工资之类的。偶尔会有冲的酸梅汤和西瓜什么的。公司的晋升路径也很有意思:新人—组长—领队—主管—副经理—经理。要求是业绩和团队人数,类似传销模式,把人留下来。新人不能加微信、不能吐槽公司、不能有负面情绪、不能谈恋爱、不能说累。在公司没有任何坐的地方,不能依墙而坐。早上吃早饭在公司外面的安全通道,未到上班时间还会让你吃快些不能磨蹭。总之就是想榨干你。复试的时候,带你的师傅会给你营造一个钱多事少离家近的工作氛围,吹嘘工资有多高、还能吹自己毕业于好大学。然后让你早点来公司、无偿加班、抓住你可能不会走的心思进一步压榨你。总之,大家在找工作的时候一定要擦亮眼睛,避免踩坑!———来自网友
qq乃乃好喝到咩噗茶:不要做没有专业门槛的工作
点赞 评论 收藏
分享
昨天 11:33
江南大学 Java
已经在暑假实习了&nbsp;,没有明确说有hc,纠结实习到八月份会不会有点影响秋招毕竟感觉今年好多提前批
程序员小白条:92的话准备提前批,其他没必要,没面试机会的,而且你要准备充分,尤其八股和算法题
点赞 评论 收藏
分享
评论
点赞
收藏
分享

创作者周榜

更多
牛客网
牛客网在线编程
牛客网题解
牛客企业服务