頁面效果,影院內容:
我的頁分為登錄、注冊、我的,如果登錄了那么就顯示我的頁面否則顯示登錄頁。
登錄頁:
我的頁:
一、標題頭部制作
接著我們點擊影院,發現當前頁內容為空:
我們的影院頁面跟首頁內容類似,此時我們先復制首頁的標題到影院頁面:
刪除右側欄目的內容以及logo區域內容:
此時在右側添加一個下拉菜單以及一個圖標:
圖標為 search:
此時你還需要更改這些圖標的屬性內容,使其能夠大小合適與當前頁面。接著我們發現當前右邊欄并不垂直居中,我們需要更改右側欄的垂直對齊為居中:
這樣的話,這個標題就做完了。
二、內容區域制作
接著制作內容區域,我們發現內容區域跟首頁的內容類似,也是需要對應的內邊距,此時只需要復制首頁欄部分的內容行到當前頁面之中即可:
此時是需要刪除其他內容的,保留熱映內容作為等下影院信息的內容部分。
復制過去后,更改熱映內容名稱為影院地點:
接著添加一個圖片,作為廣告圖,并且需要設置其寬度為 100%,否則就按照原本的比例顯示了:
其實這個影院信息還有個新人價的,之前截圖沒截全,此時頁面應該 如下:
我們可以從圖中得知,當前影院信息內部分為左側和右側,左側是影院信息,右側為新人價格,此時我們在影院信息內部新建兩個行一個是左,另一個是右,剩下的標簽內容暫時先不用理:
此時寬度左側行設置為 70%,右側行設置為 30%,使其占據整一行:
當然高度也要設置為包裹,并且這兩個行還需要給予對應的內邊距,使其內部有一定厚度,不然緊貼就不好看了,左邊框給予的內邊距:
右邊框給予的內邊距:
接著賦予文本:
文本記住一定要給予寬度為 100%,否則會超格,并且還需要使其換行為否:
接著我們再創建一個標簽占滿整個寬度,在里面添加一個文本即可:
文本若想使其有一定的寬度,只需要給予內邊距即可:
由于需要距離頂部一定距離和左側一定距離,在此直接給予了一個小量的邊距值,后期顯示便簽將會有多個標簽,為了不挨近,所以給予對應的小數值。
接著設置期邊框顏色和邊緣圓角值即可: