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 ...
随机推荐
- Sublime Text3插件管理
插件安装 package control 安装Sublime Text3 打开Sublime Text3,Ctrl+~ 调出控制台,输入代码安装 package control 代码如下: impor ...
- 一堆LCT板子
搞了一上午LCT,真是累死了-- 以前总觉得LCT高大上不好学不好打,今天打了几遍感觉还可以嘛= =反正现在的水平应付不太难的LCT题也够用了,就这样好了,接下来专心搞网络流. 话说以前一直YY不出来 ...
- linux 软连接和硬链接
硬链接 ln sourceFile targetFile 硬链接只能给文件创建,不能为目录建立硬链接,硬链接不能跨分区创建, 硬链接会增加inode连接数, 硬链接的文件删除不影响其他文件 课外: ...
- Sublime3和Chrome配置自动刷新网页【实测可用】
SublimeText2下的LiveReload在SublimeText3下无法正常使用,本文整理SublimeText3安装LiveReload的方法.win7下实测可用! 安装成功后,就不需要再手 ...
- 【openStack】Libcloud 如何支持 keystone V3?
Examples This section includes some examples which show how to use the newly available functionality ...
- ServiceStack.Redis订阅发布服务的调用(Z)
1.Redis订阅发布介绍Redis订阅发布是一种消息通信模式:发布者(publisher)发送消息,订阅者(Subscriber)接受消息.类似于设计模式中的观察者模式.发布者和订阅者之间使用频 ...
- Angular2 依赖注入
1. 使用DI 依赖注入是一个很重要的程序设计模式. Angular 有自己的依赖注入框架,离开了它,我们几乎没法构建 Angular 应用.它使用得非常广泛,以至于几乎每个人都会把它简称为 DI. ...
- DateUtil(SimpleDateFormat)
import java.util.Calendar; import java.util.Date; import java.text.SimpleDateFormat; public class Da ...
- 【.net+jquery】绘制自定义表单(含源码)
前言 两年前在力控的时候就想做一个类似的功能,当时思路大家都讨论好了,诸多原因最终还是夭折了.没想到两年多后再这有重新提出要写一个绘制表单的功能.对此也是有点小激动呢?总共用时8.5天的时间基本功能也 ...
- QT,静态变量要记得初始化
//DbUtil.h #ifndef DBUTIL_H #define DBUTIL_H using namespace std; QString md5Encode(QString passwd); ...