CSS屬性規則不能在HTML文件中工作

-1

請不要太意味着我只是想明白。好的，所以我精通C++，Java和C＃應用程序。我最近一直在努力理解網站的發展。現在我正在進行基本的HTML編碼。查看http://www.westciv.com/style_master/academy/css_tutorial/introduction/how_they_work.html並嘗試重新創建https://developer.mozilla.org/en-US/docs/Learn/CSS/Introduction_to_CSS/How_CSS_works。但它沒有按預期工作。CSS屬性規則不能在HTML文件中工作

<!DOCTYPE html> 
 
<html> 
 
    <head> 
 
\t <style type ="text/css"> \t <!-- You need this in order to have CSS, it has --> 
 
\t \t p {color: blue; font-family:arial;} 
 
\t </style> 
 
    </head> 
 
    <body> 
 

 
    <h1>Hello World!</h1> 
 
    <p>This is my first CSS example</p> 
 

 
    <ul> 
 
     <li>This is</li> 
 
     <li>a list</li> 
 
    </ul> 
 
    </body> 
 
</html>

所以，當我鍵入這段代碼到Codepen它的作品如預期，隨着顯示藍色文本每個段落。然而，當我在記事本++中將其作爲HTML文件編碼時，它不會添加CSS樣式，格式，背景顏色等。一旦查看它，我發現如果直接在段落括號中添加樣式下面示出）

<!DOCTYPE html> 
 
    <html> 
 
     <head> 
 
\t  <style type ="text/css"> \t 
 
\t \t  p {color: blue;} 
 
\t  </style> 
 
     </head> 
 
     <body> 
 
\t  <p style="text-decoration: underline;">This is my body green</p> 
 
\t  <p style = "color: blue;">this text should be blue!</p> 
 
     <h1>Hello World!</h1> 
 
     <p>This is my first CSS example</p> 
 

 
     <ul> 
 
      <li>This is</li> 
 
      <li>a list</li> 
 
     </ul> 
 
     </body> 
 
    </html>

添加大演說塊等<meta charset="utf-8>和<link rel="stylesheet" href="style.css">也毫無幫助。

我的問題是爲什麼此代碼在某些地方而不是其他地方工作？是否有可能會干擾的網絡瀏覽器設置？我已經嘗試過IE，FF和Chrome，但是他們不會顯示CSS樣式，除非我特別聲明它在括號中不在標題中。如果這是一個邏輯錯誤，請發表/評論文章閱讀。

來源

2017-10-19 job villamil

@Kunok YUP是工作！評論如何/爲何影響代碼？ –

在第一個例子中的註釋被錯放到一個CSS聲明，所以不要把HTML註釋的CSS聲明。

聲明p {color: blue; font-family:arial;}隻影響到<P></P>標籤。

<!DOCTYPE html> 
 
<html> 
 
    <head> 
 
\t <style type ="text/css"> \t 
 
\t \t p {color: blue; font-family:arial;} 
 
\t </style> 
 
    </head> 
 
    <body> 
 

 
    <h1>Hello World!</h1> 
 
    <p>This is my first CSS example</p> 
 

 
    <ul> 
 
     <li>This is</li> 
 
     <li>a list</li> 
 
    </ul> 
 
    </body> 
 
</html>

如果需要特定的格式添加到特定的標籤，你可以使用class屬性（class="blue"），並宣佈在CSS類的類名稱的開頭追加一個點（ .blue）。

<!DOCTYPE html> 
 
    <html> 
 
     <head> 
 
\t  <style type ="text/css"> \t 
 
      p {color: blue;} 
 
      .underlined { text-decoration: underline } 
 
      .blue { color: blue } 
 
\t  </style> 
 
     </head> 
 
     <body> 
 
\t  <p class="underlined">This is my body green</p> 
 
\t  <p class="blue" >this text should be blue!</p> 
 
     <h1>Hello World!</h1> 
 
     <p>This is my first CSS example</p> 
 

 
     <ul> 
 
      <li>This is</li> 
 
      <li>a list</li> 
 
     </ul> 
 
     </body> 
 
    </html>

來源

2017-10-19 20:50:40

-1

您不需要聲明樣式類型，因爲唯一的類型是CSS。

<!DOCTYPE html> 
 
<html> 
 
    <head> 
 
\t <style> 
 
\t \t p {color: blue; font-family:arial;} 
 
\t </style> 
 
    </head> 
 
    <body> 
 

 
    <h1>Hello World!</h1> 
 
    <p>This is my first CSS example</p> 
 

 
    <ul> 
 
     <li>This is</li> 
 
     <li>a list</li> 
 
    </ul> 
 
    </body> 
 
</html>

來源

2017-10-19 20:40:12

爲什麼downvote？我刪除了註釋以便它可以工作，並且也不需要定義樣式類型。 –

有人猜測，也許是因爲你的答案並沒有真正增加任何其他答案？或者，也許這只是一個戰術downvote？ – Brian

我的評論是第一個，所以是其他人加入我的評論。 –

CSS屬性規則不能在HTML文件中工作

回答

相關問題