CSS代碼需要注意的編寫規(guī)范及優(yōu)化建議有哪些,針對(duì)這個(gè)問(wèn)題,這篇文章詳細(xì)介紹了相對(duì)應(yīng)的分析和解答,希望可以幫助更多想解決這個(gè)問(wèn)題的小伙伴找到更簡(jiǎn)單易行的方法。
創(chuàng)新互聯(lián)自2013年創(chuàng)立以來(lái),先為丘北等服務(wù)建站,丘北等地企業(yè),進(jìn)行企業(yè)商務(wù)咨詢服務(wù)。為丘北企業(yè)網(wǎng)站制作PC+手機(jī)+微官網(wǎng)三網(wǎng)同步一站式服務(wù)解決您的所有建站問(wèn)題。
結(jié)構(gòu)、樣式、行為分離
盡量確保文檔和模板只包含 HTML 結(jié)構(gòu),樣式都放到樣式表里,行為都放到腳本里。
縮進(jìn)
統(tǒng)一兩個(gè)空格縮進(jìn)(總之縮進(jìn)統(tǒng)一即可),不要使用 Tab 或者 Tab、空格混搭。
文件編碼
使用不帶 BOM 的 UTF-8 編碼。
在 HTML 中指定編碼;
無(wú)需使用@charset 指定樣式表的編碼,它默認(rèn)為 UTF-8;
一律使用小寫字母
CSS Code復(fù)制內(nèi)容到剪貼板
/* Recommended */
color: #e5e5e5;
/* Not recommended */
color: #E5E5E5;
省略外鏈資源 URL 協(xié)議部分
省略外鏈資源(圖片及其它媒體資源)URL 中的 http / https 協(xié)議,使 URL 成為相對(duì)地址,避免 Mixed Content 問(wèn)題,減小文件字節(jié)數(shù)。
其它協(xié)議(ftp 等)的 URL 不省略。
CSS Code復(fù)制內(nèi)容到剪貼板
/* Recommended */
.example {
background: url(//www.google.com/images/example);
}
/* Not recommended */
.example {
background: url(http://www.google.com/images/example);
}
CSS 注釋
組件塊和子組件塊以及聲明塊之間使用一空行分隔,子組件塊之間三空行分隔;
CSS Code復(fù)制內(nèi)容到剪貼板
/* ==========================================================================
組件塊
============================================================================ */
/* 子組件塊
============================================================================ */
.selector {
padding: 15px;
margin-bottom: 15px;
}
/* 子組件塊
============================================================================ */
.selector-secondary {
display: block; /* 注釋*/
}
.selector-three {
display: span;
}
代碼組織
以組件為單位組織代碼段;
制定一致的注釋規(guī)范;
組件塊和子組件塊以及聲明塊之間使用一空行分隔,子組件塊之間三空行分隔;
如果使用了多個(gè) CSS 文件,將其按照組件而非頁(yè)面的形式分拆,因?yàn)轫?yè)面會(huì)被重組,而組件只會(huì)被移動(dòng);
良好的注釋是非常重要的。請(qǐng)留出時(shí)間來(lái)描述組件(component)的工作方式、局限性和構(gòu)建它們的方法。不要讓你的團(tuán)隊(duì)其它成員 來(lái)猜測(cè)一段不通用或不明顯的代碼的目的。
提示:通過(guò)配置編輯器,可以提供快捷鍵來(lái)輸出一致認(rèn)可的注釋模式。
CSS Code復(fù)制內(nèi)容到剪貼板
/* ==========================================================================
組件塊
============================================================================ */
/* 子組件塊
============================================================================ */
.selector {
padding: 15px;
margin-bottom: 15px;
}
/* 子組件塊
============================================================================ */
.selector-secondary {
display: block; /* 注釋*/
}
.selector-three {
display: span;
}
Class 和 ID
使用語(yǔ)義化、通用的命名方式;
使用連字符 - 作為 ID、Class 名稱界定符,不要駝峰命名法和下劃線;
避免選擇器嵌套層級(jí)過(guò)多,盡量少于 3 級(jí);
避免選擇器和 Class、ID 疊加使用;
出于性能考量,在沒(méi)有必要的情況下避免元素選擇器疊加 Class、ID 使用。
元素選擇器和 ID、Class 混合使用也違反關(guān)注分離原則。如果 HTML 標(biāo)簽修改了,就要再去修改 CSS 代碼,不利于后期維護(hù)。
CSS Code復(fù)制內(nèi)容到剪貼板
/* Not recommended */
.red {}
.box_green {}
.page .header .login #username input {}
ul#example {}
/* Recommended */
#nav {}
.box-video {}
#username input {}
#example {}
聲明塊格式
選擇器分組時(shí),保持獨(dú)立的選擇器占用一行;
聲明塊的左括號(hào) { 前添加一個(gè)空格;
聲明塊的右括號(hào) } 應(yīng)單獨(dú)成行;
聲明語(yǔ)句中的 : 后應(yīng)添加一個(gè)空格;
聲明語(yǔ)句應(yīng)以分號(hào) ; 結(jié)尾;
一般以逗號(hào)分隔的屬性值,每個(gè)逗號(hào)后應(yīng)添加一個(gè)空格;
rgb()、rgba()、hsl()、hsla()或 rect()括號(hào)內(nèi)的值,逗號(hào)分隔,但逗號(hào)后不添加一個(gè)空格;
對(duì)于屬性值或顏色參數(shù),省略小于 1 的小數(shù)前面的 0 (例如,.5 代替 0.5;-.5px 代替 -0.5px);
十六進(jìn)制值應(yīng)該全部小寫和盡量簡(jiǎn)寫,例如,#fff 代替 #ffffff;
避免為 0 值指定單位,例如,用 margin: 0; 代替 margin: 0px;;
CSS Code復(fù)制內(nèi)容到剪貼板
/* Not recommended */
.selector, .selector-secondary, .selector[type=text] {
padding:15px;
margin:0px 0px 15px;
background-color:rgba(0, 0, 0, 0.5);
box-shadow:0px 1px 2px #CCC,inset 0 1px 0 #FFFFFF
}
/* Recommended */
.selector,
.selector-secondary,
.selector[type="text"] {
padding: 15px;
margin-bottom: 15px;
background-color: rgba(0,0,0,.5);
box-shadow: 0 1px 2px #ccc, inset 0 1px 0 #fff;
}
聲明順序
相關(guān)屬性應(yīng)為一組,推薦的樣式編寫順序
Positioning
Box model
Typographic
Visual
由于定位(positioning)可以從正常的文檔流中移除元素,并且還能覆蓋盒模型(box model)相關(guān)的樣式,因此排在首位。盒模型決定了組件的尺寸和位置,因此排在第二位。
其他屬性只是影響組件的內(nèi)部(inside)或者是不影響前兩組屬性,因此排在后面。
CSS Code復(fù)制內(nèi)容到剪貼板
.declaration-order {
/* Positioning */
position: absolute;
top: 0;
rightright: 0;
bottombottom: 0;
left: 0;
z-index: 100;
/* Box model */
display: block;
box-sizing: border-box;
width: 100px;
height: 100px;
padding: 10px;
border: 1px solid #e5e5e5;
border-radius: 3px;
margin: 10px;
float: rightright;
overflow: hidden;
/* Typographic */
font: normal 13px "Helvetica Neue", sans-serif;
line-height: 1.5;
text-align: center;
/* Visual */
background-color: #f5f5f5;
color: #fff;
opacity: .8;
/* Other */
cursor: pointer;
}
引號(hào)使用
url()、屬性選擇符、屬性值使用雙引號(hào)。 參考 Is quoting the value of url() really necessary?
CSS Code復(fù)制內(nèi)容到剪貼板
/* Not recommended */
@import url(//www.google.com/css/maia.css);
html {
font-family: 'open sans', arial, sans-serif;
}
/* Recommended */
@import url("http://www.google.com/css/maia.css");
html {
font-family: "open sans", arial, sans-serif;
}
.selector[type="text"] {
}
媒體查詢(Media query)的位置
將媒體查詢放在盡可能相關(guān)規(guī)則的附近。不要將他們打包放在一個(gè)單一樣式文件中或者放在文檔底部。如果你把他們分開了,將來(lái)只會(huì)被大家遺忘。
CSS Code復(fù)制內(nèi)容到剪貼板
.element { ... }
.element-avatar { ... }
.element-selected { ... }
@media (max-width: 768px) {
.element { ...}
.element-avatar { ... }
.element-selected { ... }
}
不要使用 @import
與相比,@import 要慢很多,不光增加額外的請(qǐng)求數(shù),還會(huì)導(dǎo)致不可預(yù)料的問(wèn)題。
替代辦法:
使用多個(gè) 元素;
通過(guò) Sass 或 Less 類似的 CSS 預(yù)處理器將多個(gè) CSS 文件編譯為一個(gè)文件;
其他 CSS 文件合并工具;
參考 don’t use @import;
鏈接的樣式順序:
CSS Code復(fù)制內(nèi)容到剪貼板
a:link -> a:visited -> a:hover -> a:active(LoVeHAte)
無(wú)需添加瀏覽器廠商前綴
使用 Autoprefixer 自動(dòng)添加瀏覽器廠商前綴,編寫 CSS 時(shí)不需要添加瀏覽器前綴,直接使用標(biāo)準(zhǔn)的 CSS 編寫。
Autoprefixer 通過(guò) Can I use,按兼容的要求,對(duì)相應(yīng)的 CSS 代碼添加瀏覽器廠商前綴。
模塊組織
任何超過(guò) 1000 行的 CSS 代碼,你都曾經(jīng)歷過(guò)這樣的體驗(yàn):
這個(gè) class 到底是什么意思呢?
這個(gè) class 在哪里被使用呢?
如果我創(chuàng)建一個(gè) xxoo class,會(huì)造成沖突嗎?
Reasonable System for CSS Stylesheet Structure 的目標(biāo)就是解決以上問(wèn)題,它不是一個(gè)框架,而是通過(guò)規(guī)范,讓你構(gòu)建更健壯和可維護(hù)的 CSS 代碼。
Components(組件)
從 Components 的角度思考,將網(wǎng)站的模塊都作為一個(gè)獨(dú)立的 Components。
Naming components (組件命名)
Components 最少以兩個(gè)單詞命名,通過(guò) - 分離,例如:
點(diǎn)贊按鈕 (.like-button)
搜索框 (.search-form)
文章卡片 (.article-card)
Elements(元素)
Elements 是 Components 中的元素
Naming elements(元素命名)
Elements 的類名應(yīng)盡可能僅有一個(gè)單詞。
CSS Code復(fù)制內(nèi)容到剪貼板
.search-form {
> .field { /* ... */ }
> .action { /* ... */ }
}
On multiple words (多個(gè)單詞)
對(duì)于倘若需要兩個(gè)或以上單詞表達(dá)的 Elements 類名,不應(yīng)使用中劃線和下劃線連接,應(yīng)直接連接。
CSS Code復(fù)制內(nèi)容到剪貼板
.profile-box {
> .firstname { /* ... */ }
> .lastname { /* ... */ }
> .avatar { /* ... */ }
}
Avoid tag selectors(避免標(biāo)簽選擇器)
任何時(shí)候盡可能使用 classnames。標(biāo)簽選擇器在使用上沒(méi)有問(wèn)題,但是其性能上稍弱,并且表意不明確。
CSS Code復(fù)制內(nèi)容到剪貼板
.article-card {
> h4 { /* ? avoid */ }
> .name { /* ? better */ }
}
Variants(變體)
Components 和 Elements 可能都會(huì)擁有 Variants。
Naming variants(變體命名)
Variants 的 classname 應(yīng)帶有前綴中劃線 -
CSS Code復(fù)制內(nèi)容到剪貼板
.like-button {
&.-wide { /* ... */ }
&.-short { /* ... */ }
&.-disabled { /* ... */ }
}
Element variants(元素變體)
CSS Code復(fù)制內(nèi)容到剪貼板
.shopping-card {
> .title { /* ... */ }
> .title.-small { /* ... */ }
}
Dash prefixes(中劃線前綴)
為什么使用中劃線作為變體的前綴?
它可以避免歧義與 Elements
CSS class 僅能以單詞和 _ 或 - 開頭
中劃線比下劃線更容易輸出
Layout (布局)
Avoid positioning properties(避免定位屬性)
Components 應(yīng)該在不同的上下文中都可以復(fù)用,所以應(yīng)避免設(shè)置以下屬性:
Positioning (position, top, left, right, bottom)
Floats (float, clear)
Margins (margin)
Dimensions (width, height) *
Fixed dimensions(固定尺寸)
頭像和 logos 這些元素應(yīng)該設(shè)置固定尺寸(寬度,高度...)。
Define positioning in parents(在父元素中設(shè)置定位)
倘若你需要為組件設(shè)置定位,應(yīng)將在組件的上下文(父元素)中進(jìn)行處理,比如以下例子中,將 widths 和 floats 應(yīng)用在 list component(.article-list)當(dāng)中,而不是 component(.article-card)自身。
CSS Code復(fù)制內(nèi)容到剪貼板
.article-list {
& {
@include clearfix;
}
> .article-card {
width: 33.3%;
float: left;
}
}
.article-card {
& { /* ... */ }
> .image { /* ... */ }
> .title { /* ... */ }
> .category { /* ... */ }
}
Avoid over-nesting(避免過(guò)分嵌套)
當(dāng)出現(xiàn)多個(gè)嵌套的時(shí)候容易失去控制,應(yīng)保持不超過(guò)一個(gè)嵌套。
CSS Code復(fù)制內(nèi)容到剪貼板
/* ? Avoid: 3 levels of nesting */
.image-frame {
> .description {
/* ... */
> .icon {
/* ... */
}
}
}
/* ? Better: 2 levels */
.image-frame {
> .description { /* ... */ }
> .description > .icon { /* ... */ }
}
Apprehensions(顧慮)
中劃線-是一坨糟糕的玩意:其實(shí)你可以選擇性的使用,只要將 Components, Elements, Variants 記在心上即可。
我有時(shí)候想不出兩個(gè)單詞唉:有些組件的確使用一個(gè)單詞就能表意,比如 aleter。但其實(shí)你可以使用后綴,使其意識(shí)更加明確。
比如塊級(jí)元素:
.alert-box
.alert-card
.alert-block
或行內(nèi)級(jí)元素
.link-button
.link-span
Terminologies(術(shù)語(yǔ))
RSCSS 與其他 CSS 模塊組織系統(tǒng)相似的概念
RSCSS | BEM | SMACSS |
Component | Block | Module |
Element | Element | ? |
Layout | ? | Layout |
Variant | Modifier | Theme & State |
Summary(總結(jié))
以 Components 的角度思考,以兩個(gè)單詞命名(.screenshot-image)
Components 中的 Elements,以一個(gè)單詞命名(.blog-post .title)
Variants,以中劃線-作為前綴(.shop-banner.-with-icon)
Components 可以互相嵌套
記住,你可以通過(guò)繼承讓事情變得更簡(jiǎn)單
LESS 規(guī)范
代碼組織
代碼按以下順序組織:
@import
變量聲明
樣式聲明
CSS Code復(fù)制內(nèi)容到剪貼板
@import "mixins/size.less";
@default-text-color: #333;
.page {
width: 960px;
margin: 0 auto;
}
@import 語(yǔ)句
@import 語(yǔ)句引用的文需要寫在一對(duì)引號(hào)內(nèi),.less 后綴不得省略。引號(hào)使用 ' 和 " 均可,但在同一項(xiàng)目?jī)?nèi)需統(tǒng)一。
CSS Code復(fù)制內(nèi)容到剪貼板
/* Not recommended */
@import "mixins/size";
@import 'mixins/grid.less';
/* Recommended */
@import "mixins/size.less";
@import "mixins/grid.less";
混入(Mixin)
在定義 mixin 時(shí),如果 mixin 名稱不是一個(gè)需要使用的 className,必須加上括號(hào),否則即使不被調(diào)用也會(huì)輸出到 CSS 中。
如果混入的是本身不輸出內(nèi)容的 mixin,需要在 mixin 后添加括號(hào)(即使不傳參數(shù)),以區(qū)分這是否是一個(gè) className。
CSS Code復(fù)制內(nèi)容到剪貼板
/* Not recommended */
.big-text {
font-size: 2em;
}
h4 {
.big-text;
.clearfix;
}
/* Recommended */
.big-text() {
font-size: 2em;
}
h4 {
.big-text(); /* 1 */
.clearfix(); /* 2 */
}
避免嵌套層級(jí)過(guò)多
將嵌套深度限制在 2 級(jí)。對(duì)于超過(guò) 3 級(jí)的嵌套,給予重新評(píng)估。這可以避免出現(xiàn)過(guò)于詳實(shí)的 CSS 選擇器。
避免大量的嵌套規(guī)則。當(dāng)可讀性受到影響時(shí),將之打斷。推薦避免出現(xiàn)多于 20 行的嵌套規(guī)則出現(xiàn)。
字符串插值
變量可以用類似 ruby 和 php 的方式嵌入到字符串中,像 @{name} 這樣的結(jié)構(gòu):@base-url: "http://assets.fnord.com"; background-image: url("@{base-url}/images/bg.png");
性能優(yōu)化
慎重選擇高消耗的樣式
高消耗屬性在繪制前需要瀏覽器進(jìn)行大量計(jì)算:
box-shadows
border-radius
transparency
transforms
CSS filters(性能殺手)
避免過(guò)分重排
當(dāng)發(fā)生重排的時(shí)候,瀏覽器需要重新計(jì)算布局位置與大小,更多詳情。
常見的重排元素:
width
height
padding
margin
display
border-width
position
top
left
right
bottom
font-size
float
text-align
overflow-y
font-weight
overflow
font-family
line-height
vertical-align
clear
white-space
min-height
正確使用 Display 的屬性
Display 屬性會(huì)影響頁(yè)面的渲染,請(qǐng)合理使用。
display: inline 后不應(yīng)該再使用 width、height、margin、padding 以及 float;
display: inline-block 后不應(yīng)該再使用 float;
display: block 后不應(yīng)該再使用 vertical-align;
display: table-* 后不應(yīng)該再使用 margin 或者 float;
不濫用 Float
Float 在渲染時(shí)計(jì)算量比較大,盡量減少使用。
動(dòng)畫性能優(yōu)化
動(dòng)畫的實(shí)現(xiàn)原理,是利用了人眼的 “視覺暫留” 現(xiàn)象,在短時(shí)間內(nèi)連續(xù)播放數(shù)幅靜止的畫面,使肉眼因視覺殘象產(chǎn)生錯(cuò)覺,而誤以為畫面在 “動(dòng)”。
動(dòng)畫的基本概念:
幀:在動(dòng)畫過(guò)程中,每一幅靜止畫面即為一 “幀”;
幀率:即每秒鐘播放的靜止畫面的數(shù)量,單位是 fps(Frame per second);
幀時(shí)長(zhǎng):即每一幅靜止畫面的停留時(shí)間,單位一般是 ms(毫秒);
跳幀 (掉幀 / 丟幀):在幀率固定的動(dòng)畫中,某一幀的時(shí)長(zhǎng)遠(yuǎn)高于平均幀時(shí)長(zhǎng),導(dǎo)致其后續(xù)數(shù)幀被擠壓而丟失的現(xiàn)象。
一般瀏覽器的渲染刷新頻率是 60 fps,所以在網(wǎng)頁(yè)當(dāng)中,幀率如果達(dá)到 50-60 fps 的動(dòng)畫將會(huì)相當(dāng)流暢,讓人感到舒適。
如果使用基于 javaScript 的動(dòng)畫,盡量使用 requestAnimationFrame。避免使用 setTimeout,setInterval。
避免通過(guò)類似 jQuery animate()-style 改變每幀的樣式,使用 CSS 聲明動(dòng)畫會(huì)得到更好的瀏覽器優(yōu)化。
使用 translate 取代 absolute 定位就會(huì)得到更好的 fps,動(dòng)畫會(huì)更順滑。
多利用硬件能力,如通過(guò) 3D 變形開啟 GPU 加速
一般在 Chrome 中,3D 或透視變換(perspective transform)CSS 屬性和對(duì) opacity 進(jìn)行 CSS 動(dòng)畫會(huì)創(chuàng)建新的圖層,在硬件加速渲染通道的優(yōu)化下,GPU 完成 3D 變形等操作后,將圖層進(jìn)行復(fù)合操作(Compesite Layers),從而避免觸發(fā)瀏覽器大面積重繪和重排。
注:3D 變形會(huì)消耗更多的內(nèi)存和功耗。
使用 translate3d 右移 500px 的動(dòng)畫流暢度要明顯優(yōu)于直接使用 left:
CSS Code復(fù)制內(nèi)容到剪貼板
.ball-1 {
transition: -webkit-transform .5s ease;
-webkit-transform: translate3d(0, 0, 0);
}
.ball-1.slidein{
-webkit-transform: translate3d(500px, 0, 0);
}
.ball-2 {
transition: left .5s ease; left:0;
}
.ball-2.slidein {
left:500px;
}
提升 CSS 選擇器性能
CSS 選擇器對(duì)性能的影響源于瀏覽器匹配選擇器和文檔元素時(shí)所消耗的時(shí)間,所以優(yōu)化選擇器的原則是應(yīng)盡量避免使用消耗更多匹配時(shí)間的選擇器。而在這之前我們需要了解 CSS 選擇器匹配的機(jī)制, 如子選擇器規(guī)則:
CSS Code復(fù)制內(nèi)容到剪貼板
#header > a {font-weight:blod;}
我們中的大多數(shù)人都是從左到右的閱讀習(xí)慣,會(huì)習(xí)慣性的設(shè)定瀏覽器也是從左到右的方式進(jìn)行匹配規(guī)則,推測(cè)這條規(guī)則的開銷并不高。
我們會(huì)假設(shè)瀏覽器以這樣的方式工作:尋找 id 為 header 的元素,然后將樣式規(guī)則應(yīng)用到直系子元素中的 a 元素上。我們知道文檔中只有一個(gè) id 為 header 的元素,并且它只有幾個(gè) a 元素的子節(jié)點(diǎn),所以這個(gè) CSS 選擇器應(yīng)該相當(dāng)高效。
事實(shí)上,卻恰恰相反,CSS 選擇器是從右到左進(jìn)行規(guī)則匹配。了解這個(gè)機(jī)制后,例子中看似高效的選擇器在實(shí)際中的匹配開銷是很高的,瀏覽器必須遍歷頁(yè)面中所有的 a 元素并且確定其父元素的 id 是否為 header 。
如果把例子的子選擇器改為后代選擇器則會(huì)開銷更多,在遍歷頁(yè)面中所有 a 元素后還需向其上級(jí)遍歷直到根節(jié)點(diǎn)。
CSS Code復(fù)制內(nèi)容到剪貼板
#header a {font-weight:blod;}
理解了 CSS 選擇器從右到左匹配的機(jī)制后,明白只要當(dāng)前選擇符的左邊還有其他選擇符,樣式系統(tǒng)就會(huì)繼續(xù)向左移動(dòng),直到找到和規(guī)則匹配的選擇符,或者因?yàn)椴黄ヅ涠顺?。我們把最右邊選擇符稱之為關(guān)鍵選擇器。
1.避免使用通用選擇器
CSS Code復(fù)制內(nèi)容到剪貼板
/* Not recommended */
.content * {color: red;}
瀏覽器匹配文檔中所有的元素后分別向上逐級(jí)匹配 class 為 content 的元素,直到文檔的根節(jié)點(diǎn)。因此其匹配開銷是非常大的,所以應(yīng)避免使用關(guān)鍵選擇器是通配選擇器的情況。
2.避免使用標(biāo)簽或 class 選擇器限制 id 選擇器
CSS Code復(fù)制內(nèi)容到剪貼板
/* Not recommended */
button#backButton {…}
/* Recommended */
#newMenuIcon {…}
3.避免使用標(biāo)簽限制 class 選擇器
CSS Code復(fù)制內(nèi)容到剪貼板
/* Not recommended */
treecell.indented {…}
/* Recommended */
.treecell-indented {…}
/* Much to recommended */
.hierarchy-deep {…}
4.避免使用多層標(biāo)簽選擇器。使用 class 選擇器替換,減少 css 查找
CSS Code復(fù)制內(nèi)容到剪貼板
/* Not recommended */
treeitem[mailfolder="true"] > treerow > treecell {…}
/* Recommended */
.treecell-mailfolder {…}
5.避免使用子選擇器
CSS Code復(fù)制內(nèi)容到剪貼板
/* Not recommended */
treehead treerow treecell {…}
/* Recommended */
treehead > treerow > treecell {…}
/* Much to recommended */
.treecell-header {…}
6.使用繼承
CSS Code復(fù)制內(nèi)容到剪貼板
/* Not recommended */
#bookmarkMenuItem > .menu-left { list-style-image: url(blah) }
/* Recommended */
#bookmarkMenuItem { list-style-image: url(blah) }
關(guān)于CSS代碼需要注意的編寫規(guī)范及優(yōu)化建議有哪些問(wèn)題的解答就分享到這里了,希望以上內(nèi)容可以對(duì)大家有一定的幫助,如果你還有很多疑惑沒(méi)有解開,可以關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道了解更多相關(guān)知識(shí)。