樣式表style

制作一個風格統一的網頁，需要樣式表對顏色、字體等屬性的規范，同時也省去在body中多次定義的麻煩，所以一個樣式表是必不可少的。

樣式表有兩種引用的方法：一種是直接寫在html的<head>中，另一種是引用外部的.css文件。

第一種方法的使用（樣式表選擇器）

首先在head中用style標簽聲明

<style type="text/css">樣式表內容</style>

1、用標簽定位元素，設置屬性

body
{
     background-color:#CC0;
     background-image:url(../../xxx.jpg);<!--"(../../)"表示在html文件所在的文件夾的上兩級-->
     background-repeat:no-repeat;
}
table
{
     background-image:url(../../xxx.jpg);
     background-repeat:repeat;
}

2、自定義名：（1）給樣式組設置一個自定義名字，然后在<body>的標簽中運用

.ming
{
     background-image:url(../../xxx.jpg);
     background-repeat:no-repeat;
     background-size:contain
}

<body class="ming">
<table class = "ming"></table>
</body>

（2）"標簽名 .自定義名"（只能在標簽內使用，標簽名和“.自定義名”之間有一個空格）

table .ming
{
     color:#3F0;
}

<body>
    <table class = "ming"></table>
    <font class = "ming"></font><!--此處是不能調用的-->
</body>

（3）、".自定義名標簽"（自動尋找在“.自定義名”后存在標簽的部分並賦給它樣式）

.ming font
{
     font:"華文彩雲";
}

<body>
  <table class = "ming">
    <tr>
    <td>
         <font>我會變色</font>
    </tr>
    </td>
    <tr>
    <td>
         <button>我不會變色</button>
    </tr>
    </td>
  </table>
</body>

3、通過id值查找適合的元素：#id（在#后加上ID值，可以對此ID所在的元素單獨設置）[#id也同樣可以用自定義名的幾種方法]

#id1
{
     color:#3F0;
}

<body>
         <table>
              <tr>
              <td> 
                    <input type="text"  id="id1" />
               </td>
               </tr>
         </table>
</body>

選擇器優先級：

ID>class名>標簽

第二種方法的使用（CSS）

導入：

在html文件的<head>中：<link rel=”stylesheet” href=”xxx.css”>

鏈接的style：

a:link 超鏈接被點前狀態

a:visited 超鏈接點擊后狀態

a:hover 懸停在超鏈接時

a:active 點擊超鏈接時

在定義這些狀態時，有一個順序l v h a

免責聲明！

本站轉載的文章為個人學習借鑒使用，本站對版權不負任何法律責任。如果侵犯了您的隱私權益，請聯系本站郵箱yoyou2525@163.com刪除。

猜您在找 css網頁重置樣式表(多版本) CSS樣式表 CSS樣式表 css樣式表 css清除常用默認樣式表 CSS樣式表的寫作規范 CSS-定義樣式表 CSS樣式表、鏈接(lvha)樣式設置 css樣式表中的樣式覆蓋順序(轉) 如何玩轉CSS內部樣式表與外部樣式表？