(转)background-position—CSS设置背景图片的位置
background-position :在 CSS 中通过 background-position 属性可以调整背景图片的位置。因为在默认情况下背景图片都是从设置了 background-position 属性的标记(例如 body 标记)在左上角开始出现的,但实际制作时设计者往往希望背景图片出现在指定的位置
background-position:在CSS中通过background-position属性可以调整背景图片的位置。因为在默认情况下背 景图片都是从设置了background-position属性的标记(例如body标记)在左上角开始出现的,但实际制作时设计者往往希望背景图片出现 在指定的位置。
background-position属性值:
属性值
效果
百分比
如:background-position:30% 70%
top
顶部
left
左边
right
右边
bottom
底部
center
居中
Bottom right
右下方
通过代码“background-position:30% 70%”的设置,使得背景图片的中心点在水平方向上处于30%的位置,在竖直方向上则位于70%的位置。
上面提到的“Bottom right”外,background-position的值还可以设置为top left、top
center、top right、center left、center right、bottom left和bottom center等
(转)background-position—CSS设置背景图片的位置的更多相关文章
- img只显示图片一部分 或 css设置背景图片只显示图片指定区域
17:14 2016/3/22img只显示图片一部分 或 css设置背景图片只显示图片指定区域 background-position: 100% 56%; 设置背景图片显示图片的哪个坐标区域,图片左 ...
- css 设置背景图片模糊,内容不模糊
需求:一个div设置了background: url,现在需要使图片背景模糊,div内的文字清晰显示. 原始代码: <!DOCTYPE html> <html lang=" ...
- css设置背景图片,ie显示不了
本来是想给导航栏<div class="nav"></div>添加背景图片的,设置css样式如下: .nav{background:url("ht ...
- 使用CSS设置背景图片,图片比较大,完全显示在一个DIV中
做的时候想要边框为比较好看的样式,需要UI切图并且放在div中,看起来会好看点 像这样的,我随便挑选了一个,UI帮我切图出来 需要把这个图片填到相应的div里面,但是很显然碰到一个问题,图片太大,而且 ...
- css设置背景图片自适应
CreateTime--2017年12月25日16:36:07 Author:Marydon 控制背景图片100%自适应填充布局 /* 控制背景图片100%自适应填充布局 */ body{ bac ...
- css 设置背景图片透明
最终效果: 背景图片css不变,再背景图片的里层元素设置css样式即可 opacity:0.4; filter:alpha(opacity=40); /* 针对 IE8 以及更早的版本 */
- css设置背景图片
background:pink;图片在背景图上面 background-image:url(food.jpg);一张图片铺满一行background-repeat:repeat-x;同一张图片多张铺满 ...
- css 设置背景图片铺满固定不动
#page{ position: relative; width: 100%; height: 100%; background-image:url(../img/bg.JPG); backgroun ...
- CSS background-image背景图片相关介绍
这里将会介绍如何通过background-image设置背景图片,以及背景图片的平铺.拉伸.偏移.设置大小等操作. 1. 背景图片样式分类 CSS中设置元素背景图片及其背景图片样式的属性主要以下几个: ...
随机推荐
- 解决VS2010使用comboBox死机问题
今天,在10下使用combobox总是不响应,原来是和翻译软件冲突,关掉有道立即解决.
- c#中使用easyUI的DataGrid组件
前台页面 html <table id="dg"> </table> JavaScript $("#dg").datagrid({ wi ...
- html中插入flash代码详解(转载)
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://down ...
- ppt怎么换背景图片|PPT换背景设置方法
PPT怎么换背景?PPT背景可谓是PPT幻灯片的灵魂,优美绚丽的PPT背景能为自己做的PPT幻灯片锦上添花.今天,格子啦小编就教大家PPT换背景的方法,让你不再羡慕别人所做PPT的美丽背景,也可以自己 ...
- C语言到底怎么分配空间
程序分为:代码区.数据区.bss区.堆区.栈区.平时常用区分的是代码区.堆区.栈区.下面加上例子区分一下. 3 代码区顾名思义就是存放代码的,里面的内容是不可以修改的.例如你定义了一个变量char * ...
- tornado项目
tornado项目之基于领域驱动模型架构设计的京东用户管理后台 本博文将一步步揭秘京东等大型网站的领域驱动模型,致力于让读者完全掌握这种网络架构中的“高富帅”. 一.预备知识: 1.接口: pytho ...
- TCP回射客户程序:main函数
创建套接字,装填网际网套接字地址结构 创建一个TCP套接字,用服务器的IP地址和端口号装填一个网际网套接字地址结构 我们可从命令行参数取得服务器的IP地址 从头文件unp.h取得服务器的众所周知端口号 ...
- android.os.NetworkOnMainThreadException异常处理办法
网上搜索后知道是因为版本问题,在4.0之后在主线程里面执行Http请求都会报这个错,也许是怕Http请求时间太长造成程序假死的情况吧. 在发起Http请求的Activity里面的onCreate函数里 ...
- unwrap_uvw 笔记
<integer><Unwrap_UVW>.numberVerticesByNode <node>node --返回图顶点的对应于给定节点的Unwrap_UVW点总 ...
- LRU 算法简单实现
在学习很多服务器软件中,当内存不够,而需要淘汰内存的时候,一般会使用LRU算法,便产生了浓厚的兴趣.在学习操作系统的过程中发现LRU在系统中用寄存器和栈来实现.所以我就尝试着学习用栈来解决LRU的问题 ...