使用CSS更改图像的大小

Question

这个问题已经在这里有了答案：

• 使用CSS按比例调整图像大小？ [重复] 18个答案

是否可以使用CSS更改图像大小？ 我当时想使用缩略图，但是有问题...但是后来我想到，是否可以使用CSS更改图像的大小？ 例如

<style>
#a{
    .height:70px;
    .width:70px;

}

</style>

<div id = "a">
<img src="{{post.image}}" />
</div>

我试过了，但是行不通....有人知道为什么吗？

在这里， https：//blog.openshift.com/day-16-goose-extractor-an-article-extractor-that-just-works/他们正在使用javascript或jquery来控制图像的大小，它们的状态如何那？ 有人可以告诉我如何将其与我的<img src="{{post.image}}" />

<script type="text/javascript" src="static/js/jquery.js"></script>
<script type="text/javascript">
    $("#myform").on("submit", function(event){
        $("#result").empty();
        event.preventDefault();
        $('#loading').show();
        var url = $("#url").val()
        $.get('/api/v1/extract?url='+url,function(result){
            $('#loading').hide(); 
            $("#result").append("<h4>"+result.title+"</h4>");
            $("#result").append("<img src='"+result.image+"' height='300' width='300'</img>");
            $("#result").append("<p class='lead'>"+result.text+"</p>");
    })


    });

</script>

Answer 1

您要更改包含图像的块的大小，但不能更改图像本身。

 #a img { height: 70px; width: 70px; } 

 <div id="a"> <img src="http://d30y9cdsu7xlg0.cloudfront.net/png/304282-200.png" /> </div> 

另外，CSS属性前面没有点：)

Answer 2

Kim，您可能想用CSS按比例查看Resize图片？ 它可以帮助您找到解决方案。

Answer 3

尝试这个：

<style>
.my-size{
  height: 100px !important;
  width: 100px !important;
}
</style>

在你的HTML

<img src="{{post.image}}" class="my-size"/>

如果您需要其他帮助，请随时发表评论