Blogger Contempo主題新增小工具HTML/JavaScript加入CSS

今天與各位分享如何在Blogger Contempo主題中，新增小工具【HTML/JavaScript】加入CSS
在Blogger Contempo主題中，新增小工具【HTML/JavaScript】後，我們如果要加入CSS，對這個Widget做一些修改，如：增加背景顏色、修改字體大小等。要到【主題】【自訂】旁的倒三角形【編輯HTML】中，點選右上方的【跳至小工具】

跳至小工具

選擇剛剛新增的小工具【HTML/JavaScript】HTML?，範例為HTML8 ，【HTML/JavaScript】標題為「精選推薦」

剛剛新增的小工具【HTML/JavaScript】

以 id及 title確認是否為剛剛的新增小工具【HTML/JavaScript】，範例id='HTML8'，標題title='精選推薦'

以標題確認是否為剛剛新增的【HTML/JavaScript】

然後放入要設定的 CSS Code，如果是在PC桌機上顯示效果，則要在

@media screen and (min-width:$(sidebar.width + content.width + content.margin * 2))

上貼上CSS Code，

#HTML?{

要設定的 CSS Code

}

範例為小工具【HTML/JavaScript】HTML8背景呈現白色及padding

小工具【HTML/JavaScript】背景呈現白色及padding

如果是在手機上顯示效果，則要在

@media screen and (max-width:800px)

下貼上CSS Code，

#HTML?{

要設定的 CSS Code

}

範例為小工具【HTML/JavaScript】HTML8背景呈現白色及padding

小工具【HTML/JavaScript】背景呈現白色及padding

推薦網誌：宜蘭傳藝中心門票限時優惠買1送1 - 小美輕鬆旅