1. 首页>百科大全 > 百科

html怎么把缩放

作者:马阳华
2020-05-13
百科

1. html图片如何按屏幕大小等比例缩放

html图片按屏幕大小等比例缩放若浏览器允许可按Ctrl+鼠标滚轮滑动缩放,或用代码。

具体方法如下:

1. Ctrl+鼠标滚轮滑动缩放

2. css代码与htlm代码

3. CSS 代码如下:

#background

{

position: fixed;

top: 0;

left: 0;

width: 100%;

height: 100%;

overflow: hidden;

background-color: #211f1f;

display:none8;

}

#background .bg-photo

{

position: absolute;

top: 0;

left: 0;

width: 100%;

height: 100%;

display: none;

overflow: hidden;

-webkit-background-size: cover !important;

-moz-background-size: cover !important;

-o-background-size: cover !important;

background-size: cover !important;

}

#background .bg-photo-1

{

background: url('../image/alone.jpg') no-repeat center center;

}

#background-ie {

position: fixed;

top: 0;

left: 0;

width: 100%;

height: 100%;

overflow: hidden;

background-color: #211f1f;

}

4. HTML代码如下:

<div id="background">

<div class="bg-photo bg-photo-1" style="display: block;"></div>

</div>

参考资料

html 网页背景图片根据屏幕大小CSS自动缩放.CSDN博客[引用时间2017-12-29]

2. html如何设置图片大小

html插入图片有两种方式:一种是通过标签插入的正常的图片,另一种是通过css样式插入的背景图片。

问题分析: 1、首先你是通过第二种方式插入的是背景图片,直接用width和height只能控制div的宽度和高度。 2、如果你插入的图片是通过标签的方式来插入的话,可以通过自身的属性控制图片大小,代码格式是:。

3、如果非要通过css控制背景图片的大小,可以通过background-size样式来实现,具体的css格式是:background-size:宽度 高度; (如下图所示)。 扩展资料: 1、background 是用于在一个声明中设置所有背景属性的一个简写属性。

格式: background: {属性值} 继承性: NO; 可能的值: background-color(背景颜色) background-image(背景图片) background-repeat(背景拉伸方式) background-attachment(固定或者随着页面的其余部分滚动) background-position(背景定位) 新增的值: background-clip(规定背景的绘制区域) background-origin(相对于容器中来定位背景图像) background-size (背景图像的大小) 参考资料: 百度百科-background。

3. html中怎么把图片按比例缩放在里面

首先,你使用span元素并不是很合理,因为span元素是行元素,不能够设置宽高

如果一定要使用span元素,需要设置宽高,之后对图片进行处理

将span元素调整为块元素(设置display: block),赋予固定的宽度或百分比

之后为图片设置宽度和高度,宽设置为100%,即可让图片等比例进行缩放,宽度等于span的宽度,高度会等比例变化

.box {

display: block;

width: 200px;

}

.box img {

width: 100%;

}

4. html背景图片如何自动缩放,

纯HTML没办法做到自动缩放,至于JS我就不清楚了。

我这边推荐HTML两种方法:

1、同时制作手机端、PC端、IPAD端三张背景图片。根据不同环境调用!

2、只做一张图,利用background-image的background-size:属性来适应屏幕,如下代码; background-image:url(../image/img.png); background-repeat:no-repeat; background-size:100% 100%;-moz-background-size:100% 100%;}

5. html中,有什么方法或标签能让图片大小自动按设定放大缩小的

使用javascript,根据你的设定设置img大小,这里有个例子:

function AutoResizeImage(maxWidth,maxHeight,objImg){

var img = new Image();

img.src = objImg.src;

var hRatio;

var wRatio;

var Ratio = 1;

var w = img.width;

var h = img.height;

if(w > maxWidth){ //判断宽度大于可视化的情况

wRatio = maxWidth / w;

hRatio = maxHeight / h;

if (maxWidth ==0 && maxHeight==0){

Ratio = 1;

}else if (maxWidth==0){//

if (hRatio<1) Ratio = hRatio;

}else if (maxHeight==0){

if (wRatio<1) Ratio = wRatio;

}else if (wRatio<1 || hRatio<1){

Ratio = (wRatio<=hRatio?wRatio:hRatio);

}

if (Ratio<1){

w = w * Ratio;

h = h * Ratio;

}

objImg.height = h;

objImg.width = w;

}

}以上是js的方法

下面这个是引用的img

<img id="lc_div" src="图片路径" onl oad="AutoResizeImage(500,500,this)" />

6. css 可以按比例缩放图片吗

解决这个问题的方法如下:

1、先在html里添加一个img图片标签。

2、运行页面后,这是完整显示图片大小的。图片大概是400x260左右的大小。

3、要进入图片缩放,可以在css样式里设置图片的宽度和高度,但不要宽和高都设置了,比如这里都设置为100px。

4、设置后,看下页面可以看到图片现在变形了。

5、正确的方法应该是只设置其中一个,比如设置宽度为100px,高度设置为自动就行了。

6、这里设置后的效果,图片并没有变形。

7、同样,如果是限定高度的大小,就设置宽度为自动,图片同样不会变形,这样问题就解决了。

7. html 怎样不缩小图片 而改变图片大小呢

参见百度首页源码。百度logo都是一张很大的图里面取一部分的

<style type="text/css">

.bg{ width:200px; height:100px;background-image:url(images/22.png);background-repeat:no-repeat;background-position:left top;}

</style>

<input type="button" class="bg"/>

// background-position可以是坐标

w3school也有教程 搜索关键词就有

8. 如何用HTML 缩小图片

<html>

<head>

<style type="text/css">

img {

visibility: hidden; //图片属性设为隐藏! (删掉这句就能看到图片!)

width: 5px; //控制图片的宽度

heigth: 5px; //控制图片的高度

}

</style>

</head>

<body>

<h3>;这里的主要效果就是在文本中加N多图片效果</h3>

<p>;主体文章内容: <br /><br />

<img id="nn" src="icn_point.gif" />

<img id="nn" src="icn_point.gif" />

<img id="nn" src="icn_point.gif" />

<img id="nn" src="icn_point.gif" />

<img id="nn" src="icn_point.gif" />

其它内容

</p>

</body>

</html>

html怎么把缩放

推荐阅读
  • 努比亚z9max手机音乐效验

    该机拥有HIFI级音乐芯片,音乐效果不凡。具体体现在:1.音量调节,正常听音乐中高低音都是一个音量,而杜比音效能动态扩大某个音量。比如放打鼓声,杜比会及时提高低音加强鼓声。2.加强音域,杜比音效有开阔、集中、…

    百科 2024-09-20
  • 是atChristmas还是inChristmas

    此处该用“on”。在圣诞节正确表达应为 “on Christmas ”。有具体日期的,比如知道几月几日的都用“on” ;不知道日期,但知道年份和月份的用“in” ,知道具体时间,比如几点几分用“at”。…

    百科 2024-09-20
  • 个体工商户应交纳什么税

    纳税标准根据国家税务总局《个体工商户定期定额征收管理办法》文件精神 ,定期定额征收方式适用的税种及税率如下:1、根据《中华人民共和国增值税暂行条例》规定,自2009年1月1日起,小规模纳税人增值税征收率为3%…

    百科 2024-09-20
  • 材料成本差异率为负数是什么意思

    材料成本差异额,是指材料的实际成本和计划成本之间的差额。差异率负数表示节约差异,即实际成本比计划成本小。正数表示超支差异,即实际成本比计划成本大。…

    百科 2024-09-20
  • 塞翁失马焉知非福是什么意思

    比喻一时虽然受到损失,反而因此能得到好处。也指坏事在一定条件下可变为好事,反之亦然。形容人的心态,一定要乐观向上,任何事情都有二面性,不好的一面,有可能向好的一面转化。塞翁失马,焉知非福出自《 淮南子…

    百科 2024-09-20