图书网站建设的规模策划书,企业网站建设的三个核心问题,wordpress显示更新时间,做360网站快速排名软件前言
声明#xff1a;该文章只是做技术分享#xff0c;若侵权请联系我删除。#xff01;#xff01;
使用技术#xff1a;HTMLCSSJS 主要内容#xff1a;对学校官网的结构进行模仿#xff0c;对布局进行模仿。
主要内容
1、首页
首页以多个div对页面进行分割和布局…前言
声明该文章只是做技术分享若侵权请联系我删除。
使用技术HTMLCSSJS 主要内容对学校官网的结构进行模仿对布局进行模仿。
主要内容
1、首页
首页以多个div对页面进行分割和布局背景颜色使用红色显得官网比较喜庆。
首页最上方才用li标签和css进行样式设计编写出一个横向排列的菜单。
往下走使用js实现动态的轮播图效果。
最后在首页下方对学校的一些文字信息进行展示。
代码如下
div stylewidth:100% classclearfixh1 idlogo飘嫖缥漂艺术培训学校/h1/divdiv idnavul classclearfixli classcura hrefindex.html首页/a/lilia hrefbrief.html中心简介/a/lilia hrefjiao.html校园一角/a/lilia hrefzhao.html招生简章/a/lilia hrefartlist.html作品展示/a/lilia hreflist.html招生动态/a/lilia hrefbao.html在线报名/a/lilia hrefcontact.html联系我们/a/li/ul/div/div2、中心简介
中心简介界面对学校的发展历史进行详细描述。
左侧使用li标签实现了动态信息和联系我们。
代码如下
div idsidebardiv classmod newsModdiv classhdh2动态信息/h2/divdiv classbdulli· a hrefdetail.html飘嫖缥漂艺术培训学校/a/lili· a hrefdetail.html飘嫖缥漂艺术培训学校/a/lili· a hrefdetail.html飘嫖缥漂艺术培训学校/a/lili· a hrefdetail.html飘嫖缥漂艺术培训学校/a/lili· a hrefdetail.html飘嫖缥漂艺术培训学校/a/lili· a hrefdetail.html飘嫖缥漂艺术培训学校/a/lili· a hrefdetail.html飘嫖缥漂艺术培训学校/a/lili· a hrefdetail.html飘嫖缥漂艺术培训学校/a/li/ul/div/divdiv classmod contactModdiv classhdh2联系我们/h2/divdiv classbdp电 话nbsp;/pp联系人nbsp;/pp网址nbsp;/pp邮 箱nbsp;/pp地址nbsp;/p/div/div/div3、校园一交
展示学校的一些照片信息用来展示学校的风貌使用img标签实现。
4、其他
其他页面的组成结构都是类似的这里不做详细说明了。 总结
想要看具体效果的同学可以访问这个链接 https://www.bilibili.com/video/BV1zK411s7yu/?vd_source5f425e0074a7f92921f53ab87712357b 具体的代码也在该链接下。
