17:14 2016/3/22
img只显示图片一部分 或 css设置背景图片只显示图片指定区域
background-position: 100% 56%; 设置背景图片显示图片的哪个坐标区域,图片左上角为0,0或0%,0%,右下角为高度和宽度,或100%,100%。
clip:rect(300px 100px 300px 0px); 设置显示图片的某个区域,分别是上右下左的顺序设置

部分代码:
<style type="text/css">
img
{
position:absolute;
clip:rect(30px 150px 200px 50px)
}
</style>
<img border="0" src="/i/eg_bookasp.gif" width="120" height="151">
参考:http://www.w3school.com.cn/tiy/t.asp?f=csse_clip

body
{
background-image:url('bgimage.gif');
background-repeat:no-repeat;
background-attachment:fixed;
background-position:center;
}
参考:http://www.zgguan.com/doc/w3c/css/pr_background-position.asp.htm

求点赞:
对你有助请点赞,请顶,不好请踩------送人玫瑰,手留余香!

img只显示图片一部分 或 css设置背景图片只显示图片指定区域的更多相关文章

  1. css 设置背景图片模糊,内容不模糊

    需求:一个div设置了background: url,现在需要使图片背景模糊,div内的文字清晰显示. 原始代码: <!DOCTYPE html> <html lang=" ...

  2. 【转】CSS设置DIV背景色渐变显示

     [原链接]http://www.2cto.com/kf/201310/248187.html <style type="text/css">     .linear{ ...

  3. CSS设置DIV背景色渐变显示

    本文转载自:http://blog.csdn.net/gingerredjade/article/details/12191741 <style type="text/css" ...

  4. css设置背景固定不滚动效果的示例

    css设置背景固定不滚动效果的示例 背景固定不滚动各位看到最多的无非就是QQ空间了,我们在很多的空间都可以看到内容滚动而北京图片不滚动了,下文整理了几个关于背景固定不滚动css代码. 一.css设置背 ...

  5. css设置背景图片,ie显示不了

    本来是想给导航栏<div class="nav"></div>添加背景图片的,设置css样式如下: .nav{background:url("ht ...

  6. (转)background-position—CSS设置背景图片的位置

    background-position :在 CSS 中通过 background-position 属性可以调整背景图片的位置.因为在默认情况下背景图片都是从设置了 background-posit ...

  7. CSS设置文本末行显示省略号...

     首先设置文本标签或文字所在标签的宽度   最主要是以下三点:        ①white-space:nowrap;如果是中文需要设置行末不断行       ②overflow:hidden;设置控 ...

  8. 关于解决asp.net mvc网站页面Banner图片即时更换css里背景图片url相对路径问题的新方案

    最近在网站首页上想将Banner壁纸给做到后台上传随时更改的效果.遇到问题便是:将上传的图片路径动态添加到首页css代码中,结果尝试了网上提供的思路,更改相对路径,换为url中“../../Conte ...

  9. CSS 设置背景透明度,不影响子元素

    由于 opacity 属性能被子元素继承,使用它设置父元素背景透明度时也会影响子元素. 解决方法: 1> 使用 RGBA Example .classname { /* RGBa, 透明度0.6 ...

随机推荐

  1. 报错注入分析之Extractvalue分析

    Extractvalue(这单词略长,拆分记忆法extract:提取物 value:值) 上一篇说的是updatexml.updatexml是修改的.而evtractvalue是查询的. 用法与upd ...

  2. Interleaving String

    https://leetcode.com/problems/interleaving-string/ Given s1, s2, s3, find whether s3 is formed by th ...

  3. linux之netstat命令

    netstat用于显示各种网络相关的信息,如网络连接,路由表接口状态(interface statistics), masquerade连接,多播成员(Multicast Memberships)等等 ...

  4. html5 兼容火狐 ev的事件

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  5. select初始化添加option,通过标签给出回显值,由于回显值和初始化值option中有一个值重复,去重等问题!

    第一张图片: 第二张图片 /** *该方法是为了去重,所谓去重就是 因为回显给select附上了值并设置为selected选中状态,而在我们初始化所有的select添加option元素中于回显的值重复 ...

  6. C# 使用AForge调用笔记本摄像头拍照

    vs2012  winform 连接摄像头设备,这里需要引入 代码: using AForge; using AForge.Controls; using AForge.Imaging; using ...

  7. javascript之循环保存数值

    javascript之循环保存数值 语言都是相通的,这句话在我学javascript时有的深刻的意识.js中的for循环与java中的for循环有很大相似之处. 先看下面这段代码 for(var i= ...

  8. MySQLFabric连接的编码问题

    今天解决的一个小问题.最终的解决方案很简单,主要是讲一下解决问题的思路. 测试人员在服务器上测试,页面提交的中文内容存入数据库中以后,是乱码. 开发人员在本机上测试,没有问题. 服务器上使用的是Mys ...

  9. Java实现画八卦

    八卦是由多个圆叠加而成,如果我们让每个圆都有自己的颜色,那么具体结构便一目了然,如下图所示: 显然只要令对应的圆颜色相同,就能达到我们预期的效果. 用Java就能轻松画出来: import java. ...

  10. webuploader在IE8/9下上传遇到的两个问题

    最近在做图片上传功能. 点击一个按钮,弹出一个iframe,它是百度的webuploader插件 在点击关闭按钮时,IE9下总是会报错: __flash__removeCallback未定义错误 解决 ...