img只显示图片一部分 或 css设置背景图片只显示图片指定区域
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设置背景图片只显示图片指定区域的更多相关文章
- css 设置背景图片模糊,内容不模糊
需求:一个div设置了background: url,现在需要使图片背景模糊,div内的文字清晰显示. 原始代码: <!DOCTYPE html> <html lang=" ...
- 【转】CSS设置DIV背景色渐变显示
[原链接]http://www.2cto.com/kf/201310/248187.html <style type="text/css"> .linear{ ...
- CSS设置DIV背景色渐变显示
本文转载自:http://blog.csdn.net/gingerredjade/article/details/12191741 <style type="text/css" ...
- css设置背景固定不滚动效果的示例
css设置背景固定不滚动效果的示例 背景固定不滚动各位看到最多的无非就是QQ空间了,我们在很多的空间都可以看到内容滚动而北京图片不滚动了,下文整理了几个关于背景固定不滚动css代码. 一.css设置背 ...
- css设置背景图片,ie显示不了
本来是想给导航栏<div class="nav"></div>添加背景图片的,设置css样式如下: .nav{background:url("ht ...
- (转)background-position—CSS设置背景图片的位置
background-position :在 CSS 中通过 background-position 属性可以调整背景图片的位置.因为在默认情况下背景图片都是从设置了 background-posit ...
- CSS设置文本末行显示省略号...
首先设置文本标签或文字所在标签的宽度 最主要是以下三点: ①white-space:nowrap;如果是中文需要设置行末不断行 ②overflow:hidden;设置控 ...
- 关于解决asp.net mvc网站页面Banner图片即时更换css里背景图片url相对路径问题的新方案
最近在网站首页上想将Banner壁纸给做到后台上传随时更改的效果.遇到问题便是:将上传的图片路径动态添加到首页css代码中,结果尝试了网上提供的思路,更改相对路径,换为url中“../../Conte ...
- CSS 设置背景透明度,不影响子元素
由于 opacity 属性能被子元素继承,使用它设置父元素背景透明度时也会影响子元素. 解决方法: 1> 使用 RGBA Example .classname { /* RGBa, 透明度0.6 ...
随机推荐
- 报错注入分析之Extractvalue分析
Extractvalue(这单词略长,拆分记忆法extract:提取物 value:值) 上一篇说的是updatexml.updatexml是修改的.而evtractvalue是查询的. 用法与upd ...
- Interleaving String
https://leetcode.com/problems/interleaving-string/ Given s1, s2, s3, find whether s3 is formed by th ...
- linux之netstat命令
netstat用于显示各种网络相关的信息,如网络连接,路由表接口状态(interface statistics), masquerade连接,多播成员(Multicast Memberships)等等 ...
- html5 兼容火狐 ev的事件
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- select初始化添加option,通过标签给出回显值,由于回显值和初始化值option中有一个值重复,去重等问题!
第一张图片: 第二张图片 /** *该方法是为了去重,所谓去重就是 因为回显给select附上了值并设置为selected选中状态,而在我们初始化所有的select添加option元素中于回显的值重复 ...
- C# 使用AForge调用笔记本摄像头拍照
vs2012 winform 连接摄像头设备,这里需要引入 代码: using AForge; using AForge.Controls; using AForge.Imaging; using ...
- javascript之循环保存数值
javascript之循环保存数值 语言都是相通的,这句话在我学javascript时有的深刻的意识.js中的for循环与java中的for循环有很大相似之处. 先看下面这段代码 for(var i= ...
- MySQLFabric连接的编码问题
今天解决的一个小问题.最终的解决方案很简单,主要是讲一下解决问题的思路. 测试人员在服务器上测试,页面提交的中文内容存入数据库中以后,是乱码. 开发人员在本机上测试,没有问题. 服务器上使用的是Mys ...
- Java实现画八卦
八卦是由多个圆叠加而成,如果我们让每个圆都有自己的颜色,那么具体结构便一目了然,如下图所示: 显然只要令对应的圆颜色相同,就能达到我们预期的效果. 用Java就能轻松画出来: import java. ...
- webuploader在IE8/9下上传遇到的两个问题
最近在做图片上传功能. 点击一个按钮,弹出一个iframe,它是百度的webuploader插件 在点击关闭按钮时,IE9下总是会报错: __flash__removeCallback未定义错误 解决 ...