18 12 29 css background

background属性

属性解释 
background属性是css中应用比较多,且比较重要的一个属性,它是负责给盒子设置背景图片和背景颜色的,background是一个复合属性,它可以分解成如下几个设置项:

  • background-color 设置背景颜色
  • background-image 设置背景图片地址
  • background-repeat 设置背景图片如何重复平铺
  • background-position 设置背景图片的位置
  • background-attachment 设置背景图片是固定还是随着页面滚动条滚动

实际应用中,我们可以用background属性将上面所有的设置项放在一起,而且也建议这么做,这样做性能更高,而且兼容性更好,比如:“background: #00FF00 url(bgimage.gif) no-repeat left center fixed”,这里面的“#00ff00”是设置background-color;“url(bgimage.gif)”是设置background-image;“no-repeat”是设置background-repeat;“left center”是设置background-position;“fixed”是设置background-attachment,各个设置项用空格隔开,有的设置项不写也是可以的,它会使用默认值

  

原文地址:https://www.cnblogs.com/fromlantianwei/p/10196441.html

时间: 2024-10-29 02:10:18

18 12 29 css background的相关文章

18 12 27 css 盒模型使用 以及相关技巧问题 元素溢出 块元素、内联元素、内联块元素

盒子模型的实际尺寸 盒子的width和height设置的是盒子内容的宽和高,不是盒子本身的宽和高,盒子的真实尺寸计算公式如下: 盒子宽度 = width + padding左右 + border左右 盒子高度 = height + padding上下 + border上下 margin相关技巧 1.设置元素水平居中: margin:x auto;2.margin负值让元素位移及边框合并 外边距合并 外边距合并指的是,当两个垂直外边距相遇时,它们将形成一个外边距.合并后的外边距的高度等于两个发生合

【18/12/29】Ubuntu 16.04下配置intel opencl环境

一. 靠谱的安装教程 1. 官网教程 https://software.intel.com/en-us/articles/sdk-for-opencl-2019-gsg,打开后往下拉到[4. Production Examples]处,即可找到入口. 官网教程的链接,是从 https://blog.csdn.net/wd1603926823/article/details/79139172 中找到的: 2. 简略版的安装教程 (好像没有安装driver?相对官网的简短很多),https://ww

12个CSS高级技巧汇总

[html_css]12个CSS高级技巧汇总 2016-08-01 分类:HTML_CSS_JS笔记 阅读(10) 评论(0)  下面这些CSS高级技巧,一般人我可不告诉他哦. 使用 :not() 在菜单上应用/取消应用边框 给body添加行高 所有一切都垂直居中 逗号分隔的列表 使用负的 nth-child 选择项目 对图标使用SVG 优化显示文本 对纯CSS滑块使用 max-height 继承 box-sizing 表格单元格等宽 用Flexbox摆脱外边距的各种hack 使用属性选择器用于

CSS background 渐变

1 html { margin:0; padding:0; height:100%; 2 background: url(http://p1.qhimg.com/d/360browser/20130709/backbg.jpg) repeat-x; /* Old browsers */ 3 background: -moz-linear-gradient(top, #5f9dde 0%, #c1e4ff 100%); /* FF3.6+ */ 4 background: -webkit-grad

Some Modern Softwares' drawbacks: User experience 12/29/2015

In the nowadays, there are many APP in the PC or smart Phone. Some of them can't meet the customers' need. And I summary some modern softwares' drawbacks and it will guide our team project to the right way. 1. WeChat: 1). Introduction: Wechat is the

CSS 背景-CSS background

这里有个很好的样式学习网站:http://www.divcss5.com/rumen/r125.shtml 一.Css background背景语法   -   TOP CSS背景基础知识 CSS 背景这里指通过CSS对对象设置背景属性,如通过CSS设置背景各种样式. 背景语法: background: background-color || background-image || background-repeat || background-attachment || background-

HTML CSS——background的认识(一)

今天回归bug时无意间看到了样式表中background属性,现在总结一下: 1.background-color:设置元素的背景色.其值可以为:color-name.color-rgb.color-hex.transparent: 2.background-image:设置元素的背景图像.其值可以为:url(URL).none: 3.background-repeat:设置元素背景图像是否重复以及重复时的重复方式.其值可以为:repeat.repeat-x.repeat-y.no-repeat

CSS background 属性详解

CSS background Property 语法: background: bg-color bg-image position/bg-size bg-repeat bg-origin bg-clip bg-attachment initial|inherit; Note: If one of the properties in the shorthand declaration is the bg-size property, you must use a / (slash) to sep

2015.12.29~2015.12.30真题回顾!-- HTML5学堂

2015.12.29~2015.12.30真题回顾!-- HTML5学堂 吃饭,能够解决饥饿,提供身体运作机能.练习就像吃饭,强壮自己,提升编程技能,寻求编程技巧的最佳捷径!吃饭不能停,练习同样不能停哦! HTML5真题[2015.12.29]题目 学习JavaScript或应用JavaScript进行脚本开发,“变量”这是必须要学会使用的.什么是变量呢?又什么作用呢?ok,大家稍安勿躁哦,试体验体验这题目<HTML5真题[2015.12.29]题目>与 <HTML5真题[2015.12