前端大作业（期末复习）

最新推荐文章于 2024-06-24 00:21:51 发布
最新推荐文章于 2024-06-24 00:21:51 发布
阅读量1.2w 收藏 55
点赞数 13
分类专栏： 前端 文章标签： 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_41681241/article/details/95181220
版权 
<html>
    <title>小练习</title>
    <head>  
        <style>
.shangmian{
    width:100% ;
    height:20% ;
    background-size:cover ; 
    background-image:url(1.jpeg);
}
.title{
    font-size:50px ;    
    color:#AACECF;
}
.menu {
    align:center; 
    width:20%;
    height:70% ;
    background-color:#095B66;
}
.op{
    border:solid ;
    margin:10 ;
    background-color:#E6D70C ;
    width:200px ;
    height:30px ;
    font-color:#CD0CE6 ;
}
.int{
    position:absolute ;
    top:150px ;
    left:300px ;
    padding:10px ;
}

.in {
    margin:10 ;
}

.table {
    position:absolute ;
    top:200px ;
    left:300 ;
    border:1px ;
    margin:10 ;
}
#ta{
    margin:10px ;
    border-collapse:collapse ;
    width:1000px;
} 

#ta th,#ta td{
    border:solid 1px ;
    width:20% ;
    padding: 3px;
    text-align:center ;
}

.bu{
    margin:10 ;
}

        </style>
    </head>
    <body>
        <div class="shangmian" align="center">
            <p class="title"> 优乐影院管理系统</p>
        </div>
        <div class="menu" align=center>
             <button class="op">查询剧目信息</button><p>
            <button class="op">查询用户信息</button></p><p>
            <button class="op">查询演出计划</button></p><p>
            <button class="op">查询演出票</button></p>
        </div>
        <div class="int">
            <label>片名:</label>
            <input type="text" class="in"></input>
            <label>编号:</label>
            <input type="text" class="in"></input>
            <label>演出厅:</label>
            <input type="text" class="in"></input>
            <label>国家:</label>
            <select name="select" class="in" value="软件1704">
                <option>US</option>
                <option>CN</option>
                <option>CN_HK</option>
                <option>UK</option>
                <option>JP</option>
            </select>   
            <button>添加</button> 
            <button>取消</button>
        </div>
        <div><hr color=black></div>
        <div class="table">
            <table  id="ta">
                <tr class="Tr">
                    <th>
                        片名
                    </th>
                    <th>
                        编号
                    </th>
                    <th>
                        演出厅
                    </th> 
                    <th>
                        国家
                    </th>
                    <td>操作</td>
                </tr>
                <tr>
                    <td>蜘蛛侠－英雄使命</td>
                    <td>１</td>
                    <td>0002</td>
                    <td>US</td>
                    <td><button>删除</button><button>修改</button></td>
                </tr>
                <tr>
                    <td>蜘蛛侠－英雄使命</td>
                    <td>１</td>
                    <td>0002</td>
                    <td>US</td>
                    <td><button>删除</button><button>修改</button></td>
                </tr>
                <tr>
                    <td>蜘蛛侠－英雄使命</td>
                    <td>１</td>
                    <td>0002</td>
                    <td>US</td>
                    <td><button>删除</button><button>修改</button></td>
                </tr>
                <tr>
                    <td>蜘蛛侠－英雄使命</td>
                    <td>１</td>
                    <td>0002</td>
                    <td>US</td>
                    <td><button>删除</button><button>修改</button></td>
                </tr>
                <tr>
                    <td>蜘蛛侠－英雄使命</td>
                    <td>１</td>
                    <td>0002</td>
                    <td>US</td>
                    <td><button>删除</button><button>修改</button></td>
                </tr>
                <tr>
                    <td>蜘蛛侠－英雄使命</td>
                    <td>１</td>
                    <td>0002</td>
                    <td>US</td>
                    <td><button>删除</button><button>修改</button></td>
                </tr>
                <tr>
                    <td>蜘蛛侠－英雄使命</td>
                    <td>１</td>
                    <td>0002</td>
                    <td>US</td>
                    <td><button>删除</button><button>修改</button></td>
                </tr>
            </table>
            <p align=center><button>1</button><button>2</button><button>3</button><button>4</button><button>...</button></p>
        </div>
        <div align=center class="info"><p>联系方式：88888888 QQ:99999999 姓名：CK</p><div>
    </body>
</html>

在这里插入图片描述

osDetach
关注
专栏目录
学生HTML个人网页作业作品~蛋糕甜品店铺共11个页面(HTML+CSS+JavaScript)
七夕情人节表白网页代码100款 HTML5网页设计与制作1120款 Echarts大屏数据150款
07-01 3万+
学生HTML个人网页作业作品~ 个人主页博客网页设计制作~ 大学生个人网站作业模板~简单个人网页制作 ~面包店铺电商网站模板html 临近期末, 你还在为HTML网页设计结课作业,老师的作业要求感到头大？HTML网页作业无从下手？网页要求的总数量太多？没有合适的模板？等等一系列问题。你想要解决的问题，在这篇博文中基本都能满足你的需求~ 原始HTML+CSS+JS页面设计, web大学生网页设计作业源码，~这是一个不错的网页制作，画面精明，非常适合初学者学习使用。 作品介绍 红色的蛋糕甜品在线预订，面包店铺电
Web前端框架大作业/JavaScript大作业/html/css：音乐播放器
12-22
web前端框架期末大作业 ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ 到了期末考试周，时间紧任务重，要复习、要准备课设、准备大作业，甚至还要“答辩”，难以应付？实在不想从头开始做？...
Web前端大作业.zip
05-22
漫步时尚广场完整项目，推荐使用火狐浏览器。后台登陆帐号只有一个，｛"admin","123456"｝，登陆后跳转后台页面时，谷歌浏览器和uc浏览器无效，不清楚原因，内附文档说明，推荐先看一下文档
网易前端必考之大作业html+css+js
06-20
网易前端基本入职的时候都会做的作业，事业部前端面试的时候也考过其中的小技术，不适合前端老手～
Web前端大作业—传统文化网站设计题材(html+css+javascript)
最新发布
网页设计与制作 | HTML+CSS+JS
06-24 938
📔网站布局方面：计划采用目前主流的、能兼容各大主流浏览器、显示效果稳定的浮动网页布局结构。📓网站程序方面：计划采用最新的网页编程语言HTML5+CSS3+JS程序语言完成网站的功能设计。并确保网站代码兼容目前市面上所有的主流浏览器，已达到打开后就能即时看到网站的效果。📘网站素材方面：计划收集各大平台好看的图片素材，并精挑细选适合网页风格的图片，然后使用PS做出适合网页尺寸的图片。📒网站文件方面：网站系统文件种类包含：html网页结构文件、css网页样式文件、js网页特效文件、images网页图片文件
web 前端 大作业
jonathan_joestar的博客
04-01 5069
web 前端 大作业 没有框架 也没有后端数据交互,就是静态页面而已. 只是最简单的html css js https://www.kdocs.cn/l/cuFeWBp7sK5h [金山文档] web 报告.docx 链接：https://pan.baidu.com/s/1TXFK37S9cl1OAHIkHg3uIA 提取码：zwd6 复制这段内容后打开百度网盘手机App，操作更方便哦 ...
大学生个人网页设计 HTML个人网页制作 web个人网站模板 简单静态HTML个人网页作品
HTML网页设计
07-31 6万+
🧑个人网页设计、🙋‍♂️个人简历制作、👨‍💼简单静态HTML个人网页作品、👨‍🏭个人介绍网站模板 、等网站的设计与制作。⭐个人网页设计网站模板采用DIV CSS布局制作，网页作品有多个页面，如 :个人介绍（文字页面）、我的作品（图片列表）、个人技能（图文页面）、在线留言（表单页面）CSS样式方面网页整体采用左右布局结构，制作了网页背景图片，导航区域每个导航背景色不同，导航背景色与页面背景呼应。🏅 一套A+的网页应该包含 (具体可根据个人要求而定)📔网站布局方面：计划采用目前主流的、能兼容各大...
【微信小程序-毕设期末大作业】微信小程序源码题库：选择选项，切换至下一题.zip
05-06
【微信小程序-毕设期末大作业】微信小程序源码 【微信小程序-毕设期末大作业】微信小程序源码 【微信小程序-毕设期末大作业】微信小程序源码 【微信小程序-毕设期末大作业】微信小程序源码 【微信小程序-毕设期末大...
web前端期末大作业网页设计与制作 ——汉口我的家乡旅游景点 5页HTML+CSS+JavaScript
08-10
- **适用场景**：适用于大学生或初学者作为期末大作业或课程设计项目。不仅能够帮助学生复习和巩固所学知识，还能提升其实际操作能力。 #### 二、网页结构与布局 - **布局方式**：采用了DIV+CSS的布局方式，这是...
毕设&课设&项目&实训-哈尔滨工业大学2023春季学期数据库系统课程实验、作业、课件以及期末复习材料.zip
02-03
可作为毕设项目、课程设计、大作业、工程实训或初期项目立项。 【附加价值】： 项目具有较高的学习借鉴价值，也可直接拿来修改复刻。 对于有一定基础或热衷于研究的人来说，可以在这些基础代码上进行修改和扩展，...
web前端开发期末复习
12-14
为了进行Web前端开发期末复习，你可以按照以下步骤进行： 1. 复习HTML基础知识，包括标签、属性、表单等内容。可以参考引用中提供的HTML内容总结。 2. 复习CSS基础知识，包括选择器、盒模型、布局等内容。可以参考...
基于JS实现的联系人信息管理系统 前端大作业
04-22
jq插件漂亮注册登录界面 动态生成表格 动画轮播图 注册填写文本项合法检测 联系人管理界面
前端设计课程大作业.zip
04-03
1、设计的目的 做个网站以怀念个人旅游的日子。还有此刻的美丽,以及无限的未来向往。 2、设计布局 主页设计布局是在网站的左上角是网站标题名称、当前在线人数等，有背景图引入，右上角有个人头像模态下拉框，点击出现下拉列表，包含我的旅游日记、个人中心、退出等链接，还有登录、注册按钮，点击登录按钮来到登录页面，网站设计初衷就是自己要登录后才能发布旅游日记，这样更能保证私密性。网站中央是内容，包含三大板块，分别是最热、最新、话题三个主题驿站，每个主题下面是列出5条内容日记的标题链接，点击对应链接跳转到日记详情页面，最热代表浏览次数最多，最新就是根据发布旅游日记的时间来排序，最新发的日记内容排在最前面，话题是根据这次发布旅游日记的主题来排序的。网站尾部的左下角是网站设计目的简介，右下角分别是个人联系方式、合作方式、赞助商本人等。点击名字会弹出图片。 3、网站具体设计过程 首先选定 本网页制作工具是前端开发利器： WebStorm，创建前端项目工程，并创建相应的文件夹，存放各个css、js，还有网页中用到的各种图片，以及除了主页面index.html之外的二级页面，其存放在html文件夹下，在各个二级页面与主页跳转的网页链接上采用相对路径而不是绝对路径，创建好的项目工程目录结构如下所示; 首先设计网站主页也就是核心内容index.html，所有的二级页面都可以从主页跳转过去，相应的二级页面也都有主页的链接，可以随时返回到主页面。页面总体采用 CSS+DIV 布局，最外层DIV为框架，对重复页面代码进行抽取，比如网站头部用header.html来代替，网站底部用footer.html来代替，在各个要引用的网页上直接在其头部和尾部用iframe标签引入即可（），在背景图引入时采用（background-image:url("../pic/backpic.jpeg"); background-repeat: no-repeat; background-size:100% a）background-image标签进行操作。在日记链接显示以及网站底部链接上采用ui、li标签，在中屏显示的最新、最热、话题等主题下的具体旅游日记标题。
HTML期末大作业
11-24
这是我自己做的HTML期末大作业，花了很多时间，稍加修改就可以作为自己的作业了，而且也可以作为学习参考
Web前端大作业2.0.zip
04-03
1、设计的目的 做个棋手类网站以怀念个人围棋的时光。还有此刻的美丽,以及无限的未来向往。 2、设计布局 主页设计布局是在网站的右上角是标准的导航栏，包括主页、国内风云、风云人物、国外盛况、国外四位棋手简介、比赛报名等，点击相应的导航标签，跳转到相同模块对应的详情页展示，其网站左上角是网站标题，中间穿插背景图来突出适应网站风格。网站中央是图片跟内容简介，主要介绍国内棋手界风云，左边是图片，突出主题。接下来是风云人物链接资料，点击对应人物会弹出DIV文本框显示每个棋手的风云人物资料简介，点击右边的关闭按钮会关闭整个弹出的文本框，非常方便适宜网站的总体要求。接下来是国外盛况介绍，下面依次是四张围棋手的图片一字排开设计，鼠标悬停在上面会出现棋手姓名以及简介，点击图片会把棋手图片放大到中屏居中显示，还可以实现左右切换棋手图片，点击左上角的关闭按钮即可关闭弹出的图片。接下来拉到下面的国外四位棋手简介可以发现这是树形布局的四个div框，依照树形结构错落有致排开，分别展示上面四位棋手对应的资料简介，以及人物生平获奖资料等。网站靠近底部的位置就是国内群雄争霸比赛报名的Form表单，有棋手姓名、棋手电话、邮箱、比赛宣言等四项内容，并在提交前会依次检验文考框是否已经按照格式要求填写，如果没有按照要求规则填写会提示请修改该内容，直到符合要求为止，才能报名，填写完毕后点击报名，会弹出“恭喜棋手，报名成功，请等待组委会后续短信通知比赛规则”提示框，点击确定即可关闭报名成功提示框。 3、网站具体设计过程 首先选定 本网页制作工具是前端开发利器： WebStorm，创建前端项目工程，并创建相应的文件夹，存放各个css、js，还有网页中用到的各种图片，以及除了主页面index.html之外的二级页面，其存放在html文件夹下，在各个二级页面与主页跳转的网页链接上采用相对路径而不是绝对路径，创建好的项目工程目录结构如下所示。 首先设计网站主页也就是核心内容index.html，先要设计总体的导航条栏目，并点击对应主题来到其链接的详情页，这里采用href标签，用id进行位置定位。页面总体采用 CSS+DIV 布局，最外层DIV为框架，导航条设计。
Web前端大作业—个人网页(html+css+javascript)
weixin_61370021的博客
06-28 5万+
Web前端大作业—个人网页(html+css+javascript) 页面美观，有轮播相册，个人收藏，个人日志，天气查询，微电影页面多个页面。
前端大作业——靓丽皮包销售系统
qq_45426640的博客
12-19 598
一、 实验需求分析 1.顶部导航条，分为系统名称综述、简述、分类、搜索框。 2.录播大图5张，使用bootstrap 使用class=”carousel slide”. 3.轮播图下每个tab标签与导航二级子菜单联动，使用class=”feature-divider”.每部分子内容包括对皮包名称、皮包品牌简介，以及皮包公司简介。 4.四个二级子菜单右边为用户登录模板，包含用户名，密码，记住我，登录按钮,左下角有忘记密码链接。其中当光标放置sign in 按钮时，按钮发生动态变化。 5.四个二级子菜单与用户登
前端作业
JJTHZSP的博客
03-23 330
<div class="top_nav"><a href="#">one</a><span>1</span></div> <div class="top_nav"><a href="#">one</a><span>1</span></div&gt...
200套web前端期末大作业 HTML+CSS+JavaScript网页设计实例 企业网站制作 [建议收藏]
热门推荐
七夕情人节表白网页代码100款 HTML5网页设计与制作1120款 Echarts大屏数据150款
07-23 14万+
一、更多HTML期末学生结课大作业作品 ❤200套HTML期末大作业网页设计作品 1.HTML期末学生结课大作业~html+css+javascript仿叮当电影在线网站(功能齐全) 2.HTML期末学生作业~html+css+javascript仿猫眼电影在线网站(功能齐全) 3.HTML期末学生大作业（9套）html+css+javascript仿京东、天猫、服装、各大电商模板(大学毕业设计) 4.HTML期末大作业~海贼王中乔巴专题漫画学生网页设置作业源码(HTML+CSS+JavaScript) 5
web前端简易的期末大作业
05-29
Web前端的期末大作业可以根据自己的兴趣和技能来选择不同的方向，下面给您介绍一个简易的项目：一个个人博客网站。 个人博客网站可以展示自己的作品、想法和技术分享，同时也可以作为自己的个人品牌宣传。以下是该...
评论 2
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值