静态网页设计——个人简介网站

前言

使用经典前端三件套HTML+CSS+Javascript编写了一个关于个人简介的静态网页,可以根据自己的需要,十分简单的进行修改。

首页

首页由上方的菜单栏以及菜单栏下面的轮播图组成,再往下走,是关于自己的兴趣爱好的部分,可以将图片和文字修改成自己想要的即可。
在这里插入图片描述

在这里插入图片描述

部分代码如下:

<div class="cssmenu"><ul><li class="active"><a href="index.html">首页</a></li><li><a href="wdjj.html">我的简介</a></li><li><a href="sthd.html">我的爱好</a></li><li><a href="yjfx.html">我的生活</a></li><li><a href="wdxx.html">我的学校</a></li><li><a href="wdjx.html">我的家乡</a></li><li class="last"><a href="sqrs.html">给我留言</a></li><div class="clear"></div></ul></div>

我的简介

我的简介部分就是简单介绍自己的个人信息。
在这里插入图片描述

部分代码如下:

<tr><td align="center" height="40" style="font-size:30px">姓名</td><td align="center" height="40" style="font-size:30px">xxx</td></tr><tr><td align="center" height="40" style="font-size:30px">外号</td><td align="center" height="40" style="font-size:30px">xxxxx</td></tr>

我的爱好

我的爱好部分介绍自己的个人爱海,把图片和文字一换,就可以改成自己的了,很方便!
在这里插入图片描述

部分代码如下:

<div class="blog_list"><h5>1、茶卡盐湖</h5><h5>7 3rd, 2017 , <a>我和朋友</a></h5><div class="blog_para"><p class="para"><a class="popup-with-zoom-anim"><img src="images/4.jpg" alt="" width="369" height="200"></a>茶卡盐湖也叫茶卡或达布逊淖尔,“茶卡”是藏语,意即盐池,也就是青海的盐;“达布逊淖尔”是蒙古语,也是盐湖之意。 茶卡盐湖位于青海省海西蒙古族藏族自治州乌兰县茶卡镇附近。地理坐标为东经99°02′~99°02′,北纬36°18′~36°45′。 在茶卡盆地的南面有鄂拉山,北面青海南山,与青海湖相隔;盆地东西长80km,宽30km,面积2400k㎡。茶卡盐湖位于茶卡盆地的西部,长15.8km,宽9.2km,面积154k㎡,湖面海拔3059m;盐湖的边缘呈放射状展布的茶卡河、莫河、小察汗乌苏河等河水入湖,在湖区东部泉水发育,以地下水的形式补给茶卡盐湖湖盆。</p><div class="clear"></div></div></div>

其他

其他页面也类似,我这里不一一列举了。
在这里插入图片描述

在这里插入图片描述

总结

想要看具体效果的同学,可以访问这个链接:
https://www.bilibili.com/video/BV1Gt4y1Z7Fx/?vd_source=5f425e0074a7f92921f53ab87712357b添加链接描述

具体的代码也在该链接下。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.hqwc.cn/news/318323.html

如若内容造成侵权/违法违规/事实不符,请联系编程知识网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

std::setlocale详解

头文件 #include <clocale>作用 std::setlocale是C标准库中的一个函数&#xff0c;用于设置当前程序的本地化&#xff08;locale&#xff09;环境。 setlocale 函数安装指定的系统本地环境或其一部分&#xff0c;作为新的 C 本地环境。 修改保持效果&#xff0c;并影…

后端杂七杂八系列篇一

后端杂七杂八系列篇一 ① MySQL选择合适的数据类型① Char与Varchar② Text与Blob ② EqualsAndHashCode(callSuper true)的作用③ mybatis-plus 相关① 主键生成策略② 使用Model实现CRUD③ Wrapper的用法① Wrapper的继承关系② 项目中最常用的warpper [LambdaQueryWrapper]…

drf知识--10

接口文档 # 后端把接口写好后&#xff1a; 登录接口&#xff1a;/api/v1/login ---> post---name pwd 注册接口 查询所有图书带过滤接口 # 前后端需要做对接&#xff0c;对接第一个东西就是这个接口文档&#xff0c;前端照着接口文档开发 公司3个人&#xff…

50、实战 - 利用 conv + bn + relu + add 写一个残差结构

上一节介绍了残差结构,还不清楚的同学可以返回上一节继续阅读。 到了这里,一个残差结构需要的算法基本都介绍完了,至少在 Resnet 这种神经网络中的残差结构是这样的。 本节我们做一个实战,基于之前几节中手写的 conv / bn 算法,来搭建一个残差结构。其中,relu 的实现和…

StratifiedGroupKFold解释和代码实现

StratifiedGroupKFold解释和代码实现 文章目录 一、StratifiedGroupKFold解释和代码实现是什么&#xff1f;二、 实验数据设置2.1 实验数据生成代码2.2 代码结果 三、实验代码3.1 实验代码3.2 实验结果3.3 结果解释 四、样本类别类别不平衡 一、StratifiedGroupKFold解释和代码…

AUTOSAR软件架构描述文档,AUTOSAR_EXP_LayeredSoftwareArchitecture

AUTOSAR软件架构描述文档&#xff0c;我们常见的经典的CP架构及OS双核等架构描述 下载链接&#xff1a;https://www.autosar.org/fileadmin/standards/R21-11/CP/AUTOSAR_EXP_LayeredSoftwareArchitecture.pdf

每日一练:LeeCode-503. 下一个更大元素 II (中)【单调栈】

本文是力扣LeeCode-503. 下一个更大元素 II 学习与理解过程&#xff0c;本文仅做学习之用&#xff0c;对本题感兴趣的小伙伴可以出门左拐LeeCode。 给定一个循环数组 nums &#xff08; nums[nums.length - 1] 的下一个元素是 nums[0] &#xff09;&#xff0c;返回 nums 中每个…

【hyperledger-fabric】部署和安装

简介 对hyperledger-fabric进行安装&#xff0c;话不多说&#xff0c;直接开干。但是需要申明一点&#xff0c;也就是本文章全程是开着加速器进行的资源操作&#xff0c;所以对于没有开加速器的情况可能会由于网络原因导致下载资源失败。 资料提供 1.官方部署文档在此&#…

动手学深度学习一:环境安装与数据学习

2024&#xff0c;重新开始深度学习。 第一步&#xff1a;李沐动手学深度学习 课程网址&#xff1a;https://courses.d2l.ai/zh-v2/ 包含教材和视频网址链接 Jupyter notebook安装 目前在本地先使用cpu版本pytorch&#xff0c;我的本地已经安装好conda&#xff0c;跟着教材创建…

闭着眼睛都要会的Linux命令

&#x1f604;作者简介&#xff1a; 小曾同学.com,一个致力于测试开发的博主⛽️&#xff0c;主要职责&#xff1a;测试开发、CI/CD 如果文章知识点有错误的地方&#xff0c;还请大家指正&#xff0c;让我们一起学习&#xff0c;一起进步。 &#x1f60a; 座右铭&#xff1a;不…

互联网加竞赛 Yolov安全帽佩戴检测 危险区域进入检测 - 深度学习 opencv

1 前言 &#x1f525; 优质竞赛项目系列&#xff0c;今天要分享的是 &#x1f6a9; Yolov安全帽佩戴检测 危险区域进入检测 &#x1f947;学长这里给一个题目综合评分(每项满分5分) 难度系数&#xff1a;3分工作量&#xff1a;3分创新点&#xff1a;4分 该项目较为新颖&am…

从零开始了解大数据(七):总结

系列文章目录 从零开始了解大数据(一)&#xff1a;数据分析入门篇-CSDN博客 从零开始了解大数据(二)&#xff1a;Hadoop篇-CSDN博客 从零开始了解大数据(三)&#xff1a;HDFS分布式文件系统篇-CSDN博客 从零开始了解大数据(四)&#xff1a;MapReduce篇-CSDN博客 从零开始了解大…