消除图像标签之间的横向差距HTML/CSS

我只是在练习HTML和CSS，而我遇到了一个恼人的问题。我想知道这个横向差距是什么，以及如何去除它？消除图像标签之间的横向差距HTML/CSS

在此先感谢

enter image description here

<!DOCTYPE html> 
<html lang="en"> 
    <head> 
     <title>Practice</title> 
     <meta name="viewport" content="width=device-width, initial-scale=1.0" /> 
     <meta content="text/html;charset=utf-8" http-equiv="Content-Type" /> 
     <meta content="utf-8" http-equiv="encoding" /> 
     <style> 
     html,body 
     { 
     margin:0; padding:0; height:100%; 
     } 
     </style> 
    </head> 
    <body> 
     <script src="./js/jQuery.js"></script> 

     <img id="sample-img" src="Green-Nature-wallpaper.jpg" style="margin:0; padding:0;"></img> 
     <img id="sample-img2" src="Green-Nature-wallpaper.jpg" style="margin:0; padding:0;"></img> 
     <script> 
     $(document).ready(function() { 
      $("#sample-img").width($(window).width()); 
      $("#sample-img").height(0.6*$(window).height()); 
      $("#sample-img2").width($(window).width()); 
      $("#sample-img2").height(0.6*$(window).height()); 
     }); 
     $(window).resize(function() { 
      $("#sample-img").width($(window).width()); 
      $("#sample-img").height(0.6*$(window).height()); 
      $("#sample-img2").width($(window).width()); 
      $("#sample-img2").height(0.6*$(window).height()); 
     }); 
     </script> 
    </body> 
</html>

来源

2014-12-06 Apha

当您在浏览器中进行调试时，您会看到什么？ – ElGavilan 2014-12-06 01:05:57

@ElGavilan Nothing，Empty .. – Apha 2014-12-06 01:07:15

它的图像之间的空白。使他们显示块。 – 2014-12-06 01:08:09

你试过设置图像margin和padding为0？

<style> 
    img { 
     position:relative; 
     display:block; 
     margin:0; 
     padding:0; 
    } 
</style>

来源

2014-12-06 01:08:20

它工作了谢谢。 – Apha 2014-12-06 01:10:17

这可行，但不一定是答案。它将图像的默认内联样式更改为阻止。这可以是好的，但可能会根据上下文导致不良影响。 – Rob 2014-12-06 01:23:01

这取决于页面是否使用其他图像。如果是这样，他可以简单地为他想要显示为块的图像分配一个类，并将其他图像保留为其默认CSS。 – 2014-12-06 01:26:02

图像是内嵌内容，就像单词或单个字符一样。图像与放置字符的基线对齐。将vertical-align:bottom添加到图像CSS。图像是内联元素，放置方式与文本类似，您所看到的是为字母“g”的下卷曲等文本字体的下行保留的间隙。

来源

2014-12-06 01:10:29 Rob

消除图像标签之间的横向差距HTML/CSS

回答

相关问题