body的 background中的图片 怎么控制大小? [问题点数:20分,结帖人jxzhang615]

Bbs6
本版专家分:6401
结帖率 100%
Bbs3
本版专家分:602
Bbs6
本版专家分:6401
Bbs1
本版专家分:51
Bbs6
本版专家分:9651
Blank
红花 2009年11月 Web 开发大版内专家分月排行榜第一
Blank
黄花 2009年12月 Web 开发大版内专家分月排行榜第二
Blank
蓝花 2009年10月 Web 开发大版内专家分月排行榜第三
Bbs1
本版专家分:0
CSS3:background-size背景图片尺寸属性
<em>background</em>-size 可以设置背景<em>图片</em>的<em>大小</em>,数值包括 长度length和百分比percentage。 并且会根据背景原点位置 <em>background</em>-origin 设置其<em>图片</em>覆盖的范围。那么下面我们一起来了解这个<em>background</em>-size属性吧。 <em>background</em>-size语法 w3c对<em>background</em>-size的语法规定如下: 属性名: back
background-size(对响应性图片等比例缩放)
实现效果 只需要加上css   <em>background</em>-size: 100% 100%;
理解CSS3中的background-size(对响应性图片等比例缩放)
转自文章    http://www.cnblogs.com/tugenhua0707/p/5260411.html 理解CSS3<em>中的</em><em>background</em>-size(对响应性<em>图片</em>等比例缩放) 阅读目录 <em>background</em>-size的基本属性给<em>图片</em>设置固定的宽度和高度的固定宽度400px和高度200px-使用<em>background</em>-size:400px 200px缩放设置固
图片大小设置background-size
&amp;lt;<em>body</em>&amp;gt; &amp;lt;div&amp;gt; My name is 叶落森&amp;lt;br&amp;gt; My name is 叶落森&amp;lt;br&amp;gt; My name is 叶落森&amp;lt;br&amp;gt; My name is 叶落森&amp;lt;br&amp;gt; My name is 叶落森&amp;lt;br&amp;gt; &amp;lt;/div&amp;gt; &amp;lt;/<em>body</em>&amp;gt;
background-size设置背景图片大小
设置背景<em>图片</em>的<em>大小</em>,以长度值或百分比显示,还可以通过cover和contain来对<em>图片</em>进行伸缩。 语法: <em>background</em>-size: auto | | | cover | contain 取值说明: 1、auto:默认值,不改变背景<em>图片</em>的原始高度和宽度; 2、:成对出现如200px 50px,将背景<em>图片</em>宽高依次设置为前面两个值,当设置一个值时,将其作为<em>图片</em>宽度值
背景图片的位置及大小background-size属性讲解
今天讲解一下简单的背景<em>图片</em><em>大小</em>、位置,因为前段时间遇到手机上下留白太多,背景<em>图片</em>被拉伸的问题 主要是对<em>background</em>-size属性值的各个演示 使用的<em>图片</em>是这张 400*640<em>大小</em> 老规矩,直接代码效果图,大家肯定能看明白 &amp;lt;!DOCTYPE html&amp;gt; &amp;lt;html&amp;gt; &amp;lt;head lang=&quot;en&quot;&amp;gt; &amp;lt;meta char...
HTML5基础加强css样式篇(背景图大小设置:background-size)(三十九)
1.<em>background</em>-size属性: .box { margin: 200px 0 0 200px; width: 200px; height: 200px; <em>background</em>-color: orange; backg
CSS背景图片background如何改变大小以及样式设置
<em>background</em>-color 使用的背景色 <em>background</em>-position 背景图像的位置。 1: <em>background</em>-position:x% y% //第一个值是水平位置,第二个值是垂直位置。 2: <em>background</em>-position-x:center //横轴居中 <em>background</em>-position-x:center //纵轴居中 bac...
css的background属性,背景图片太大无法适应屏幕显示
-
css的background-url属性是怎么计算图片中各个小图的位置的?
如一个png中里面有三个不同颜色的小星星,怎么能准确写出每个小星星的像素位置? 如图
vue图片地址不对显示默认图片并且大小background:cover效果一样
我遇到的问题是这样的:    list要有<em>图片</em>,但是有的<em>图片</em>太长或者太宽,就需要固定长和宽,开始我是用下面的方法的。使用<em>background</em>-size: cover这个属性。但是如果  <em>图片</em>url存在并且错误的时候,代码会执行第一段。那么久出现一个问题就是背景<em>图片</em>解析不出来,显示空白框。   解决方法: 使用img标签,有人会说img没法做到<em>background</em>-size: co...
background:url(image/road.jpg) no-repeat center的基本用法介绍
进行网页界面排版时,大家会经常用到<em>background</em>属性,写一些背景<em>图片</em>,颜色之类的,今天我先简单的介绍一下<em>background</em>属性的背景<em>图片</em>是什么样的效果。
CSS3background-size背景图片尺寸属性
  前言 好了第二天更新<em>background</em>-size,那么就更新,小文章一篇,希望大家一起提高。 <em>background</em>-size 可以设置背景<em>图片</em>的<em>大小</em>,数值包括 长度length和百分比percentage。 并且会根据背景原点位置 <em>background</em>-origin 设置其<em>图片</em>覆盖的范围。那么下面我们一起来了解这个<em>background</em>-size属性吧。 <em>background</em>-siz...
jsp 定义 背景图片控制图片大小
<em>body</em>{   <em>background</em>:url("./1.jpg"); <em>background</em>-repeat:no-repeat; <em>background</em>-size:860px 720px; <em>background</em>-position-x:50%;   }
html学习之控制背景图片大小
可以用css<em>控制</em>‘ <em>body</em> { <em>background</em>-image:url(images/<em>background</em>.jpg); <em>background</em>-size:cover; font-family:"华文楷体"; } 可以直接用html标签<em>控制</em>  <em>background</em>-size: length|percentage|cover|cont
CSS3 背景图片显示尺寸(放大/缩小背景图)(background-size) (背景适配 自适应)
demo.html:&amp;lt;!DOCTYPE html&amp;gt; &amp;lt;html lang=&quot;en&quot;&amp;gt; &amp;lt;head&amp;gt; &amp;lt;meta charset=&quot;UTF-8&quot;&amp;gt; &amp;lt;title&amp;gt;Document&amp;lt;/title&amp;gt; &amp;lt;style&amp;gt; .box { width: 500px;
css文件 如何使背景图片大小适应div的大小
对背景<em>图片</em>设置属性:<em>background</em>-size:cover;可以实现背景<em>图片</em>适应div的<em>大小</em>。 <em>background</em>-size有3个属性: auto:当使用该属性的时候,背景<em>图片</em>将保持100% 的<em>大小</em>显示,不进行任何缩放。超过div的多余部分将被隐藏。当<em>图片</em>过小时,<em>图片</em>会自动平铺。这种属性通常用来做重复性的背景或者做半透明<em>图片</em>背景。 cover:当使用该属性时,<em>图片</em>将被缩放至...
background-size实现 背景图片自适应浏览器大小,但不变形
很多flash站都用到了一张背景图,然后根据浏览器<em>大小</em>自动缩放,但<em>图片</em>不变形。 在CSS3中,有属性: <em>background</em>-size: cover;  //只支持IE9+ -webkit-<em>background</em>-size: cover; //webkit核心 -moz-<em>background</em>-size: cover; //FF核心 -o-<em>background</em>-size: cover; //
如何设置div背景图片大小
我一个div 加了 <em>background</em>: url(img/map.jpg) no_repeat; 但是这map<em>图片</em>有一些大, 放到我的页面上不合适 我把 width 和 height 加在后面后 ,
jsp引用css文件,设置的background属性不起作用
通过jsp引用css文件,在css中设置的<em>background</em>属性不起作用,将该代码复制到jsp文件中可以使用。 哪位大神给讲解一下这是为什么? 以下为该代码: .level_1_Service {
JavaScript可以设置background-size和background-position吗?
var markerImg= document.createElement("img"); markerImg.style.<em>background</em> = 'url(http://ditu.amap.com
background-size:为什么都是在css里但有时候能用有时候又不能用
-
js中使用background-size等带“-”的css样式
js中 <em>background</em>-size
关于background-size各个参数详解
今天公司的要做一个名叫梦幻恋舞的webapp,在设置背景图的时候,明明已经把整个区域的高宽设置成100%了,但是背景图总不能全覆盖整个网页。考虑使用<em>background</em>-size这个属性,在用的时候发现<em>background</em>-size还有好多值,这边特地找一下学习一下。 属性名: <em>background</em>-size 属性值: * 其中 bg-size = [ |
background背景图片铺满背景并且不重复
<em>background</em>-repeat: no-repeat; 不重复 <em>background</em>-size:cover; 背景铺满元素 调整背景<em>图片</em>的宽度或高度(较小者),以铺满整个元素
css3的一个控制背景的属性,background-size可以缩放大小
ackground-size需要两个值,它的类型可以是像素(px)、百分比(%)或是auto,还可以是cover和contain。第一个值为背景图的width,另外一个值用于指定背景图上的height,如果只设定1个值,则第2个默认为auto,但当值为cover和contain时除外。 cover:保持图像的宽高比例,将<em>图片</em>缩放到正好完全覆盖定义的背景区域,其中有一边和背景相同。 ht
background背景图同比缩放铺满整个页面方法的时候碰到的问题
做了那么多的静态页,没想到还是碰到了一个让我懵B的问题,问题:    我这里用了<em>background</em>-size:cover;背景图同比缩放铺满这个页面之后,如果拉伸屏幕,会发现如下图    尴尬,里面的内容还是原来的位置,但是<em>图片</em>同比缩放这样设置肯定是不行的,解决代码如下:    这个问题可能不算什么技术难点,不过遇到了解决了,就记录下来...
background属性的缩放
模仿网易云音乐首页, 这个在鼠标移动上去改变背景 这个是素材 我写了鼠标移动到li上时改变背景 .w_nav ul li:hover { <em>background</em>: url(../img/nva_bg.p
css background-image 背景图片自适应宽高
背景<em>图片</em>与标签宽高保持一致: div { <em>background</em>-image: url('路径'); <em>background</em>-repeat:no-repeat; <em>background</em>-size:100% 100%; -moz-<em>background</em>-size:100% 100%; }
CSS实现背景图片固定宽高比自适应调整
    &amp;lt;img&amp;gt;标签可以使<em>图片</em>在保持宽高比不变的情况下自动调整。我们讨论的是div的背景<em>图片</em>实现固定宽高比自适应调整的方法。这里的<em>图片</em>不是&amp;lt; img&amp;gt;标签一样通过src引入,而是通过css的<em>background</em>-image: url('路径')实现。     实现背景<em>图片</em>固定宽高比缩放我们采用padding-top:(percentage)来实现,padding-top取...
css background:背景图片拉伸铺满
http://www.w3school.com.cn/tiy/c.asp?f=css_<em>background</em>-size&amp;p=8 <em>background</em>: url("img.jpg") no-repeat; <em>background</em>-size:100% 100%;
css 背景图片随屏幕大小自适应全屏
如何设置背景<em>图片</em>填充整个屏幕 <em>background</em>: url(../assets/img/showBg.png) no-repeat top center; <em>background</em>-size: cover; <em>background</em>-attachment: fixed; width: 100%; height: 100%; position: fixed; top: 0; ...
background-image(自适应宽高)
\                .zoomImage {                 <em>background</em>-image:url(images/yuantiao.jpg);                 <em>background</em>-repeat:no-repeat;                 <em>background</em>-size:100% 100%;                 -moz-b...
背景图片自适应大小(css3)
一个做后台的让写h5前端页面,这不是开国际玩笑吗,还好百度,代码贴出来 <em>body</em> {             <em>background</em>: url(/happytime/img/index.jpg) no-repeat center center fixed;              <em>background</em>-size: 100%;//此处要注意,可以填cover也可
背景图片高度自适应
1. 使用padding-top   实现背景<em>图片</em>固定宽高比缩放我们采用padding-top:(percentage)来实现,padding-top取值百分比是相对于包含块的宽度而定。 因为<em>图片</em>尺寸和屏幕尺寸不匹配等原因,可能会出现背景<em>图片</em>显示不完全等情况,我们先用一个小的div来演示一下。     代码如下,限制一个div的最大宽度为750px,根据<em>图片</em>尺寸设定padding-top: 8...
背景图片自适应不变形的问题
这是<em>body</em>里的 text/javascr
body背景图片的自适应
html{ height:100%; } <em>body</em>{ <em>background</em>:url(../image/bg-m.jpg) no-repeat; <em>background</em>-size: cover;//或者<em>background</em>-size: 100% 100%; } <em>background</em>-size contain 与cover的区别 在no-repeat情况下,如果容器宽高比与...
SDL游戏开发教程12(定时器)(暂未实现)
效果图  
背景图自适应铺满窗口
背景图自适应 &amp;amp;nbsp;&amp;amp;nbsp;&amp;amp;nbsp;直接上代码 这是html页面 &amp;amp;lt;<em>body</em> id=&amp;quot;<em>body</em>&amp;quot;&amp;amp;gt; ... &amp;amp;lt;/<em>body</em>&amp;amp;gt; css文件如下: #<em>body</em>{ <em>background</em>-image: url(./images/uploadBg.jpg); position:absolute;
纯CSS控制背景图片100%自适应填充布局
原文:http://www.uedsc.com/css-<em>background</em>-size-100.html 解决: html,<em>body</em>{height: 100%;width: 100%;margin:0;padding:0;} <em>body</em>{ <em>background</em>:url(bg-login.png)no-repeat; width:100%; height:100%; ba
如何让body背景图自适应浏览器窗口大小
这两天真的被背景图问题弄的头大,一会是浏览器窗口<em>大小</em>改变,背景图就重复,或者是浏览器有滚动条,或者加上no-repeat之后,重复的部分就变成空白!!!真的是一个头,两个大!!!!! 现在终于找到解决方法了,不仅不重复,还没有滚动条,简直整个人都解放了,哈哈哈!下面附上代码,其实是特别简单的问题,但某些时候,我们就是会被一些很小的问题困扰很久...... html{
关于body的默认尺寸
<em>body</em>默认应该是占满全屏的(忽略默认边距的情况下),但是究竟是怎样的一个沾满全屏呢 如果给<em>body</em>设置如下属性 <em>body</em>{ <em>background</em>-color: red; } 效果: 满屏的红色,那么是不是说明<em>body</em>是宽度和高度都是满屏的呢? 答案是:不是的,我们可以验证一下: 给<em>body</em>设置如下属性: <em>body</em>{ ...
CSS 如果不给body标签设置大小,那它默认的宽度好高度是多少,并且是居中的吗?
默认高度是没有的,不过由于浏览器本身的bug,如果不用css样式定义<em>body</em>的margin:0;,则会大概有2个像素下移。 默认不是居<em>中的</em>,是居左的,用下面这个可以让让居中。 <em>body</em>{margin:0 auto;}
网页背景图片设置——任意大小
通过在网页中使用层,可轻易的实现网页背景<em>图片</em>的任意<em>大小</em>设置。 内容... 另一种方法
background-size 设置背景图片大小
<em>background</em>-size 设置背景<em>图片</em>的<em>大小</em>,以长度值或百分比显示,还可以通过cover和contain来对<em>图片</em>进行伸缩。
关于background和height:100%的一些总结
1.给定<em>body</em>宽高,给定背景颜色<em>background</em>-color,但是并没有预期的背景颜色只出现在<em>body</em>给定宽高的区域,而是全屏幕。 2.页面的html,height的高度100%和默认的滚动条 3.<em>图片</em>自适应容器<em>大小</em>,这里img用到两个css样式,max-width:100%,height:auto;<em>图片</em>不会变形 4.背景<em>图片</em>,设置<em>background</em>-size;<em>图片</em>也可很好的自适应容器<em>大小</em>
用CSS给图片设置大小
“梦里玉人方下马,恨它天外一声鸿”很多时候我们在给标签设置宽和高时,都不尽人意.这时候我们可以用max-height和max-width或者min-height和min-width来这是宽高width:350px;height: auto;max-height: 500px;max-width: 350px; min-width:350px ;
Windows Forms In Action下载
英文版,.NET中Form编程的经典书籍! 相关下载链接:[url=//download.csdn.net/download/LanBin520/2472953?utm_source=bbsseo]//download.csdn.net/download/LanBin520/2472953?utm_source=bbsseo[/url]
OVF文件中文描述下载
OVF文件中文描述,简述OVF格式对应的节点意义。可以用来参考OVF设计 相关下载链接:[url=//download.csdn.net/download/zxm0113/4849340?utm_source=bbsseo]//download.csdn.net/download/zxm0113/4849340?utm_source=bbsseo[/url]
《数字图像处理》考试复习与重点-广工2012年下载
本资料为广东工业大学2012年《数字图像处理(第2版)》考试重点。其中内含2011年试题卷。(PS:本年的考试与去年的有约40%的相似度) 相关下载链接:[url=//download.csdn.net/download/justworm/4930853?utm_source=bbsseo]//download.csdn.net/download/justworm/4930853?utm_source=bbsseo[/url]
相关热词 c#部署端口监听项目、 c#接口中的属性使用方法 c# 昨天 c#func链接匿名方法 c#怎么创建文件夹 c#从键盘接收空格 c#da/ad c#部门请假管理系统 c#服务器socket c# 默认的访问修饰符
我们是很有底线的