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.想要获取本文源码,点击前往吧

相关推荐
学习使我快乐0119 分钟前
JS进阶 3——深入面向对象、原型
开发语言·前端·javascript
bobostudio199520 分钟前
TypeScript 设计模式之【策略模式】
前端·javascript·设计模式·typescript·策略模式
黄尚圈圈1 小时前
Vue 中引入 ECharts 的详细步骤与示例
前端·vue.js·echarts
浮华似水2 小时前
简洁之道 - React Hook Form
前端
正小安4 小时前
如何在微信小程序中实现分包加载和预下载
前端·微信小程序·小程序
_.Switch6 小时前
Python Web 应用中的 API 网关集成与优化
开发语言·前端·后端·python·架构·log4j
一路向前的月光6 小时前
Vue2中的监听和计算属性的区别
前端·javascript·vue.js
长路 ㅤ   6 小时前
vite学习教程06、vite.config.js配置
前端·vite配置·端口设置·本地开发
长路 ㅤ   6 小时前
vue-live2d看板娘集成方案设计使用教程
前端·javascript·vue.js·live2d
Fan_web6 小时前
jQuery——事件委托
开发语言·前端·javascript·css·jquery