HTML静态网页成品作业(HTML+CSS)——个人介绍网页(1个页面)

🎉不定期分享源码,关注不丢失哦

文章目录


一、作品介绍

🏷️本套采用HTML+CSS,未使用Javacsript代码,共有1个页面

二、作品演示

三、代码目录

四、网站代码

HTML部分代码

c 复制代码
<div class="header">
		<div class="w">
			<div class="logo">
				<img src="./images/logo.png" alt="">
				<span>我的个人网页</span>
			</div>
			<div class="link">
				<a href="">我的网页首页</a>
			</div>
		</div>
	</div>
	
	<div class="banner">
		<div class="w">
			<img src="images/banner.jpg" alt="">
		</div>
	</div>
	
	<div class="geren">
		<div class="geren_left">
			<h3>个人名片</h3>
			<table cellspacing="0" cellpadding="0">
			<tr>
			</tr>
			<tr>
				<td class="bg">
					姓名
				</td>
				<td>
					某某某
				</td>
				<td class="bg">
					性别
				</td>
				<td>
					女
				</td>
			</tr>
			<tr>
				<td class="bg">
					民族
				</td>
				<td>
					汉
				</td>
				<td class="bg">
					国籍
				</td>
				<td>
					中国
				</td>
			</tr>
			<tr>
				<td class="bg">
					年龄
				</td>
				<td>
					17
				</td>
				<td class="bg">
					生日
				</td>
				<td>
					2006年12月4日
				</td>
			</tr>
			<tr>
				<td class="bg">
					就读学校
				</td>
				<td colspan="3">
					某某学校
				</td>
			</tr>
			<tr>
				<td class="bg">
					兴趣爱好
				</td>
				<td colspan="3">
					旅游、运动、绘画
				</td>
			</tr>
		</table>
		</div>
		<div class="geren_right">
			<img src="./images/rongyu.jpeg" alt="">
			<div>最佳员工荣誉</div>
		</div>
	</div>

五、源码获取

🥇 ~ 关注我,点赞博文~ 每天带你涨知识!

🎁1.看到这里了就[点赞+好评+收藏]三连 支持下吧,你的「点赞,好评,收藏」是我创作的动力。

💙2.想要获取本文源码,点击前往吧

相关推荐
不一样的少年_7 分钟前
【前端效率工具】再也不用 APIfox 联调!零侵入 Mock,全程不改代码、不开代理
前端·javascript·浏览器
IT_陈寒7 分钟前
JavaScript 性能优化实战:我通过这7个技巧将页面加载速度提升了65%
前端·人工智能·后端
JIngJaneIL11 分钟前
数码商城系统|电子|基于SprinBoot+vue的商城推荐系统(源码+数据库+文档)
java·前端·数据库·vue.js·论文·毕设·数码商城系统
GISer_Jing17 分钟前
Flutter架构解析:从引擎层到应用层
前端·flutter·架构
GISer_Jing25 分钟前
Flutter开发全攻略:从入门到精通
android·前端·flutter
艾小码29 分钟前
Vue组件通信不再难!这8种方式让你彻底搞懂父子兄弟传值
前端·javascript·vue.js
lcc18730 分钟前
Vue 数据代理
前端·javascript·vue.js
Moment31 分钟前
为什么我们从 Python 迁移到 Node.js
前端·后端·node.js
excel36 分钟前
📘 全面解析:JavaScript 时间格式化 API 实战指南
前端
咖啡の猫1 小时前
Vue基本路由
前端·vue.js·状态模式