CSS(了解)

Cascade Style Sheet 層疊樣式表

css和html的結合方式?
也就是學習如何在HTML里如何使用css,共有三種方式。

結合方式1

<code>
<!DOCTYPE html>
<html>
<head>
<title>01-結合方式1.html</title>
<meta name="keywords" content="keyword1,keyword2,keyword3">
<meta name="description" content="this is my page">
<meta name="content-type" content="text/html; charset=UTF-8">

</head>
<body>

<p style='color:red;'> This is my HTML page. </p><br>

</body>
</html>
</code>

結合方式2
<pre>
<!DOCTYPE html>
<html>
<head>
<title>02-結合方式2.html</title>

<meta name="keywords" content="keyword1,keyword2,keyword3">
<meta name="description" content="this is my page">
<meta name="content-type" content="text/html; charset=UTF-8">

<!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
<style type="text/css">
    p{
        color:red;
    }
</style>

</head>

<body>
<p style='color:red;'> This is my HTML page. </p>

</body>
</html>

</pre>
結合方式3

  <!DOCTYPE html>
<html>
  <head>
    <title>03-結合方式3.html</title>
    <meta name="keywords" content="keyword1,keyword2,keyword3">
    <meta name="description" content="this is my page">
    <meta name="content-type" content="text/html; charset=UTF-8">
  <!-- 結合方式3:
        需要創建一個.css文件    
        <link rel="stylesheet" type="text/css" href="./p.css">
   -->
   <link rel="stylesheet" type="text/css" href="./p.css">
  </head>
    <body>
   <p style='color:red;'> This is my HTML page. </p><br>
  </body>
</html>

圖片在這里!。


css.png

結合方式ok

CSS語法?(了解)
<pre>
<!DOCTYPE html>
<html>
<head>
<title>02-結合方式2.html</title>
<meta name="keywords" content="keyword1,keyword2,keyword3">
<meta name="description" content="this is my page">
<meta name="content-type" content="text/html; charset=UTF-8">

<style type="text/css">
    p{
        color:red;
    }
</style>

</head>
<body>
<p style='color:red;'> This is my HTML page. </p>

</body>
</html>
</pre>

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。

推薦閱讀更多精彩內容

  • 問答題47 /72 常見瀏覽器兼容性問題與解決方案? 參考答案 (1)瀏覽器兼容問題一:不同瀏覽器的標簽默認的外補...
    _Yfling閱讀 13,809評論 1 92
  • CSS的全稱是什么? CSS全稱Cascading Style Sheets,層疊樣式表 CSS有幾種引入方式? ...
    Echolate閱讀 200評論 0 1
  • 最愛吃蝦~~
    sizmo_O閱讀 378評論 0 1
  • LayoutInflater的獲取 在Activity中:getLayoutInflater() LayoutIn...
    依風聽雨鋒閱讀 167評論 0 0
  • 媽媽帶我去看了電影《阿唐奇遇記》看后我想了很多。他叫阿唐,唐伯虎的唐,是一茶寵,它叫小來,來自未來的機器人。他們為...
    謝東杰閱讀 3,240評論 0 0