寫乙個簡單的靜態商城頁面注意點 個人隨筆

2021-08-10 04:20:38 字數 1278 閱讀 2283

首先應該想到的是給乙個頁面加入版心

目的:這樣可以很好的約束頁面內的各個樣式

設定各個標籤的樣式,比如**京東的開頭

**:blockquote,body,button,dd,dl,dt,fieldset,form,h1,h2,h3,h4,h5,h6,

hr,input,legend,li,ol,p,pre,td,textarea,th,ul

練習時,我們一般直接設定* 還有一些文字、列表標籤、a標籤等等的預設樣式。

左浮動、右浮動

ul li的浮動,如果只li的右浮動要注意文字的開頭從最右邊開始

在外部引用css樣式時,要注意的路徑

小標題前面的小圖示位置有點偏,可以用relative來微調

兩個標題之間的分界線的加法:(如li兩邊)

a). 給li兩邊加邊框

b). 直接加小豎線|

c). 加乙個空li,在css中設定它的border

logo部分:

a).在乙個網頁中有且僅有乙個h1標籤

b).在搜尋引擎中根據h1標籤的內容來對網頁建立搜尋規則

c).在h1標籤中新增文字能夠幫助搜尋引擎優化搜尋結果

d).一般在h1標籤中加入文字,設定text-indent: -9999;

注意:input標籤必須放在form標籤中(更符合語義)

購物車中的數量的背景做法:給盒子border-radius,留下左下角不給

在新增小的裝飾品時應用

如圖右側的箭頭圖示用偽標籤來做如下:

.main

.listlia

::after

不需要在html中新增》,當然也可以在html中新增span標籤來做(比較麻煩);

如使用display:flex;會有很好的效果

也可以使用bootstrap的布局方式,如:

當然,可以選擇自己喜歡的布局方式。

1.檢查是否有字母寫錯

2.選擇器書寫錯誤:

檢查類名,id名,以及子元素的層級關係

3.被其他選擇器覆蓋了:

多個選擇器選中同乙個標籤,權重高的覆蓋了權重低的屬性

4.檔案未儲存

html寫乙個簡單的瀏覽頁面

html標籤通常是雙標籤如,我們將需要用到的文字放在雙標籤的中間 如果需要進行修飾,就在標籤的括號內打一空格然後書寫修飾部分如超連結標籤,需要進行鏈結的新增時 早年經歷 標題標籤 相應的h1為一級標題,h2為二級標題,h3,h4為三四級標題,一級標題最大,然後越來越小 段落標籤 換行標籤 這裡 凱里...

寫乙個簡單的登入頁面 html

首先 現在html裡的body裡寫 乙個頭部header標籤 雙標籤 然後在header標籤裡寫登入就像這樣 header 使用者登入 header 然後再寫乙個div標籤 div input type text name username placeholder 請輸入賬號 input type ...

寫乙個ExtJs的頁面框架

今天試著寫了乙個extjs的頁面展現,就是乙個大框,沒什麼功能,供以後在應用的時候作為參考,頁面的結構是 左邊乙個樹,右面乙個tabpanel,tabpanel中通過iframe套了乙個grid,首先是index頁面 index頁面中定義乙個 index.js 如下 ext.onready func...