CSS 代表層疊樣式表。 HTML用於建立網頁,在網頁中加入文字、圖像、影片等。之後,我們需要設定文字和圖像的樣式,這只能使用 CSS 來完成。基本上,我們可以使用CSS為HTML元素添加背景、顏色、尺寸、方向等樣式。 有三種方法可以為網頁新增樣式。第一種是內聯樣式,直接將樣式加入HTML元素中。第二種是嵌入式樣式表,在「html」檔案中使用標籤新增樣式。外部CSS檔案是第三種為網頁新增樣式的方法。 </p> <h2>文法</h2> <p>使用者可以依照下列語法將嵌入樣式表新增至 HTML 網頁。 </p> <div class="code" style="position:relative; padding:0px; margin:0px;"><pre class='brush:css;toolbar:false;'><style> /* add CSS here */ 登入後複製 使用者可以在上述語法中的標籤之間加入CSS。 </p> <h2>Example 1</h2>的中文翻譯為:<h2>範例1</h2><p>#在下面的範例中,我們有一個帶有「container」類別的 div 元素。我們在 div 元素內新增了兩個 <p> 元素。此外,我們還在 <p> 元素內加入了文字內容。 </p> <p>在<head>部分,我們加入了<style>標籤。在 <style> 標籤內,我們新增了容器 div 元素的 CSS。此外,我們也使用了「nth-child()」CSS 函數來對兩個 <p> 元素設定不同的樣式。 </p> <div class="code" style="position:relative; padding:0px; margin:0px;"><pre class='brush:html;toolbar:false;'><html> <head> <style> .container { border: 2px solid black; padding: 10px; margin: 10px; background-color: lightblue; height: 100px; width: 500px; } .container p:nth-child(1) { color: red; font-size: 20px; } .container p:nth-child(2) { color: green; font-size: 25px; } Embedding the Styles to the HTML document This is a paragraph. This is another paragraph.