CARDS主題 & 導航欄樣式修改

每一個人對於主題樣式的感受是不同的，譬如字體大小，間距，高寬，距離，顏色等，咱們能夠必定程度內很直觀地去修改主題的某些樣式。

首先，在瀏覽器中利用開發者工具進行調試，找到咱們所要改動的那部分結構，寫入css樣式，調試出咱們所想獲得的結果並記住所對應的樣式選擇器。

其次，咱們須要在cards主題中找到擁有這些樣式選擇器的模塊，修改代碼，寫入咱們剛剛調試過的代碼，最後執行清理、部署、運行便可。

---

主題main_color顏色配置，自定義喜歡的色調

style: 
  # 顏色配置
  color: 
    main_color: '#3c4f65'

導航欄頂部固定以及子欄目間距調整

1. 在瀏覽器開發者工具模式預先調試出理想的樣式，找出對應的選擇器

2. 在themes\cards\source\css\style\_functions\header.styl文檔中，找到對應的選擇器，修改樣式

.header  /* 頂部固定 */
    display flex
    justify-content space-between
    align-items center
    height 54px
    padding 0 calc(var(--space)/2)
    top 0
    z-index 10
    position sticky
    background-color var(--bg-content-color)

.header__right  /* 子欄目間距調整 */
    
        .navbar__menus
            padding 0 0 0 15px
            
            .navbar-menu
                font-size 16px
                padding 16px 12px 16px 12px
                border-radius 5px
                
             #btn-search
        #btn-toggle-dark
            padding 21px 12px 16px 12px

寫在最後

在最起初建站時，對HEXO仍是足夠陌生的！對於這樣的系統文檔的結構老是摸不到頭腦。我其實一開始就想更改某些樣式，可是無從下手，鬱悶極了！

在這種程度的情況下，我從配置文檔說明開始研究，能搞懂多少是多少，在三番五次的折騰中，局勢就慢慢開朗了！固然折騰從未結束，更多的問題還要去琢磨。