电脑端京东的我的订单html+css页面_[网页编程] HTML+CSS 购物车搭建实操

最新推荐文章于 2024-07-03 21:45:00 发布

weixin_39591720

最新推荐文章于 2024-07-03 21:45:00 发布

阅读量1.8k

点赞数

文章标签：电脑端京东的我的订单html+css页面

本文通过分析京东购物车页面的构成，详细介绍了如何使用HTML和CSS进行网页制作。首先，强调了理解网页需求和模块化划分的重要性，接着通过Ctrl+S保存页面获取素材。然后，逐步讲解了CSS代码和HTML代码的实现过程，帮助读者实践网页编程技能。

摘要由CSDN通过智能技术生成

前面的学习是为了知晓各个标签的使用和作用,那如何化散为整为我所有呢,这就需要一个项目的实操来融合一波

首先,我们要制作一个网页,上来之后是直接写代码吗?

回答:是也不是

因为,第一个我们要分析网页需要哪些构成第二个我们还需要对网页进行模块化的划分

拿京东购物车为例

首先

一个简单的购物结算页面,就可以划分为8个部分

其次

网页的内容是整体居中的没有占满整个浏览器

https://3.cn/hDVCpX (二维码自动识别)

内容分析清楚后,我们就开始吧

下载素材

在我们的购物车页面,直接ctrl+s保存页面即可获取所有元素的材料

首先先引入CSS文件定义整体页面

然后这是我们要实现的页面

CSS代码

HTML代码

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		
		<link rel="stylesheet" type="text/css" href="css/reset.css"/>
		
		
		<link rel="stylesheet" type="text/css" href="css/jd.css"/>
		
		<link rel="stylesheet" type="text/css" href="icon/iconfont.css"/>
		
		<script type="text/javascript" src="js/jd.js" ></script>
	
		
	</head>
	<body>
		
		<!--导航开始-->
		  
		  <div class="nav">
		  	
		  	
		  	 <div