Markdown 中的文章样式（HTML 和 CSS）答案

【问题标题】：Styling articles in markdown (HTML & CSS)Markdown 中的文章样式（HTML 和 CSS）
【发布时间】：2013-01-25 03:15:30
【问题描述】：

我正在尝试为从纯文本生成的文本设置样式，然后通过 markdown 将其转换为 HTML

想法是获取一个段落，然后是居中的照片（以替代文本作为脚注），然后是下一个段落。

我从我的页面获得的 HTML 如下所示：

<article class="news_item">
<header><a href="#">Hola</a><span><time datetime="2013-01-24" pubdate>24-01-2013</time></span></header>
<p>Lorem ipsum dolor pscing elitr, sed diam nonumy eirmod </p>
<p><img alt="Alt text" src="bla/bla/bla.png"/></p>
<p>labore et dolore magna aliquyam erat, </p>

</article>

样式是：

.news_item {
    clear: left;
    text-align: justify;
    max-width:600px;
}

.news_item header{
    font-size: 16px;
    font-weight: bold;
}

.news_item time{
    font-size: 12px;
    position:relative;
    float: right;
}


.news_item img {
    max-width: 390px;
    float: center;
    position: relative;
    clear: both;
    margin-left:auto;
    margin-right:auto;
    }

.news_item p img {
    max-width: 390px;
    padding: 5px;
    float: center;
    position: relative;
    clear: both;
    margin-left:auto;
    margin-right:auto;
    }

.news_item p {
    width: 600px;
    text-align: justify;
    }

不管我做什么，图片永远不会在文章中居中。我想这与降价有关，在图像周围放置一个<p></p>，但我不知道如何处理。

谁能帮帮我？

【问题讨论】：

标签： html css markdown

【解决方案1】：

使用以下方式设置图像样式：

display:block;
margin-left:auto;

center 是无效的浮点值。

这是一个演示：http://jsfiddle.net/JxBLq/

【讨论】：

谢谢。这让我发疯了。