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

相关推荐
程序员小续2 分钟前
React 源码解读流程:从入口到渲染的全链路揭秘
前端·javascript·面试
江城开朗的豌豆5 分钟前
React key的隐藏技能:key改变时究竟发生了什么?
前端·javascript·react.js
JarvanMo14 分钟前
我用 Ktor 替换了 Retrofit-我的网络代码减少了一半
前端
excel18 分钟前
WebGL 入门到进阶全解析:从 Canvas 上下文到 3D 绘制与 WebGL2 新特性
前端
掘金安东尼30 分钟前
用 WebGL + Solid.js 构建混合材质 Shader
前端·webgl
恋猫de小郭34 分钟前
Flutter 小技巧之有趣的 UI 骨架屏框架 skeletonizer
android·前端·flutter
江城开朗的豌豆35 分钟前
玩转React Hooks
前端·javascript·react.js
阿酷tony39 分钟前
教育场景下禁用html5播放器拖动进度条的例子
前端·html·html5·在线教育场景·禁止播放器拖动
前端小巷子1 小时前
Vue3 响应式革命
前端·vue.js·面试
一狐九1 小时前
Flutter如何通过GlobalKey调用组件内的方法
前端·flutter