2016-12-27 7 views
1

私はプログラミングを始めたばかりです。私はここで何らかのプロトコルに従わなかったことに対して謝罪します。テキスト整列:センターが失敗しました。おそらく間違っているのでしょうか?

私のフッタテキストはページを中心にしていません。私はtext-align:centerタグを持っていますが、登録に失敗しています。

アドバイスありがとうございます。

:)任意の助け

<style> 

h2 { 
font-family: 'times new roman'; 
font-style: bold; 
font-size: 50px; 
text-align:center; 
margin-top: 70px; 
margin-left: 120px; 
margin-right: 120px; 
} 

a { 
text-align:center; 
font-family: 'Courier New', Courier, monospace; 
letter-spacing: 0px; 
font-size: 16px; 
font-weight: 500; 
} 

a:link {text-decoration: none;color: black; } 
a:visited {text-decoration: none; color: black; } 
a:hover { letter-spacing: 20px; background-color: yellow; color: black; } 
a:active { background-color: yellow; color: black; } 

li {display: inline-block; padding-right: 40px; }  

</style> 
</head> 


<div style:"position: center"> 

<h2>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla ipsum tortor, pharetra et eleifend in, tristique vel quam. Duis eu leo pretium, tempus sapien in, malesuada est. Integer at lorem nec mi finibus maximus eu sit amet nisi.  </h2> 

</div> 

<div style="position: absolute; bottom: 0px; text-align:center"> 
<ul> 
<li><a href="mailto:youremailaddress" target="_blank">E M A I L</a></li> 
<li><a href="http://www.twitter.com" target="_blank">T W I T T E R</a></li> 
<li><a href="http://www.facebook.com" target="_blank">F A C E B O O K</a> </li> 
<li><a href="http://www.instagram.com" target="_blank">I N S T A G R A M</a>    </li> 
</ul> 
</div> 

</body> 

</html> 

ありがとう!問題の

答えて

2

たくさん:

  1. これはプログラミングではありませんが、これは、マークアップです。
  2. 属性は=ではなく、:です。 (style:"position: center"
  3. position: center;はありません。text-align: centerである必要があります。

スニペット

h2 { 
 
    font-family: 'times new roman'; 
 
    font-style: bold; 
 
    font-size: 50px; 
 
    text-align: center; 
 
    margin-top: 70px; 
 
    margin-left: 120px; 
 
    margin-right: 120px; 
 
} 
 
a { 
 
    text-align: center; 
 
    font-family: 'Courier New', Courier, monospace; 
 
    letter-spacing: 0px; 
 
    font-size: 16px; 
 
    font-weight: 500; 
 
} 
 
a:link { 
 
    text-decoration: none; 
 
    color: black; 
 
} 
 
a:visited { 
 
    text-decoration: none; 
 
    color: black; 
 
} 
 
a:hover { 
 
    letter-spacing: 20px; 
 
    background-color: yellow; 
 
    color: black; 
 
} 
 
a:active { 
 
    background-color: yellow; 
 
    color: black; 
 
} 
 
li { 
 
    display: inline-block; 
 
    padding-right: 40px; 
 
}
<div style="text-align: center;"> 
 
    <h2>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla ipsum tortor, pharetra et eleifend in, tristique vel quam. Duis eu leo pretium, tempus sapien in, malesuada est. Integer at lorem nec mi finibus maximus eu sit amet nisi.</h2> 
 
</div> 
 

 
<div style="position: absolute; bottom: 0px; right: 0; text-align: center; left: 0;"> 
 
    <ul> 
 
    <li><a href="mailto:youremailaddress" target="_blank">E M A I L</a></li> 
 
    <li><a href="http://www.twitter.com" target="_blank">T W I T T E R</a></li> 
 
    <li><a href="http://www.facebook.com" target="_blank">F A C E B O O K</a> </li> 
 
    <li><a href="http://www.instagram.com" target="_blank">I N S T A G R A M</a> </li> 
 
    </ul> 
 
</div>

ない、これはあなたが期待しているものであるかどうかわから:

preview

+1

ありがとう@PraveenKuman!マークアップ対プログラミングミスをもう一度しないでください。それは、私がページ上のEmail ...ブロックを中心にしていることを除いて、私が探しているものです。 – bowwowdom

+0

@bowwowdomコードの更新をお手伝いします。今すぐ解決のために、しばらくお待ちください。 –

+0

@bowwowdomフッタdivには、以下のようなスタイルを指定してください: 'position:absolute; bottom:0px; right:0; text-align:center; left:0;' –

0

をを追加してみてください0をフッターdivのスタイルに設定します。 また、あなたのコードにいくつかの他の問題があります...

位置がありません:center。有効な値のためにこれらを参照してください: https://developer.mozilla.org/en-US/docs/Web/CSS/positionhttp://www.w3schools.com/cssref/pr_class_position.asp

HTML属性を設定していないために "=" を使用 ":"。

+0

あなたは 'margin:auto'を' width:100% 'と指定するのはなぜですか? W3Schools以外の別のWebサイトを引用できますか?この答えは私のものよりどうやって優れていますか? –

+0

彼はあまりにも余裕の設定を必要としないことは本当です。編集されました。もちろん、私はW3Schools以外のソースを追加しました。私は彼のフッターの問題に対する解決策を提示しました。あなたは彼のメインコンテンツテキストを中心にしました。 – petryuno1

+0

Thanks @ petryuno1!それは動作します---それは水平スクロールバーを追加します。これを削除する方法はありますか? – bowwowdom