自訂樣式表

在 Tidyverse 中以資料溝通

Timo Grossenbacher

Data Journalist

層疊樣式表（CSS）：基本選擇器

<h2>摘要</h2>

<p><strong>International 
Labour Organization (ILO)</strong> 
有許多關於工作條件的
<a href="http://test.htm">資料集
</a>。

h2 {
  font-family: "Bookman", serif;
}

body, h1, h2 {
  font-family: "Bookman", serif;
}

strong {
    color: "red";
}

a {
    color: #0000FF;
    font-weight: bold;
}

<h2>Strong 元素</h2>

以下是兩個帶有 <strong class = "red">
粗體</strong> 的 
<strong>元素</strong>。

strong {
  color: "blue";
}

strong.red {
  color: "red";
}

<div>

  <p>
    這是一個
    <strong>粗體元素</strong>
    ，位於段落內
  </p>

  這是另一個
  <strong>粗體元素</strong>
  ，位於段落外。

</div>

div strong {
  color: "green";
}

div > strong {
  color: "red";
}

想了解更多選擇器與完整 CSS 參考，請見［Mozilla Developer Network］(https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Selectors)。

在 Tidyverse 中以資料溝通