HTML学生个人网站作业设计:我的家乡网站设计——南宁留言表单 无js 页面8个

news2024/9/27 23:24:16

源码获取 文末联系

Web前端开发技术
描述 网页设计题材,DIV+CSS 布局制作,HTML+CSS网页设计期末课程大作业 | 家乡旅游景点 | 家乡民生变化 | 介绍自己的家乡 | 我的家乡 | 家乡主题 | HTML期末大学生网页设计作业

  1. HTML:结构

  2. CSS:样式
    在操作方面上运用了html5和css3,
    采用了div+css结构、表单、超链接、浮动、绝对定位、相对定位、字体样式、引用视频等基础知识

  3. JavaScript:做与用户的交互行为

文章目录

  • 前端学习路线
  • 网页基本结构
  • 网页演示
    • HTML结构代码
  • 学的反而越迷茫
  • 学习更多


前端学习路线

(1)html文件:其中index.html是首页、其他html为二级页面;
(2)css文件:css全部页面样式,文字滚动, 图片放大等;
(3)js文件:js实现动态轮播特效, 表单提交, 点击事件等等(网页中运用到js代码)

网页基本结构

(1)首页:进入网页中看到的第一个页面(LOGO、公司名称、导航、banner、新闻、相关信息、底部信息、banner一般是5个  
(2)二级页面:从首页点击进入之后的页面叫做二级页面
(3)三级页面:从二级页面点击进入的页面

网页html:网页是构成网站的基本元素,是承载各种网站应用的平台。通俗地说,网站就是由网页组成的
首页网站:首页是一个网站的入口网页,故往往会被编辑得易于了解该网站多数作为首页的文件名是index加上扩展名
导航菜单:是指位于页面顶部或者侧边区域的,也称之为导航栏,它起着链接站点或者软件内的各个页面的作用.
网页页脚:是网页中每个页面的底部的区域。常用于显示附加信息。如作者、备案号等。


网页演示

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

HTML结构代码



<!DOCTYPE html>
<head>
<meta charset="utf-8" />
<title></title>
<link rel="stylesheet" type="text/css" href="css/style.css" />

</head>
<body>
<div class="main" >

<div  class="content12">
<div class="daohang">







   <ul>
    <li><a href="index.html">首页</a>
</li>
  
    <li><a href="lishiyange.html">历史沿革</a></li>
	
    <li><a href="renkou.html">人口</a></li>
	
    <li><a href="fengjingmingsheng.html">风景名胜</a></li>
	
    <li><a href="zhumingrenwu.html">著名人物</a></li>
	
    <li><a href="difangtechan.html">地方特产</a></li>
	
    <li><a href="renwuliebiao.html">人物列表</a></li>
	
    <li><a href="liuyan.html">留言</a></li>
	 
   </ul>
</div>
</div>
<div class="clear"></div>

<div  class="content12">
<div class="guanggaotupian">


<div class="img">
<img src="images/1.jpg"></div>
 

</div>
</div>
<div class="clear"></div>

<div  class="content12">
<div class="taitou">

<div class="title">
<div class="stitle"> 南宁</div>  <a href="#" class="more"></a>
</div>
 
</div>
<div class="nn">

<div class="desc">
<p>南宁,简称“邕”,别称绿城、邕城,是广西壮族自治区首府、北部湾城市群核心城市,国务院批复确定的中国北部湾经济区中心城市、西南地区连接出海通道的综合交通枢纽
。截至2019年,全市下辖7个区、5个县,总面积22112平方千米,建成区面积372平方千米,常住人口734.48万人,城镇人口467.88万人,城镇化率63.7%。
</p><p>南宁地处中国华南地区、广西南部,中国华南、西南和东南亚经济圈的结合部,是泛北部湾经济合作、大湄公河次区域合作、泛珠三角合作等多区域合作的交汇点,也是中国面向东盟开放合作的前沿城市、中国—东盟博览会永久举办地、国家“一带一路”有机衔接的重要门户城市,南部战区陆军机关驻地。
</p><p>南宁是一座历史悠久的文化古城,同时也是一个以壮族为主的多民族和睦相处的现代化城市。
</p><p>2017年1月,国务院发布《北部湾城市群发展规划》,将南宁定位为面向东盟的核心城市,支持建成特大城市和边境国际城市
;2018年11月入选中国城市全面小康指数前100名
;2018年重新确认国家卫生城市(区)。2023年,第三届全国青年运动会将在广西举行,广西计划采取以南宁市为主,其他城市辅助的办赛模式举办青运会。
</p><p>2020年6月,经中央依法治国委入选为第一批全国法治政府建设示范地区和项目名单。 
</div>


</div>
</div>
<div class="clear"></div>

<div  class="content12">
<div class="dibu">

<div class="desc">
南宁 
</div>


</div>
</div>
<div class="clear"></div></div></body></html>


学的反而越迷茫

有这种感觉很正常,因为你还没有真正去公司里面待过,也不清楚自己到底要学多少东西才能胜任公司里面给你分配的活。我从你的表述来看,你的基础应该还是很扎实的。跟着网上那种全套的视频教程学肯定没有问题。

当你以后真正进入公司,发现工作的难度和量大约只有你学习时期的大约20%,你可能就会发出一声叹息:原来工作也不过如此嘛。

这是很正常的,因为大部分公司是招你进去去干活的,写业务的,不是让你一个新人去研发公司架构的。都是现成的东西,你要做的就是在别人的教导下,手把手的指挥下去添砖加瓦。到时候你恐怕要惊呼:就这?

所以,放松心态吧,好好享受大学时光
—————————————————


学习更多

关注我 | 点赞博文 | 每天带你涨知识


在这里插入图片描述

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

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

泰克/Tektronix A622电流探头型号规格参数介绍

Tektronix/泰克电流探头A622产品介绍 品牌&#xff1a;Tektronix 产地&#xff1a;美国 Tektronix泰克A622交直流电流探头适用于万用表和示波器钳型;通用BNC接口。 Tektronix/泰克电流探头A622产品特点&#xff1a; AC/DC-100kHz 50mA to 100A峰值 适用于万用表和示波器 钳形开…

HTML期末大学生网页设计作业——奇恩动漫HTML (1页面) HTML+CSS+JS网页设计期末课程大作业

HTML实例网页代码, 本实例适合于初学HTML的同学。该实例里面有设置了css的样式设置&#xff0c;有div的样式格局&#xff0c;这个实例比较全面&#xff0c;有助于同学的学习,本文将介绍如何通过从头开始设计个人网站并将其转换为代码的过程来实践设计。 ⚽精彩专栏推荐&#x1…

C++:函数:回调函数:还不懂回调函数来捶我

前言 不知道你是否有这样的疑问&#xff0c;我们为什么需要回调函数&#xff0c;直接调用函数不就可以了吗&#xff1f;回调函数到底有什么用&#xff1f;程序员该如何理解回调函数了&#xff1f; 这篇文章就为你解答这些问题&#xff0c;读完这篇文章后&#xff0c;你的编程…

连接肠菌与宿主的桥梁:肠菌代谢物——肠菌功能研究新篇章

人的肠道内寄居着多种微生物&#xff0c;他们统称为肠道菌群。研究表明&#xff0c;肠道菌群失衡会导致多种人体疾病&#xff0c;包括糖尿病、肿瘤、心血管疾病、神经系统疾病等。 那么肠菌是怎么对人产生影响的呢&#xff1f;答案是肠菌产生的代谢物&#xff08;1, 2&#xf…

Vue3+nodejs全栈项目(资金管理系统)——后端篇(一)登录、注册

文章目录初始化创建项目配置跨域配置解析表单数据的中间件安装bodyparser初始化用户路由模块抽离用户路由模块中的处理函数登录注册新建admin表安装并配置mysql模块注册检测表单数据是否合法检测用户名是否被占用对密码进行加密处理bcryptjs插入新用户测试登录根据名字查询用户…

CDH6.3.2处理Zookeeper因未授权访问造成的漏洞

1.zookeeper的基本情况 zookeeper是分布式协同管理工具&#xff0c;常用来管理系统配置信息&#xff0c;提供分布式协同服务。zookeeper官网下载软件包&#xff0c;bin目录下有客户端脚本和服务端脚本。另外还有个工具对理解和使用zookeeper服务非常有用&#xff0c;即zk-ui&am…

文本层次语义元素

html5-文本层次语义元素 第1关_文本层次语义元素相关概念 第2关_文本层次语义元素 编程要求 在右侧编辑器中的Begin - End区域内补充代码&#xff0c;具体要求是&#xff1a; 1.运用HTML5中的语义化元素设计一个文章区(<article>)。 2.文章区中的头部为文章的标题&a…

如何自己开传奇单机架设超详细图文教程

如何自己成为传奇&#xff0c;如何自己搭建传奇非官服&#xff0c;首先下载传奇服务器后&#xff0c;会有两个压缩包&#xff0c;一个用于服务器&#xff0c;一个用于游戏补丁文件 传奇单机设置-GOM引擎的超详细图文教程 版本文件包含.exe&#xff0c;以上文件都不起作用。 …

共享里的文件被删除了怎么办?可尝试这三种恢复方法

共享里的文件被删除了怎么恢复&#xff1f;删除之后就马上去回收站找&#xff0c;可是没回收站里没有怎么办&#xff1f;——来自某xx小伙伴的咨询。如果你也出现同样的疑惑&#xff0c;那么可以尝试下面的三种方法恢复共享里的文件。 方法一、以前的版本恢复 从Windows XP SP…

前端获取ip地址判断国家请求不同baseUrl

项目背景 项目新需求&#xff1a;根据ip地址区分出国内外上网&#xff0c;axios 使用不同的baseurl&#xff0c;上传阿里oss不同bucket 获取ip地址 一、使用js自己获取 使用 RTCPeerConnection.setLocalDescription() WebRTC API pc端没问题&#xff0c;移动端不好使 //获取…

react源码分析:深度理解React.Context

开篇 在 React 中提供了一种「数据管理」机制&#xff1a;React.context&#xff0c;大家可能对它比较陌生&#xff0c;日常开发直接使用它的场景也并不多。 但提起 react-redux 通过 Provider 将 store 中的全局状态在顶层组件向下传递&#xff0c;大家都不陌生&#xff0c;…

第十期|惊!游戏广告主投放十万被骗,推广作弊竟全是虚拟用户

顶象防御云业务情报中心发现&#xff0c;在互联网生态中存在很多灰色的渠道刷量工作室&#xff0c;渠道方通常以低廉的价格通过这些工作室提高广告URL点击量、应用下载激活量、注册量和真实的推广数据提起反馈给广告主结算&#xff0c;但其提供的数据质量和价格一样低廉&#x…

用DevExpress实现基于HTMLCSS的桌面应用程序的UI(一)

DevExpress WinForm拥有180组件和UI库&#xff0c;能为Windows Forms平台创建具有影响力的业务解决方案。DevExpress WinForm能完美构建流畅、美观且易于使用的应用程序&#xff0c;无论是Office风格的界面&#xff0c;还是分析处理大批量的业务数据&#xff0c;它都能轻松胜任…

RabbitMQ的高可用和高可靠

01、什么是高可用机制 所谓高可用&#xff1a;是指产品在规定的条件和规定的时刻或时间内处于可执行规定功能状态的能力。 当业务量增加时&#xff0c;请求也过大&#xff0c;一台消息中间件服务器的会触及硬件&#xff08;CPU,内存&#xff0c;磁盘&#xff09;的极限&#x…

从输入url到页面展现的全过程

作为一道面试经常会问到的题目&#xff0c;看过很多写的很好的博文&#xff0c;整理成自己的笔记 大概来说分为以下几个过程&#xff1a; 输入url地址应用层进行DNS解析应用层生成HTTP请求报文传输层建立TCP连接网络层使用IP协议来选择路线数据链路层实现网络相邻节点间可靠的…

vue-pdf+element实现全屏窗口pdf分页预览,pdf打印实现和解决打印乱码

一.源码 vue-pdf打印实现和乱码解决https://download.csdn.net/download/lucky_fang/85498529 二.全屏窗口打印预览效果 分页预览pdf 窗口采用element窗口模板实现&#xff0c;样式可根据自己喜欢的效果进行修改 Element官方文档 终于可以打印测试了&#xff0c;乱码~&…

【优化求解】粒子群算法求解干扰受限无人机辅助网络优化问题【含Matlab源码 230期】

⛄一、粒子群简介 1 粒子群优化算法 粒子群优化算法( PSO)是指通过模拟鸟群觅食的协作行为,实现群体最优化。PSO是一种并行计算的智能算法,其基本模型如下: 假设群体规模为M,在D维空间中,群体中的第i个个体表示为XD ( xm1,xm2…xm D)T,速度表示为VD ( vm1,vm2…vm D)T,位置( …

聊一聊我对Restful理解

概念 REST原则提倡按照HTTP的语义使用HTTP&#xff0c;如果一个系统符合REST原则&#xff0c;我们就说这个系统是Restful风格的。Restful是Web API设计中非常重要的一个概念&#xff0c;但是很多开发人员对于Restful的理解存在误区。 什么是Restful 在说什么是Restful 之前&…

MES必懂知识,市场需求下的生产管理系统

任何事物的产生和发展都与市场的需求是分不开的&#xff0c;只有当市场需求新生的事物的时候&#xff0c;他才会兴起&#xff0c;有的事物早已经产生&#xff0c;在当时的环境下并未兴起&#xff0c;却在后来才兴盛&#xff0c;这是市场的需求的影响。 MES便是在市场需求下诞生…

高通导航器软件开发包使用指南(9)

高通导航器软件开发包使用指南&#xff08;9&#xff09;8参数说明8.1最小条件参数8.2光学流量数据图8.3光学流量估算数据图8.4光学流量估算图8.5 pos_hold_mode内存8.6体积参数8.7障碍物输出参数8.8速度平滑曲线8参数说明 每辆车必须在适当的位置有运行时参数文件&#xff0c…