HTML静态网页作业——图图影视影院5页 带报告

源码获取 文末联系

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静态网页作业——图图影视影院5页 带报告_第1张图片
HTML静态网页作业——图图影视影院5页 带报告_第2张图片
HTML静态网页作业——图图影视影院5页 带报告_第3张图片

HTML结构代码



DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <link rel="stylesheet" href="../css/movie.css">
    <title>电影页面title>
head>
<body>
			<div class="box">
            <div class="box1">
          <a href="tutu1.html"><span class="name"><span class="mingzi">------图图影视影院span>span>a>			            
          <div class="city1">城市:沧州div>
            <div class="city2"><div class="city3"><a href="#"><span class="mingzi">定位城市:定位失败span>a>div>
            <div class="city4">定位失败div>div>
            <div class="login"><a href="login.html"><span class="mingzi">登录/span>a>div>
            <div class="exit"><a href="tutu1.html"><span class="mingzi">退出span>a>div>
          <div class="search1">
                    <input type="text" class="input" placeholder="找影视剧、影人、影院">
          div>
          <div class="search2">
                    <input class="submit" type="submit" value="搜索">
          div>
          div>
                <div class="one">
                <ul>
                    <li><a href="tutu1.html" class="three"><span class="mingzi">首页span>a>li>
                    <li><a href="movie.html" class="three active"><span class="mingzi">电影span>a>li>
                    <li><a href="yingyuan.html" class="three"><span class="mingzi">影院span>a>li>
                    <li><a href="bangdan.html" class="three"><span class="mingzi">榜单span>a>li>
                    <li><a href="#" class="three"><span class="mingzi">热点a>span>li>
                ul>
                div>
                div>
 	<div class="box2">
 		<span class="classly"><a href="#" class="two active">正在热映a>span>          <a href="#"><span class="sort4">即将上映span>a><a href="#">          <span class="sort4">经典影片span>a>
        <div class="classly1">
        <span class="first">类型:span>    <a href="#"><span class="quanbu">全部span>a>           <a href="#"><span class="sort4">爱情

你可能感兴趣的:(web前端期末大作业,html,javascript,前端,bootstrap,css)