模仿手機html+css商城:
我的界面和新聞
首先看圖:
首頁和購物車:
提示:之前沒有加入輪播圖 這次把輪播圖加上 hahah… 太麻煩了 就擠一起了 隨意看看~~
代碼:
提示: 因為代碼是真的很重復,所以我會把代碼打包上碼云 有需要的可以直接打包 當然樣式很雜亂 博主正在努力中 希望前輩們,,別## 啊哈哈 記得點個贊啥@@@ 以下是其中我的界面 css的樣式沒有粘貼出來
碼云地址
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
<meta charset="utf-8">
<link rel="stylesheet" type="text/css" href="main.css"/>
<title>我的頁面</title>
</head>
<body>
<!-- 頂部欄資訊 -->
<div class="my">
<span>我的</span>
<span>設定</span>
</div>
<!-- 頭像 id顯示 -->
<div class="head">
<div>
<img src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1603376470401&di=a80d6a3db3baa9903abd06aed535327b&imgtype=0&src=http%3A%2F%2F
img.111com.net%2Fattachment%2Fart%2F169262%2F5940a9e9a9.jpg" >
</div>
<div>
<span>locl</span>
<span class="head-number">177*****123</span>
</div>
<div>
<img src="img/right.png" >
</div>
</div>
<!-- 身體顯示 -->
<div class="item">
<table>
<tr>
<th class="th1"><img src="img/huiyuan.png" ></th>
<th class="th2">商城會員</th>
<th class="th3"><img src="img/rightto.png" ></th>
</tr>
</table>
</div>
<div class="item">
<table>
<tr>
<th class="th1"><img src="img/shangjia.png" ></th>
<th class="th2">商家服務</th>
<th class="th3"><img src="img/rightto.png" ></th>
</tr>
</table>
</div>
<div class="item">
<table>
<tr>
<th class="th1"><img src="img/yue.png" ></th>
<th class="th2">余額寶</th>
<th class="th3"><img src="img/rightto.png" ></th>
</tr>
</table>
</div>
<div class="item">
<table>
<tr>
<th class="th1"><img src="img/zhangdan.png" ></th>
<th class="th2">賬單</th>
<th class="th3"><img src="img/rightto.png" ></th>
</tr>
</table>
</div>
<div class="item">
<table>
<tr>
<th class="th1"><img src="img/kefu.png" ></th>
<th class="th2">我的客服</th>
<th class="th3"><img src="img/rightto.png" ></th>
</tr>
</table>
</div>
</body>
</html>
# apperception:
實訓結束尾聲到來這個小demo在日漸把桿中雖然全是靜態界面,對于互動----甚肝頭疼,不過進步自我感覺有些許慢,或許是慢性子的原因,寫代碼總是一點點一點點的寫,相比別的小伙伴真的是暈~ 對于html+css的靜態樣式布局算是越來越熟練了,這次的互動或許要等學完js才能完成了,目前就放上小小的靜態
對于小專案來說真的非常練手最近腦袋里面就全是樣式啥玩意的 洋洋前端路還長 ,demo中的知識點 跟著會繼續寫出,,,,啊哈哈哈 果然憋久了話還是有點多!!!
講道理說實話 我認為我要出一篇git~ 太難了 或許也是我太笨 git 搞了老半天 話不多說 寫經驗吃食去了
轉載請註明出處,本文鏈接:https://www.uj5u.com/houduan/189027.html
標籤:java
