Html 居中图像 php
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/2424499/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Centering images php
提问by zorgo
I'm trying to center an image in php. I'm currently using this line of code
我试图在 php 中居中图像。我目前正在使用这行代码
echo '<img src="newimage.jpg" width="110" height="120" class="centre">';
However, this seems to have no effect. I've also tried using something like this,
然而，这似乎没有效果。我也试过使用这样的东西，
img.center {
display: block;
margin-left: auto;
margin-right: auto;
}
<img src="newimage.jpg" alt="Suni" class="center" />
but this merely gives me a syntax error, how do I go about fixing this? Thanks
但这只是给了我一个语法错误，我该如何解决这个问题？谢谢
回答by Ross
echo '<div class="center"><img src="newimage.jpg" width="110" height="120"></div>';
and use
并使用
div.center {
instead of
代替
img.center {
Your php syntax is correct, is the syntax error coming from php?
你的php语法是正确的，是不是php的语法错误？
回答by DisgruntledGoat
You have a PHP error in your code, unrelated to HTML/CSS.
您的代码中有一个 PHP 错误，与 HTML/CSS 无关。
Are you sure you're putting all the pieces of code in the correct places? i.e. CSS should go in an external stylesheet or between <style type="text/css">and </style>in your HTML.
您确定将所有代码段放在正确的位置吗？即CSS应该在外部样式表之间或<style type="text/css">和</style>你的HTML。
It's generally better to put chunks of HTML code outside of the PHP sections too. Something like this:
通常最好将 HTML 代码块也放在 PHP 部分之外。像这样的东西：
<?php
//some php code
?>
<style type="text/css">
img.center {
display: block;
margin-left: auto;
margin-right: auto;
}
</style>
<img src="newimage.jpg" alt="Suni" class="center" />
<?php //continue your PHP code here...
回答by Jamie Chapman
This is a working example of a centred image. See what you think :-)
这是一个居中图像的工作示例。看看你的想法:-)
<html>
<head>
<title>Test</title>
<style type="text/css">
.myImage
{
margin: auto;
display: block;
}
</style>
</head>
<body>
<img src="http://sstatic.net/so/img/logo.png" alt="My Image" class="myImage"/>
</body>
</html>
回答by Raguvaran R
Add this code to your css:
将此代码添加到您的 css 中：
div img.center {
margin:0 auto;
}
回答by Rigobert Song
This looks like a css question
这看起来像一个 css 问题
Try margin:0 autoin your css
试试margin:0 auto你的 css
