中心调整图像时调整大小？

当我按照自己需要调整“标识”的大小时，它不再在页面中心对齐，现在它在左边，当我最后添加那两个.logga时。中心调整图像时调整大小？

所以这是我的代码：

body { 
 
    background-image: url(http://i.stack.imgur.com/iOkRy.png); 
 
    background-color: #cccccc; 
 
\t background-repeat: no-repeat; 
 
\t background-size: cover; 
 
} 
 
.logga { 
 
    width: 200px; 
 
    height: 120px; 
 
} 
 

 
.logga img { 
 
    width: 100%; 
 
    height: auto; 
 
}

<!DOCTYPE HTML> 
 
<html> 
 
\t <head> 
 
\t \t <title>Hello</title> 
 
\t \t <meta charset="UTF-8"> 
 
\t \t <link rel="stylesheet" type="text/css" href="style.css"> 
 
\t </head> 
 

 
\t <body> 
 
\t \t <div class="logga" align="center"> 
 
\t \t \t <a href="/start"><img src="http://i.stack.imgur.com/iOkRy.png" alt="Hello"></a> 
 
\t \t </div> 
 
\t </body> 
 

 
</html>

来源

2015-10-06 moseby

-1

试试这个。你会让你的图像居中。

body { 
 
    background-image: url("bg2.jpg"); 
 
    background-color: #cccccc; 
 
    background-repeat: no-repeat; 
 
    background-size: cover; 
 
} 
 
.logga { 
 
    width: 200px; 
 
    height: 120px; 
 
    margin-left: auto; 
 
    margin-right: auto; 
 
    background-color:white; 
 
} 
 

 
.logga a{ 
 
    display:block; 
 
} 
 
.logga img { 
 
    display:block; 
 
    width: 100%; 
 
    height: auto; 
 
}

<div class="logga"> 
 
      <a href="/start"><img src="http://7-themes.com/data_images/out/62/6983929-fall-nature-photography.jpg" alt="Hello"></a> 
 
     </div>

来源

2015-10-06 15:21:46

非常感谢！我也删除了背景色，所以它完全透明，但谢谢！现在它可以工作 – moseby

-1

align属性在HTML5不支持。使用CSS代替，如下所示：

.logga { 
    width: 200px; 
    height: 120px; 
    margin: 0 auto; /* this places .logga in the center of the body */ 
    text-align: center; /* this centers inline elements inside .logga, you don't necessarily need it */ 
}

来源

2015-10-06 15:22:49 Lariza

它与包含div的中心对齐。如果你需要div来居中。父元素需要具有width属性，然后子元素需要margin-left: auto和margin-right: auto;。

例小提琴这里：

https://jsfiddle.net/8yhsr5ba/

来源

2015-10-06 15:23:18 Jay

-1

只需使用保证金：汽车;很有型。

来源

2015-10-06 15:24:28

您可以通过为.logga类指定margin:0 auto;来解决此问题。

.logga{ 
    width: 200px; 
    height: 120px; 
    margin:0 auto; 
}

这可以让浏览器自动计算元素每边的间距。注意：虽然不推荐使用，但也可以使用<center></center>

<!DOCTYPE HTML> 
<html> 
    <head> 
     <title>Hello</title> 
     <meta charset="UTF-8"> 
     <link rel="stylesheet" type="text/css" href="style.css"> 
    </head> 
    <body> 
     <center> 
      <div class="logga" align="center"> 
       <a href="/start"><img src="logga.png" alt="Hello"></a> 
      </div> 
     </center> 
    </body> 
</html>

来源

2015-10-06 15:44:23 Andrew

中心调整图像时调整大小？

回答

相关问题