HTML基礎1

標籤選擇器：注意分號，重要！！！

<style>
  h2 {
    color: blue;
  }
</style>

類選擇器：

<style>
  .blue-text {
    color: blue;
  }
</style>

style屬性：  

        經過外部連接或文件導入字體：

#導入Google Lobster字體
<link href="https://fonts.gdgdocs.org/css?family=Lobster" rel="stylesheet" type="text/css">

        顏色： color   字號：font-size  字體：font-family 

        字體自動降級：當字體lobster不可用時自動使用monospace

<style>
 h2 {
    font-family: Lobster, Monospace;
  }
</style>

 

添加圖片：

<style>

  .smaller-image {
    width:100px;
  }
</style>
<img class="smaller-image" src="/images/relaxing-cat.jpg">

css邊框 border屬性：

<style>
  .thin-red-border {
    border-color: red; //邊框顏色
    border-width: 5px; //邊框寬度
    border-style: solid; //邊框樣式
    border-radius:10px; //邊框圓角半徑（也能夠填寫百分比，50%會呈現圓形邊框）
  }
</style>