Re: [問題] CSS 寫法與效能的問題

看板Web_Design作者 (LaPass)時間11年前 (2012/10/27 12:44), 編輯推噓1(103)
留言4則, 2人參與, 最新討論串2/3 (看更多)
※ 引述《mchen11 (mchen11)》之銘言: : 問題 1:<style> 區塊通常放在 </head> 之前,但如果網頁某個地方放個外掛小工具, : 這個工具也有自己的 <style> 標籤,不曉得瀏覽器抓 style 時會由內而外找,還是 : 從頭開始找。這個工具的 <style> 應該該放 </head> 前還是放自己的區塊,瀏覽器 : 的執行(找style的速度)比較有效率? 優先順序 1.inline <div style='display:none'> </div> 2.同頁面的style標籤 <style> .st { ...... } </style> 3.外連 <LINK REL=StyleSheet HREF="style.css" TYPE="text/css" > 效率沒太大的差別 但一般是用3這種方法 理由是不同頁面可以用同一隻css檔,以及之後要做頁面的特殊修改 也只要用1、2那兩種方法就能變更顯示的樣式 而且,一般流覽器會對css、js檔作快取動作 可以減少流量 : 問題 2:CSS 可以寫在 HTML 標籤內,也可以寫成 class。如果多個標籤套用同個 : class,那當然是寫成 class。但如果該 CSS 樣式沒有其他標籤需要套用時,那麼── : A: <div style="color: red; border: 1px solid black.....">xxx</div> : B: <div class="aaa">xxx</div> : <style> : .aaa {color:red;..............} : </style> : 以上 A、B 兩種方法,哪種瀏覽器的執行比較有效率?(B 是否比較有效率不知道, : 但我知道多打了好幾個字) : 問題 3:基於 HTML、CSS、javascript 應該分離的原則下,問題 2 只會用 B 的寫法, : 但整個網頁的 HTML 標籤都不使用 style 屬性的情況下,比較好閱讀,卻不曉得效能 : 是否變得較差? : 我另外想問的是,容易閱讀跟效能對於網頁設計者,何者為重? 一般而言是以減少流量為主 (尤其是每天流量幾十萬的那種) 再來是修改、維護的容易度 以及開發速度 這三者並不牴觸 -- ※ 發信站: 批踢踢實業坊(ptt.cc) ◆ From: 114.38.67.190

10/27 14:37, , 1F

10/27 22:25, , 2F
謝謝樓上的網址 這麼多英文夠我研究一陣子了
10/27 22:25, 2F

10/27 22:26, , 3F
感謝L大詳解, 原來用外連有快取的好處.
10/27 22:26, 3F

10/27 22:47, , 4F
剛剛認真回完一篇. 中午在js嘉年華,沒空
10/27 22:47, 4F
文章代碼(AID): #1GYsQSSg (Web_Design)
文章代碼(AID): #1GYsQSSg (Web_Design)