📂文章目录
👨🎓网页题目✍️网页描述🌐网页效果🔧 代码实现🧱HTML结构代码 🎁更多干货👨🎓网页题目
🧑个人网页设计、🙋♂️个人简历制作、👨💼简单静态HTML个人网页作品、👨🏭个人介绍网站模板 、等网站的设计与制作。
✍️网页描述
⭐个人网页设计网站模板采用DIV CSS布局制作,网页作品有多个页面,如 :个人介绍(文字页面)、我的作品(图片列表)、个人技能(图文页面)、在线留言(表单页面)CSS样式方面网页整体采用左右布局结构,制作了网页背景图片,导航区域每个导航背景色不同,导航背景色与页面背景呼应。
🌐网页效果
🔧 代码实现
🧱HTML结构代码
<html><head><meta charset="utf-8"><head><link href="css/all.css" rel="stylesheet" media="all" type="text/css" /><title>个人博客</title></head><body><div class="menu"><div class="banner"><div class="top_img"><div class="focus" id="focus"><div id="focus_m" class="focus_m"><ul><li style="display:block"> <img src="images/back.jpg" width="100%" /> </li><li style="display:none"> <img src="images/ad.jpg" width="100%" /> </li><li style="display:none"> <img src="images/ac.jpg" width="100%" /> </li></ul></div><a href="javascript:;" class="focus_l" id="focus_l" title="上一张"><b></b><span></span></a> <a href="javascript:;" class="focus_r" id="focus_r" title="下一张"><b></b><span></span></a> </div></div></div><ul class="center"><li><a href="index.html">首页</a></li><li><a href="sheying.html">摄影展示</a></li><li><a href="aihao.html">个人爱好</a></li><li><a href="riz.html">日志</a></li><li><a href="tuijian.html">读物推荐</a></li><li><a href="lianxi.html">xx我们</a></li></ul><div class="clear"></div></div><div class=" center"><div class="bar" id="wanbiao"><h3>基本信息</h3></div><div class="jianjie"><div class="touxiang"> <img src="images/touxiang.jpg" alt="" width="180" height="160"> </div><div class="xinxi"><p style="height: 30px;">姓名:XXX</p><p style="height: 30px;">性别:男</p><p style="height: 30px;">电话:XXXXXXX</p><p style="height: 30px;">邮箱:XXXXXXX</p></div><p><audio controls="controls" autoplay="autoplay" src="images/Life.mp3"></audio></p></div></div></div><div class="bar" id="pinpai"><h3>人生格言 : 迷茫的时候就努力一下试试~</h3></div><div class="fu"><div class="pics scrollleft"><ul><li><p><img src="images/7.jpg" height="250" width="470" /></p></li><li><p><img src="images/9.jpg" height="250" width="450" /></p></li></ul><div class="clear"></div></div></div><div class="end"><p>个人博客 </p></div></body></html>
🎁更多干货
1.如果我的博客对你有帮助、如果你喜欢我的博客内容,请 “👍点赞” “✍️评论” “💙收藏”
一键三连哦!
2.💗【👇🏻👇🏻👇🏻关注我| 获取更多源码 | 优质文章】
带您学习各种前端插件、3D炫酷效果、图片展示、文字效果、以及整站模板 、大学生毕业HTML模板 、期末大作业模板 、等! 「在这里有好多 前端 开发者,一起探讨 前端 Node 知识,互相学习」!
3.
以上内容技术相关问题💌欢迎一起交流学习👇🏻👇🏻👇🏻🔥
web网页设计与开发:简单的学生网页作业源码 基于html css javascript简单的个人博客网页制作期末作业