2012-02-15 4 views
0

私はちょうどGoDaddyを使って簡単なウェブサイトをホストし始めました。私はちょうどこのウェブサイトのためのHTMLとCSSを書いてみたい、私はWYSIWYGエディタのいずれかを使用することに興味を持っていないまたは彼らが他に何をしています。私はホストされたファイルシステムに入れたbootstrap.cssファイルにlinkしようとしましたが、どのスタイルも適用されません。このリファレンスと私のコードの残りの部分は、以下に見られることができます。<head>セクションのCSSがGoDaddyのホストされたWebサイトでロード/取得されないのはなぜですか?

<!DOCTYPE HTML> 
<html lang="en"> 
    <head> 
     <meta charset="utf-8"> 
     <title>My Website</title> 

     <!-- Scripts --> 


     <!-- Styles --> 
     <link href="bootstrap/css/bootstrap.css" rel="stylesheets"> 
     <style type="text/css"> 
      body { 
       top-margin: 100px; 
      } 
     </style> 
    </head> 


    <body style="margin-top: 100px;"> 
    <div class="container"> 
     <div class="hero-unit"> 
      <h1>Big Title Text</h1> 
      <p>Catchy Tagline with lots of wit!</p> 
     </div> 
    </div> 
    </body> 
</html> 

私はChromeの点検要素ツールを使用してウェブサイトを見て試してみましたが、それは単にスタイルのいずれも適用されていないことを示しています。私はHTMLソースを見ているときにCSSソースを開くことができるので、CSSファイルが正しくリンクされていることがわかります。この動作によって混乱

は、私はまた、頭の中で見ることができるスタイルタグを追加してみました。これは少なくともInspect Elementに現れましたが、それが適用されないようにそれを通るラインがあり、マージンの差異はウェブサイトに適用されませんでした。

最後に、bodyタグ自体にスタイル属性を追加して、マージンを修正しようとしました。実際に適用されましたが、テキストが100ピクセル下に移動して視覚的に確認されました。

私は私のローカルマシン上のCSSやbootstrap.cssとのトラブルを持っていたことがないので、私は、これはGoDaddyのホスティングとは何かを持っていると仮定しています。ここで何が起きているのかについての手がかりは?

答えて

2

ここでは2つのことが間違っています。 linkタグの

  1. rel属性がstylesheet、ないstylesheetsでなければなりません。
  2. あなたstyleタグを持っているプロパティがmargin-top、ないtop-marginでなければなりません。

変更すると違いがあるかどうかを確認してください。あなたのスタイルシートへのパスを想定し

+0

神ああ、それはあなたが思考せずに入力するときに何が起こるかです。ありがとう! – jbranchaud

1
<link href="bootstrap/css/bootstrap.css" rel="stylesheets"> 

stylesheetsは、stylesheetである必要があります。

1

が正しいか、試してみてください。

<link rel="stylesheet" type="text/css" href="bootstrap/css/bootstrap.css" /> 
関連する問題