2015-04-03 64 views
0

我剛開始使用html和css,但我已經遇到了問題。我做了一個html文件和一個小的css文件,但是當我進入瀏覽器時,我只能看到html的變化。我的CSS不適用於我的HTML文件*已解決*

HTML:

<!doctype html> 

    <html> 

     <head> 

      <meta charset="utf-8"> 
      <title> INTAKE </title> 
      <link rel="stylesheet" href="main.css" type="text/css"/> 

     <head> 

     <body> 

      <h1>Intake opdracht</h1> 

      <p> <strong> <em> 
      Lorem ipsum dolor sit amet, mel te porro eirmod argumentum, has exerci laboramus voluptatibus at. 
      Unum congue legimus sea eu, has no luptatum percipitur. 
      Omnium eleifend voluptatibus has eu. 
      Usu commodo tamquam inermis ei. 
      Elitr aperiri consectetuer at usu, mundi mollis docendi pri et. 
      </em> </strong> </p> 

       <img src="images/html.png" 
onerror="this.src='http://www.moondoggiegraphics.com/html5.png';" width="300"/> 

      <p> <i> 
      Soleat facete audiam per eu, sed ex labores tractatos euripidis, quo ut delectus aliquando philosophia. 
      Cum aeque putent ad, amet legere quo in. 
      Inciderint theophrastus qui et, petentium eloquentiam qui te. 
      Nec ad brute nusquam accusam. 
      Duo eu vero commodo, noluisse oportere has ea, at solum debet omnes mea. 
      Mea aperiam bonorum efficiantur eu, te qui alii commodo numquam. 
      </em> </p> 

       <img src="images/css.png" 
onerror="this.src='http://www.logotypes101.com/logos/194/830812341256B99B32E1A9F242BB9F5F/css3logo.png';"width="200"/> 

      <p> <i> 
      At per esse eirmod omittam, odio omnis te sed. 
      Id pri graeci prodesset deseruisse, usu etiam eligendi adolescens ut. 
      Ex iudico quodsi vix, id pro exerci ignota, sententiae accommodare mel te. 
      Eos ad nisl velit vitae, vim sonet facilis conceptam et. 
      Eu has intellegam neglegentur, et nam sumo nusquam. Ut ubique luptatum volutpat vim, labitur sapientem mea ea. 
      </em> </p> 

      <p> <em> 
      Autem saperet cum an. 
      In sit amet harum impetus. 
      Sit ornatus expetendis cu. 
      Nam diceret detraxit intellegam no. 
      </em> </p> 

       <p> Bron van de <a href= "http://generator.lorem-ipsum.info/"> <b> Lorem ipsum tekst. </b> </a> </p> 

     </body> 

    </html> 

CSS:

@charset "utf-8"; 

p{ 
    text-align:center; 
} 

h1{ 
    background-color:yellow; 
    text-align:center; 
} 

我已經添加了我的文件夾中的圖片。

http://imgur.com/RdTfesl

感謝您的幫助

問題不是我的代碼,這是我的電腦上的東西,仍然不知道它是什麼,但我想在我的筆記本電腦,它的代碼工作。我會繼續在我的筆記本電腦上編程:P感謝您的所有建議!

+0

'main.css'與你的html文件在同一個文件夾中?否則,你必須改變路徑。 – Michel 2015-04-03 11:24:32

+0

是同一個文件夾中的2個文件。 – maxspan 2015-04-03 11:24:57

+0

css文件被稱爲「main.css」,而不僅僅是「主」?順便說一句,你不會看到任何'p {...}'樣式(css) - 它們隻影響'

...

'(html) – henry 2015-04-03 11:28:14

回答

1

確保你的CSS文件被正確鏈接如下:

如果CSS文件在同一目錄中的HTML文件,然後:

<link rel="stylesheet" href="main.css" type="text/css"/> 

如果css文件是在位於一個css目錄在相同的目錄中的HTML文件,然後:

<link rel="stylesheet" href="css/main.css" type="text/css"/> 

如果css文件是上面您的HTML文件的目錄一個級別,則:

<link rel="stylesheet" href="../main.css" type="text/css"/> 

../代表一個目錄上面(類似於點擊BACK鍵,同時在Windows瀏覽)

此外,還要確保你正確地關閉所有標籤在HTML這樣的:

<html> 

    <head> 

     <meta charset="utf-8"> 
     <title> INTAKE </title> 
     <link rel="stylesheet" href="main.css" type="text/css"/> 

    <head> 

    <body> 

     <h1>Intake opdracht</h1> 

    <p> <strong> <em> 
    Lorem ipsum dolor sit amet, mel te porro eirmod argumentum, has exerci laboramus voluptatibus at. 
    Unum congue legimus sea eu, has no luptatum percipitur. 
    Omnium eleifend voluptatibus has eu. 
    Usu commodo tamquam inermis ei. 
    Elitr aperiri consectetuer at usu, mundi mollis docendi pri et. 
    </em> </strong> </p> 

     <img src="images/html.png" onerror="this.src='http://www.moondoggiegraphics.com/html5.png';" width="300"/> 

    <p> <i> 
    Soleat facete audiam per eu, sed ex labores tractatos euripidis, quo ut delectus aliquando philosophia. 
    Cum aeque putent ad, amet legere quo in. 
    Inciderint theophrastus qui et, petentium eloquentiam qui te. 
    Nec ad brute nusquam accusam. 
    Duo eu vero commodo, noluisse oportere has ea, at solum debet omnes mea. 
    Mea aperiam bonorum efficiantur eu, te qui alii commodo numquam. 
    </em> </p> 

     <img src="images/css.png" onerror="this.src='http://www.logotypes101.com/logos/194/830812341256B99B32E1A9F242BB9F5F/css3logo.png';"width="200"/> 

    <p> <i> 
    At per esse eirmod omittam, odio omnis te sed. 
    Id pri graeci prodesset deseruisse, usu etiam eligendi adolescens ut. 
    Ex iudico quodsi vix, id pro exerci ignota, sententiae accommodare mel te. 
    Eos ad nisl velit vitae, vim sonet facilis conceptam et. 
    Eu has intellegam neglegentur, et nam sumo nusquam. Ut ubique luptatum volutpat vim, labitur sapientem mea ea. 
    </em> </p> 

    <p> <em> 
    Autem saperet cum an. 
    In sit amet harum impetus. 
    Sit ornatus expetendis cu. 
    Nam diceret detraxit intellegam no. 
    </em> </p> 

     <p> Bron van de <a href= "http://generator.lorem-ipsum.info/"> <b> Lorem ipsum tekst. </b> </a> </p> 


    </body> 
</html> 

這裏是一個jsfiddle與您的上述代碼:https://jsfiddle.net/e0d8my79/37/

+0

我已經添加了我的文件夾的圖片,也許會有所幫助。 – Dokalex 2015-04-03 11:34:55

+0

檢查了一切,看起來像html是正確的。 – Dokalex 2015-04-03 11:43:33

+0

你能否複製粘貼你的html中的所有內容以及你的CSS中的所有內容,因爲上述內容在我的結尾上工作得很好。 – 2015-04-03 11:48:17

0

我認爲問題出在錯誤的HTML方案中。確保<html><head>正確關閉:

<html> 
    <head> 
    </head> 

    <body> 
    </body> 
</html> 
+0

沒有解決,什麼,但感謝您的評論。 – Dokalex 2015-04-03 11:35:20

0

假設你正確放置你的CSS鏈接,您可能需要刪除您瀏覽器的緩存。只需嘗試按Ctrl + F5。

如果是這樣的話,您可能在CSS文件爲空時在html文件中定義了css,在瀏覽器中打開了html文件。瀏覽器緩存了css文件。那麼你開始寫你的CSS,但因爲瀏覽器有一箇舊的CSS文件的緩存版本,你不能看到你的改變。

+0

沒有工作,但感謝您的評論。 – Dokalex 2015-04-03 11:40:09

-2

我剛剛在我的桌面上創建了2個帶有您的確切代碼(一個HTML和一個CSS文件)的文件,並且css完美地應用了它。你有沒有嘗試過多種瀏覽器?它在Google Chrome上工作正常。

+0

我會嘗試重新安裝我的瀏覽器,感謝您的評論。 – Dokalex 2015-04-03 12:00:10

0

嘗試將您的href屬性更改爲href =「。/ main.css」。

0

請檢查您的css文件的擴展名。 將有一個更改文件被稱爲main.CSS而不是main.css。 You van在FTP程序中或通過服務器上的命令行檢查此項。

相關問題