快11月了，天氣要開始轉冷啦
有男友的抱男友，有女友的抱女友
工程師就是要比別人高端一點
我不冷

而且年末老闆要準備生年終獎金
案子排山倒海來

然而完成的專案跟教堂一樣
我們建造，然後祈禱(つд⊂)

工作略多
每天都不希望日落，却又在夜晚祈禱不要黎明。

今天來一口氣結束掉菜鳥卡片的講解吧
不然就要被說在拖臺錢了

正篇開始囉喔喔喔

一樣先附個連結，不然還要點來點去的

如果你是工程師，然後對CSS感到頭痛
可以看看上一篇，應該會有便祕通暢的感覺

都讓看官們點到上一篇了
當然這篇就要直接切入我所認為的CSS就是繼承的想法怎麼來的

來看看下面這段 充字數的 CSS

.namecard h2 {
  font-size: 25px;
  font-weight: 700;
}

.namecard h2 span {
  font-size: 12px;
  font-weight: 500;
}

.namecard h5 {
  color: #0080a4;
}

.namecard p {
  font-size: 12px;
  line-height: 22px;
}

• 如同上次很大很黑很粗那一行所打的( ͡° ͜ʖ ͡°)

  1. (.namecard h2)與(.namecard h2 span)互相為繼承關係，所以選擇器較長的會繼承一切選擇器較短的，但相同的屬性會被覆蓋掉，所以在這個範圍裏面< span > 的標籤字型大小不會被外面h2字型大小所影響，文字粗度同理
     2.至於下面兩個選擇器因為只繼承了(.namecard)所以完全不關前面的事情，他們有著各自的屬性

  ---

講完了覆寫屬性，我們再來看看疊層屬性吧

再來一段 佔字數用的 程式碼

.circle {
  width: 100px;
  height: 100px;
  border-radius: 100%;
  position: absolute;
  transition-duration: 1s;
}

.circle1 {
  right: 100px;
  bottom: -60px;
  background-color: #0080a4;
  transition-duration: 1s;
}

.circle2 {
  width: 60px;
  height: 60px;
  right: -30px;
  top: -30px;
  border: solid 3px #0080a4;
  transition-duration: 1s;
}

.circle3 {
  width: 250px;
  height: 250px;
  left: -70px;
  top: -70px;
  /* border: solid 3px #0080a4; */
  background-color: rgba(0, 128, 164, 0.15);
}


.mark {
  font-size: 160px;
  position: absolute;
  bottom: 130px;
  font-weight: 100;
  color: rgba(255, 234, 159, 0.35);
  background: transparent;
}

• 為何先說明覆寫在說明繼承呢?因為CSS繼承有兩種模式，而且略複雜

  1. 如同上面的(.namecard)後面串接了一大串的選擇器，這樣會僅限於被上層html標籤包住的內容才會出現的屬性

  2. 另一種類似於同一個標籤用相同的class去做層疊，例如第二塊程式碼在html之中(如下)這樣子的話我們知道.circle是構成一個圓的要素與基本的預設(border-radius: 100%;)，然後因為要對齊方便，讓他的排列方式變成position: absolute;如此以來因為外面*{}是position: relative;所以裡面的絕對定位會參照上一層的框限來定位，這個東西很複雜，接下來的文章也會常遇到，會不斷的解說更詳細，接下來的事情就簡單了，我們可以針對每個圓想做的事情直接把屬性打上去，他會自動覆蓋掉在前面的屬性，做疊層上去的動作
     3.然而最後的.mark就是把*{}的position: relative;取代掉所以可以在畫面上任意定位，變成一個完全獨立的標籤

<div class="circle circle1"></div>
<div class="circle circle2"></div>
<div class="circle circle3"></div>

今天又完成啦
說真的冬天到了
是單身狗的程序員們把自己身體練好變得不怕冷靠自己最實在了

不說了，我要去做重訓了( ´•̥̥̥ω•̥̥̥` )