1. 說一說平時寫代碼遵守的編碼規范
- 首先，命名技巧
選用語義化的標簽
基于功能命名、基于內容命名、基于表現來命名
總而言之就是：簡略、明了、無后患
- 常見命名規范
1 所有命名都使用英文小寫：
<div class="main"></div>
2 命名用引號包裹：<div id="header"></div>
3 用中橫線連接：<div class="mod-modal"></div>
4 命名體現功能，不涉及表現樣式(顏色、字體、邊框、背景等)：<div class="text-lesser"></div>
5 .wrap或.wrapper ：用于外側包裹
6 .container或 .ct ：包裹容器
7 .header -- 用于頭部
8 .body -- 頁面 body
9 .footer -- 頁面尾部
10 aside、sidebar -- 用于側邊欄
11 .content -- 和header footer 對應，用于主要內容
12 .navigation -- 導航元素
13 .pagination -- 分頁
14 .tabs > .tab -- tab 切換
15 .tabs > .tab -- tab 切換
16 .breadcrumbs -- 導航列表、面包屑
15 .dropdown -- 下拉菜單
16 .article -- 文章
17 .main -- 用于主體
18 .thumbnail -- 頭像，小圖像
19 .media -- 媒體資源
20 .panel -- 面板
21 .tooltip -- 鼠標放置上去的提示
22 .popup -- 鼠標點擊彈出的提示
24 .button、.btn -- 按鈕
25 .ad -- 廣告
26 .subnav -- 二級導航
27 .menu -- 菜單
28 .tag -- 標簽
29 .message或者.notice -- 提示消息
30 .summary -- 摘要
31 .logo -- logo
32 .search -- 搜索框
33 .login -- 登錄
34 .register -- 注冊
35 .username -- 用戶名
36 .password -- 密碼
37 .banner -- 廣告條
38 .copyright -- 版權
39 .modal或者 .dialog -- 彈窗
- CSS 書寫規范
- tab 用兩個空格表示
- css的 :后加個空格， {前加個空格
- 每條聲明后都加上分號
- 換行，而不是放到一行
- 顏色用小寫，用縮寫, #fff
- 小數不用寫前綴, 0.5s -> .5s；0不用加單位
- 盡量縮寫， margin: 5px 10px 5px 10px -> margin: 5px 10px
2. 垂直居中有幾種實現方式? 給出代碼范例
3. 實現如下效果，每種效果都只使用一個html 標簽來實現
