會持續的更新...

如果有我沒有標示到的標籤,可以留言詢問或是提醒我喔~ 謝謝~

 

梅花問路 痞客邦 CSS 網頁語法標籤筆記(需引用請留言告知並註明出處,勿全部複製帶走)
# . 屬性 備註及參照
整個頁面的整體設定(調整教學請點我)
body   部落格的整體版面  
a   所有的超連結  
a:hover   滑鼠移到超連結上面時  
封面/刊頭/橫幅區塊(banner或是header)(調整教學請點我)
#banner   封面橫幅  
#banner h1   部落格名稱/標題  
#banner h1 a:hover   部落格名稱/標題的超連結  
#banner h2   部落格敘述(描述)的地方  
文章區+側欄區
#container   文章區+側欄區的設定(整體內容區塊)  
側欄區塊
#links   整個側欄區塊  
  .box-title 側欄標題  
  .box-text 側欄內容  
  .box-text a 側欄內容的超連結  
  .box-text a:hover 滑鼠移到側欄內容的連結時  
  .inner-box ul "我的連結"裡分享的連結

.inner-box ul  :before"我的連結"裡分享的連結 之前

.inner-box ul  :after"我的連結"裡分享的連結 之後

  .box-more 應該是每一個側欄的小區塊裡面的內容吧(?)  
  .box-more a 承上的連結  
  .box-more a:hover  承上上樓滑鼠移過去連結上  
文章區塊
#content   文章區塊整體  
  .article    
  .article-head 文章標題+發表時間  
  .publish 發表時間

.date日期

.month月份

.day星期幾

.year年份

  .title 文章標題(不含時間的區塊)  
  .title a 文章標題(不含時間的區塊)的連結  
  .title h2 a 文章標題  
  .article-body 文章的內容區塊  
#content .recommended-posts3 【你可能會有興趣的文章】的標題和連結框框們全部 (最左兩格要一起寫才會生效)
  .article-keyword, .article-keyword a 【文章標籤】以及所有的標籤連結  
  .refer,.history 【文章分類】和【歷史上的今天】  
  .back-to-top 回到最上層  
  .back-to-top a 回到最上層超連結  
  .title h2 img 文章標題前的密碼圖示、隱藏圖示  
#article-main .article-content-inner 文章區塊內容的部分 (最左兩格要一起寫才會生效)
創作者介紹區塊(調整教學請點我)
  .author-profile__header 【創作者介紹】這五個字  
  .author-profile__main 整個【創作者介紹】的框框  
  .author-profile__info 部落格名稱  
  .author-profile__avatar 作者的照片  
訪客留言/留下迴響的區塊
#container #main #content #user-post #comment-box .comment-textarea textarea 訪客留下迴響的框框,以及訪客留言時看到顯示的字體跟大小 (最左兩格要一起寫才會生效)
#container #main #content #user-post #comment-box .captcha input 輸入驗證碼的那個框 (最左兩格要一起寫才會生效)
#container #main #content #user-post #comment-box #comment-area .comment-body a 【看不懂換張圖】的字體大小、顏色設定 (最左兩格要一起寫才會生效)
#container #main #content #user-post #comment-box .comment-extra 【其他選項】、【表情符號】、【送出留言】的背景 (最左兩格要一起寫才會生效)
公告版位(調整教學請點我)
#spotlight   公告版位區塊整體  
#spotlight h5   公告版位的標題  
#spotlight-text   公告版位的內容  
頁尾描述
#footer   頁尾描述區塊  
#bottom ,.bottom-skiplink ,.bottom-pixnet   頁尾描述區塊裡面,痞客邦官方的一些超連結

超連結裡面包含:回到首頁、回到主文、

免費註冊、客服中心、痞客邦首頁 ,以及2003-2020PIXNET字樣

誰來我家
#visitor.box   誰來我家區塊  
  .li a img 訪客頭像  
痞客邦置頂的藍色橫條(調整教學請點我)
 

.pixnavbar__top-bar__logo

.pixnavbar-d__navbar .pixnavbar__top-bar__logo

痞客幫LOGO本人image  
  .pixnavbar-d__navbar .pixnavbar__top-bar__pix-blog 部落格字樣image  
  .pixnavbar-d__navbar .pixnavbar__top-bar__pix-streamtopic 邦邦字樣image  

 

 

如果我的筆記對您有幫助,記得幫我按個火箭推推、留言~

我有參考許多篇文章,但是最終是自己慢慢KEY慢慢找出來的

如果您需要引用,請留言告知,並且註明語法出處及附上連結

筆記會不斷的更新,請尊重原創者的辛勞,不要全部COPY偷走喔!

 

梅花的語法筆記

檢視CSS標籤F12 文章區塊 #content
*開發人員工具* *改文章標題字體、背景*
部落格整體 #body *改行距、邊界*
*換背景底圖* 公告版面 #spotlight
*換字體* *公告版面應用*
*換部落格ICON* 實用推薦
*設計LOGO*  *讓部落格可以被Google*
封面橫幅#banner/#header *Google Analytics分析*
*換封面底圖* 其他應用
*部落格標題敘述大小位置* 0074.gif梅花的語法筆記本0074.gif
側欄區塊 #links *文章內的目錄(錨點)image
*改側欄標題的背景* *關閉遮蓋版面的廣告*
*Facebook粉專外掛image *隱藏上方藍色選單*
*音樂外掛image *連結Google相簿*
*YouTube外掛image *圖片瘦身不失真*
*分享連結階層*  
   

0074.gif點我看梅花所有的語法筆記文章0074.gif  0074.gif點我看梅花的CSS標籤筆記大全0074.gif

arrow
arrow
    創作者介紹
    創作者 梅梅 的頭像
    梅梅

    梅花問路

    梅梅 發表在 痞客邦 留言(2) 人氣()