css怎么把图片缩小

css把图片缩小的方法:可以通过设置图片的width或者height属性来实现图片的宽度高度,从而将图片缩小,比如在css中添加“width:300px; height:200px;”样式代码将图片设置成宽度300px、高度200px大小,如需缩小将属性值减少即可。

css怎么把图片缩小

给图片的img标签设置width或者height的任意一个,图片会自动等比例缩放。我们可以设置这两个属性值小于原图片大小使图片缩小。


示例:


<html>

<head>

<style type="text/css">

.div1 {

    width:300px; 

    height:200px;

    border:solid 1px red

}

.div1 img{

      width:50%;

}

</style>

</head>

<body>

<div class="div1"><img src="1.jpg" /></div>

<img src="1.jpg" />

</body>

</html>

效果图:

css怎么把图片缩小

width 属性:


width 属性设置元素的宽度。


说明


这个属性定义元素内容区的宽度,在内容区外面可以增加内边距、边框和外边距。


行内非替换元素会忽略这个属性。


属性值:

  • auto 默认值。浏览器可计算出实际的宽度。

  • length 使用 px、cm 等单位定义宽度。

  • % 定义基于包含块(父元素)宽度的百分比宽度。

  • inherit 规定应该从父元素继承 width 属性的值。


我们的服务
专业提供中小企业网站建设.公司网站建设.外贸网站建设.营销型网站建设,响应式网站建设,商城网站定制,手机网站,微信小程序定制.php应用开发服务,公司成立于2014年,8年专注网站建设,秉承“以客户为根本,以科技为核心,以市场为导向”的经营理念;服务电话13714666846(微信同号)

声明:本站所有作品(图文、音视频)均由用户自行上传分享,或互联网相关知识整合,仅供网友学习交流,若您的权利被侵害,请联系 管理员 删除。

本文链接:http://news.ew35.com/