首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

我的学校网页期末作业(纯html+css实现)

@TOC 一、‍网站题目 校园班级网页设计 、‍我的班级网页、我的学校、‍校园社团、校园运动会、等网站的设计与制作。... 二、✍️网站描述 ️HTML我的班级网页设计,采用DIV+CSS布局,共有多个页面,排版整洁,内容丰富,主题鲜明,首页使用CSS排版比较丰富,色彩鲜明有活力,导航与正文字体分别设置不同字号大小...网站程序方面:计划采用最新的网页编程语言HTML5+CSS3+JS程序语言完成网站的功能设计。并确保网站代码兼容目前市面上所有的主流浏览器,已达到打开后就能即时看到网站的效果。...网站素材方面:计划收集各大平台好看的图片素材,并精挑细选适合网页风格的图片,然后使用PS做出适合网页尺寸的图片。...网站文件方面:网站系统文件种类包含:html网页结构文件、css网页样式文件、js网页特效文件、images网页图片文件; 网页编辑方面:网页作品代码简单,可使用任意HTML编辑软件(如:Dreamweaver

1.1K20

【CSS】965- 5种实现CSS底部固定的方法

我们知道,当内容足够多可以撑开底部到达浏览器的底部,如果内容不够多,不足以撑开元素到达浏览器的底部时,下面要讲的布局就是解决如何使元素粘住浏览器底部。...方法一:全局增加一个负值下边距等于底部高度 有一个全局的元素包含除了底部之外的所有内容。它有一个负值下边距等于底部的高度。....push等于底部的高度,来防止内容覆盖到底部的元素。...这个push元素是智能的,它并没有占用到底部的利用,而是通过全局加了一个负边距来填充。...方法二:底部元素增加负值上边距 虽然这个代码减少了一个.push的元素,但还是需要增加多一层的元素包裹内容,并给他一个内边距使其等于底部的高度,防止内容覆盖到底部的内容。

1.3K30
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    填满Github的绿色格子用我做的VSCode插件-Auto Commit

    autoCommit 一个用于Git自动commit的VSCode插件,它可以用来补充之前忘记提交commit,帮助你把首页的绿色格子填满。...提交完善的日志: 清晰的了解插件的运行情况 后台运行,不影响编码、浏览网页等。 运行超快,如下图187次commit,20秒搞定。 还有超多细节优化。 使用效果 使用本插件来控制commit次数....提交以前和未来的commit 在19年12月我创建了一个测试账号:koroTest,经过测试: 1.成功提交17年的10月份的commit。...一天15-20次commit颜色为 #239a3b 一天21-63次commit颜色为 #196127 后面的没有再测试了,应该最深的颜色就是 #196127。...保存配置和后台运行 插件在运行成功一次之后,会自动保存你的配置参数,在你下次通过命令打开插件的时候,会自动初始配置参数。 插件是可以挂在后台运行,不影响你编码、浏览网页之类的。

    1.4K20

    #PY小贴士# 抓下来的网页为什么没有我要的内容?

    刚刚接触爬虫的同学常会遇到这样的疑问: 为什么网页上面有的信息,我用代码抓下来的里面就没有,也没有报错?...除开请求本身失败或被反爬的情况外,通常这种问题的原因其实是: 页面上本来就没有你要的内容! 那么网页上的内容是哪里来的?...现在绝大多数网站的内容并非直接通过你访问的 URL 请求直接返回,而是会通过一种叫做 AJAX 的方法,在页面的基本框架加载完毕后,再通过其他的请求向后台服务器再次请求获取的。...具体细节我不展开了,你可以网上去按我给到的关键字去搜索相关内容,下次我也会专门发下这方面的讲解文章。 那开发者工具里为什么又会在代码里显示出这些内容呢?...这是因为开发者工具的元素(Elements)项显示的并不是网页的原始代码,而是浏览器将页面加载并渲染后的结果,它里面包含了异步请求拿到的数据和前台JS代码执行后对页面内容的修改。

    2.1K20

    关于web前端大作业的HTML网页设计——我的班级网页HTML+CSS+JavaScript

    一、‍网站题目 个人网页设计、‍♂️个人简历制作、‍简单静态HTML个人网页作品、‍个人介绍网站模板 、等网站的设计与制作。... 二、✍️网站描述 ⭐个人网页设计网站模板采用DIV CSS布局制作,网页作品有多个页面,如 :个人介绍(文字页面)、我的作品(图片列表)、个人技能(图文页面)、在线留言(表单页面)CSS样式方面网页整体采用左右布局结构...网站程序方面:计划采用最新的网页编程语言HTML5+CSS3+JS程序语言完成网站的功能设计。并确保网站代码兼容目前市面上所有的主流浏览器,已达到打开后就能即时看到网站的效果。...网站素材方面:计划收集各大平台好看的图片素材,并精挑细选适合网页风格的图片,然后使用PS做出适合网页尺寸的图片。...网站文件方面:网站系统文件种类包含:html网页结构文件、css网页样式文件、js网页特效文件、images网页图片文件; 网页编辑方面:网页作品代码简单,可使用任意HTML编辑软件(如:Dreamweaver

    1.8K20

    网页|CSS的动画实现

    题描述 一些CSS属性是可以实现动画效果,即我们可以用CSS实现动画和过渡。...动画是CSS最具有颠覆性的特征之一,接下来我们就来感受一下CSS的动画吧。 解决方案 1、方法: 1)定义动画:用keyfames定义动画(类似定义类选择器)。...100%{ width:1200px; } 2)使用(调用)动画 在此处我们设计一个盒子,当我们打开网页时它可以从左边跑到右边...3)讲解: 0%是动画的开始,100%是动画的完成。这样的规则就是动画序列。 在@keyframes中规定某项CSS样式,就能创建由当前改为新样式的动画效果。...学习过 flash 的同学知道,这种逐帧动画是由关键帧组成,很多个关键帧连续的播放就组成了动画,在 CSS3中是由属性keyframes来完成逐帧动画的。

    1.3K10

    【CSS】网页美学的魔法画笔

    我的主页:2的n次方_ CSS 用于定义网页的样式,包括字体、颜色、布局、背景等各个方面。它与 HTML 紧密结合,HTML 负责构建网页的结构,而 CSS 则负责美化这个结构。 1....外部样式 定义 标签,通过 href 属性引用外部 css 文件 把 css 样式设置代码单独存放在一个文件中 html 文件中的 head 标签中引入 link 标签: css"> 2....CSS 选择器 CSS 选择器的主要功能就是选中页面指定的标签元素,选中了元素之后才可以设置属性,CSS 的选择器有:标签选择器,class 选择器,id 选择器,复合选择器,通配符选择器 2.1....100px; height: 20px; border: 1px red solid; }; 你好 你好 可以看出 div 生效了,span 并没有生效

    10810

    网页|css中的匹配问题

    问题描述 众所周知在写css的时候,会根据html中类的定义或者id的定义来写相应的css代码。给不同的类定义不同的样式,当然为了能够少写一些代码,大家就会在css中引用匹配。...匹配的方式有几种。当然也可以在html中写不同的类名,或者写相同的类名,就能够实现所有的样式的匹配。但有时候类名不能够写到相同,这样就会出现冗余的代码,就会造成代码复杂度的增强。...为了减少代码的冗余,就出现了类的匹配。 解决方案 第1种就是利用div进行匹配,但这种匹配会给所有的div都使用相同的样式。...图2.2 效果 这样就能够实现,只要类名中含有Icon的都可以实现样式的匹配。但这种匹配,对于开始为icon类名的就无法实现相应的效果,所以可以将两者配合使用。这样就可以完全的实现匹配效果。 ?...在写代码的过程中一定要学会减少代码的冗余,这样的程序就能够更好的运行。

    1.2K20

    html css制作静态网页_简单的静态网页代码

    大家好,又见面了,我是你们的朋友全栈君。 网页简介:经过pink老师的课程学习之后,制作了一个简单的静态页面,主要是运用html和css。...-- 底部模块结束 --> css代码部分: * { margin:0px; padding:0px; } body { background-color: #f3f5f7...文章总结: 这篇文章是我在自学前端时练习基础内容制作的网页,我在这次学习之前也看过另外的视频,就只是看,做做笔记,并没有练习,以至于在最后的网页大作业并没有很好的完成,很小的一个部分都会出很多问题,做了好多天都没有做完...在这次学习中,也算是复习基础内容,对前一次学习中没有掌握的内容又重新加深了,在这次制作网页时就解决了很多以前遇到的问题。...这个网页只是基于html和css的静态页面,也只是学成网网页的一部分,其中的链接等多个功能都还未能实现,我将在以后的学习中,补齐所缺的部分。

    9.5K20

    链式调用 | 我的代码没有else

    嗯,我的代码没有else系列,一个设计模式业务真实使用的golang系列。 ? 前言 本系列主要分享,如何在我们的真实业务场景中使用设计模式。...- 实现抽象方法`Do`:具体获取购物车数据的逻辑 ......略 子类X(以及未来会增加的逻辑) - 继承抽象类父类 - 实现抽象方法`Do`:以及未来会增加的逻辑 但是,golang里没有的继承的概念...代码demo package main //--------------- //我的代码没有`else`系列 //责任链模式 //@auhtor TIGERB我的代码没有`else`,只是一个在代码合理设计的情况下自然而然无限接近或者达到的结果,并不是一个硬性的目标,务必较真。 2....---- 我的代码没有else系列 更多文章 代码模板 | 我的代码没有else 点击https://github.com/TIGERB/easy-tips/tree/master/go/src/patterns

    1.7K40

    代码模板 | 我的代码没有else

    嗯,我的代码没有else系列,一个设计模式业务真实使用的golang系列。 ? 前言 本系列主要分享,如何在我们的真实业务场景中使用设计模式。...关于怎么用,完全可以生搬硬套我总结的使用设计模式的四个步骤: 业务梳理 业务流程图 代码建模 代码demo 业务梳理 我通过历史上接触过的各种抽奖场景(红包雨、糖果雨、打地鼠、大转盘(九宫格)、考眼力、...main import ( "fmt" "runtime" ) //------------------------------------------------------------ //我的代码没有...main import ( "fmt" "runtime" ) //------------------------------------------------------------ //我的代码没有...我的代码没有`else`,只是一个在代码合理设计的情况下自然而然无限接近或者达到的结果,并不是一个硬性的目标,务必较真。 2.

    1K30

    订阅通知 | 我的代码没有else

    嗯,我的代码没有else系列,一个设计模式业务真实使用的golang系列。 ? 前言 本系列主要分享,如何在我们的真实业务场景中使用设计模式。...关于怎么用,完全可以生搬硬套我总结的使用设计模式的四个步骤: 业务梳理 业务流程图 代码建模 代码demo 业务梳理 注:本文于单体架构背景探讨业务的实现过程,简单容易理解。...代码demo package main //------------------------------------------------------------ //我的代码没有`else`系列...我的代码没有`else`,只是一个在代码合理设计的情况下自然而然无限接近或者达到的结果,并不是一个硬性的目标,务必较真。 2....---- 我的代码没有else系列 更多文章 代码模板 | 我的代码没有else 链式调用 | 我的代码没有else 代码组件 | 我的代码没有else 点击https://github.com/

    1.8K20

    代码组件 | 我的代码没有else

    嗯,我的代码没有else系列,一个设计模式业务真实使用的golang系列。 ? 前言 本系列主要分享,如何在我们的真实业务场景中使用设计模式。...,执行子组件的逻辑 但是,golang里没有的继承的概念,要复用成员属性ChildComponents、成员方法Mount、成员方法Remove怎么办呢?...( "fmt" "reflect" "runtime" ) //------------------------------------------------------------ //我的代码没有...我的代码没有`else`,只是一个在代码合理设计的情况下自然而然无限接近或者达到的结果,并不是一个硬性的目标,务必较真。 2....---- 我的代码没有else系列 更多文章 代码模板 | 我的代码没有else 链式调用 | 我的代码没有else 点击https://github.com/TIGERB/easy-tips/tree

    1.2K10

    客户决策 | 我的代码没有else

    嗯,我的代码没有else系列,一个设计模式业务真实使用的golang系列。 ? 前言 本系列主要分享,如何在我们的真实业务场景中使用设计模式。...用户决定使用美团支付下的银行卡支付方式的参数 ? 用户决定使用支付宝网页版支付方式的参数 ? 注:不一定完全准确。 业务流程图 我们通过梳理的文本业务流程得到了如下的业务流程图: ?...main import ( "fmt" "runtime" ) //------------------------------------------------------------ //我的代码没有...我的代码没有`else`,只是一个在代码合理设计的情况下自然而然无限接近或者达到的结果,并不是一个硬性的目标,务必较真。 2....---- 我的代码没有else系列 更多文章 代码模板 | 我的代码没有else 链式调用 | 我的代码没有else 代码组件 | 我的代码没有else 订阅通知 | 我的代码没有else

    91920

    我的 CSS 就是这么可爱——如何组织 CSS

    很难不让人改的怀疑人生,最后选择重写一遍(呜呜呜,别骂了,别骂了)!在碰到过这种情况后,我意识到我们需要从一个整体的角度来指导 CSS 书写,从而让样式文件变得更加美丽!这也是我写这篇文章的初衷。...CSS 的存在就是赋予页面美丽,如下面动图所示:   上面的动图我想每一位用户都更喜欢加了 CSS 文件之后的页面吧,因为符合人的审美。   ...三、CSS 的一些书写原则   CSS 本身是没有什么内置的组织方式的,并且有各种书写的方式,例如:内联和外链等等。所以我们需要自己完成建立编写 CSS 时维持统一性和规则性的工作。...这条原则的基础是 CSS 预处理语言的使用。因为 CSS 本身是一种描述语言,本身是没有逻辑的。但是随着业务的越来越复杂,我们渴望将逻辑代码加入 CSS 中。...不会管你使用哪种方式来进行格式化,我的看法是在遵循代码规范的前提下让 CSS 代码更加具有可读性。

    64430

    基于HTML+CSS+JavaScript制作简单的大学生网页设计——我的家乡湖南

    家乡旅游景点网页作业制作 网页代码运用了DIV盒子的使用方法,如盒子的嵌套、浮动、margin、border、background等属性的使用,外部大盒子设定居中,内部左中右布局,下方横向浮动排列,大学学习的前端知识点和布局方式都有运用...,CSS的代码量也很足、很细致,使用hover来完成过渡效果、鼠标滑过效果等,使用表格、表单补充模块,为方便新手学习页面中没有使用js有需要的可以自行添加。...1 网页简介:此作品为学生个人主页网页设计题材,HTML+CSS 布局制作,web前端期末大作业,大学生网页设计作业源码,这是一个不错的网页制作,画面精明,代码为简单学生水平, 非常适合初学者学习使用...3.知识应用:技术方面主要应用了网页知识中的: Div+CSS、鼠标滑过特效、Table、导航栏效果、Banner、表单、二级三级页面等,视频、 音频元素 、Flash,同时设计了Logo(源文件)所需的知识点...width:280px; margin-right:5px; } .lishiyange .slist { text-align:center; } --- 三、个人总结 一套合格的网页应该包含

    86620

    网页|在CSS学习中的问题总结

    问题描述 经过前面对HTML5的入门学习,我已经对HTML格式有了大致了解,也掌握了如何运用标题、段落、图像以及列表、表格、表单来丰富自己的网页。...为了使页面看起来更美观,我开始着手对CSS的学习,在刚开始的学习过程中也确实遇到了许多问题,现在我把他们集中总结。...解决方案 首先明确我的学习顺序:CSS盒子模型→CSSborder→CSSoutline→CSS margin→CSS padding. boxmodle中遇到的问题: 问题一:(待解决)盒中内容过长会超出盒子...图2.1.2内容超出盒子范围时 问题二:(待解决)盒子中文本换行的规则?我原本以为空格会导致换行,但后来发现好像跟空格没有什么关系,如图: ? 图2.1.3盒子的代码 ?...结语 在学习H5与CSS的过程中,会遇到很多让人疑惑的地方,我的解决方法是实践与记录。先将问题暂时记在记事本,再在过程中不断试验并记录截图,方便后期总结对比。

    2.3K20

    网页抓包之我的歌单

    最近见不少人博客都发了关于网页抓包的教程,然后也激起了我的兴(zhuang)趣(bi),就诞生了这篇文章 也刚刚好前段时间,我的歌单对接酷狗的API失效了,趁机修复下,顺便撸个图文教程。...——来自基佬百科 我们这里讲的是对网页传输的数据进行截取,并不涉及重发、编辑等影响网络安全的操作。...目的: 解析酷狗歌曲直链 - 修复我的歌单 目标网站: http://t.kugou.com/1md5hf5t8V2 酷狗我的歌单分享短网址 使用工具: 谷歌浏览器F12(或 Ctrl +...手机版则是返回json Preserve Log:作用是在页面跳转后保留之前的日志 左上角的手机标志:切换当前浏览界面的UA为手机UA image.png 输入网址回车访问,网页发生跳转 image.png...继续查看抓包日志 image.png 带上歌曲的hash值即可获取到歌曲的相关信息和直链(hash值在前边的歌曲列表中已经返回了) image.png 总结: 短网址 -> 网页链接参数 -

    65320
    领券