2016-09-23 9 views
-7

は、私はちょうど同じCSSスタイルのコードをコピーし、以下のページのようなページを作成していますが、テキスト整列は何かを起こります。 http://mp.weixin.qq.com/s?__biz=MjM5ODQwMjA4MA==&mid=2649293603&idx=1&sn=57f38200555dcba76d6358594416c089&scene=1&srcid=0922hwo0hW1YFpZ5km00qu8f#rd何か:中央

赤い線のテキストは中央にしてください。どこで揃えますか:左から来ますか?私はコードでこれを書いていません。私が書いたhtmlファイルのソースコードです。ここにテキストの

enter image description here

スタイルのコードは次のとおりです。

<section style="box-sizing: border-box; background-color: rgb(255, 255, 255);"><section style=" box-sizing: border-box; "><section style=" margin-top: 10px; margin-bottom: 10px; box-sizing: border-box; "><section style="box-sizing: border-box; text-align: center;"><section style="display: inline-block;vertical-align: top;padding: 8px 5px 5px 3px;width: 50%;box-sizing: border-box;border-right: 1px solid #66CCC5;"><section style="box-sizing: border-box;"><section style="margin-top: 0.5em; margin-bottom: 0.5em; box-sizing: border-box;"><section style="box-sizing: border-box;width: 4em;height: 4em;display: inline-block;vertical-align: bottom;border-radius: 100%;background-image: url(&quot;http://mmbiz.qpic.cn/mmbiz/xpE6LLZTjLjZbC3icL0gxysDXhDQB9iaUPkFkZTfWxshdqfjuibeO84QQRovVcvYY4yhRLQPHusytjcicic7iav0GNvg/0?wx_fmt=jpeg&quot;);background-size: cover;background-position: 50% 50%;background-repeat: no-repeat;" class=""><br></section><p><span style="font-size: 14px;color: rgb(102, 204, 197);line-height: 1.6;">阿禅 Jason Ng</span></p></section></section></section><section style="display: inline-block;vertical-align: top;padding: 6px;width: 50%;box-sizing: border-box;"><section style="box-sizing: border-box; border: 1px solid rgb(102, 204, 197); padding: 8px 5px; width: 120px; color: rgb(102, 204, 197); border-radius: 2px; margin: auto; line-height: 20px; font-size: 14px;"><p>读完本文<br>大约需要</p><section style="font-size: 30px;color:#666;line-height: 38px;">6</section>分钟</section></section></section></section></section></section><

ソースコード:ビューソース:http://7rf31y.com1.z0.glb.clouddn.com/index.html ローカルのHTMLファイルをコピーして貼り付けることができ、その後、オープンそれはクロムである。

+1

質問**好ましく中[**スタックスニペット**](https://blog.stackoverflow.com/2014/09/ introduction-runnable-javascript-css-and-html-code-snippets /)があります。 [**最小限で完全で検証可能なサンプルを作成する方法**](http://stackoverflow.com/help/mcve) –

+0

@Paulie_Dはいくつかのコードを追加しました –

答えて

1

スパンには整列スタイルのデフォルトはありませんが、pはありませんので、スパンは左揃えを含むpのスタイルを継承します。次のように、センターテキストに>コンテナとコンテナの上にparagrafをクラスを追加する必要があります私はあなたは、単にPを使用することができ、APにこのスパンを置くためにどのような理由を参照してくださいいけないが、それは関係ありませんね... すべての ファースト:

.foo, .foo > p{text-align:center;}
<div class="foo"> 
 
    <p class="foo2"> 
 
    <span> 
 
     lorem ipsum dolor sit amet 
 
    </span> 
 
    </p> 
 
</div>

これは、子の宣言を使用せずに動作する必要がありますが、私はあなたのstylementを知らないと私はエラーを防ぐためであるあなたとしましょう。そして、

乾杯-.- htmlタグにスタイルをしないでください!質問自体に**それを再現するために必要な最短のコードが含まれている必要があり、コードの助けを求める

関連する問題