# 切版注意事項：

> ### 這邊以資安大會切版為主，可能會因為實際情況改變，以大家有說好的為主

---

1. html tag 語意注意，例如：用```<p></p>```裡面不能再包div或其他元素
2. 承上，html 套資料區不要用```<p></p>```，因為可能會造成

<p>{套資料的內容包含<div></div>}</p>

3. 盡量每個內容都要有自己的 tag & class name，例如：

<div class="calc-numbox">
 <div class="num-before"> 第 </div>
 <span class="num"> 999 </span>
 <small> 場次 </small>
</div>

儘量避免：
<div>
 1111 <span> 2222 </span>
 <div> 3333 </div>
</div>

4. 檔案、圖片檔命名＆整齊為主，可以直覺辨識為主，跟哪個頁面相關就取什麼名（讓其他人能輕易理解為主）
5. 檔名注意大小寫，盡量以小寫為主
6. html tag 在自己要交出去時記得對齊(beautify)，已經在 git，若沒有說好，原則上避免整頁重新整理對齊(beautify)
7. 不直接在 h1 ~ h6, p 加 font-size, 只有在 main.css 加，故改字大小請改 h1~h6,p（網站標準化）
8. tag class name 順序 先 bootstrap-class-name，再客製 class-name(不強制，但習慣可建立)
9. class name 工程師用駝峰式(跟程式有關)如：secAgenda，設計師用hyphen，如：sec-agenda(跟樣式有關)，如果出現駝峰+hyphen應是設計師用（註1.）
10. ．排表格不要用table，改用 div
11. css 少用 @layer,少用 !important
12. 蓋過 bootstrap class name 的原則，功能性、同一頁高重複性 的建議不要使用
13. Bootstrap v3.3.2 有風險，目前安全的版本是 3.4.0，使用 cdn 或下載版本都要注意一下（補充：https://cdn.jsdelivr 的來源應該安全，因為有用 Cloudflare？）
14. 其他不及備載，(想到再加)，主要製作上以可增、可減、別人看得懂、可套版的網頁為方向。

註1. 因為名詞太長用hyphen會太長，class命名結構也會不太一致，通常該字詞附近會有重複字詞
，如：section-innerPage, innerPage, innerPage-content