当前位置:网站首页>Minimalist movie website
Minimalist movie website
2022-07-07 12:25:00 【Miracle_ ze】
Minimalist movie website
home page
effect
html
<html>
<head><title> Catch the wind and follow the shadow </title>
<link href="css.css" type="text/css" rel="stylesheet"></head>
<body>
<div id="box">
<img src="images/movie_theme.jpg" />
<p id="nav"><a hrefe="#"> The plot </a> <a href="html/animation.htm"> Animation </a> <a href="html/sf.htm"> Science fiction </a> <a href="#"> action </a> <a href="#"> The suspense </a></p>
<p> There are many kinds of movies , Some make you cry , Some make you laugh ; </p>
<p> Some remind you of the past closed , Some make you look forward to the future ; </p><p> Some are very realistic , Some are bullshit ; </p>
<p classm="lastline"> Some make your brain work at high speed , Some give your heart a short rest .</p>
<p> The movie , It's such a magical thing ,</p>
<p> No matter what kind of movie it is — The plot , Animation , Science fiction , action , The suspense ......</p>
<p class="lastline"> Can make you feel the charm of life , Imagined surprise .</p>
<p> You ask me what a movie is ?</p>
<p> Maybe a movie is the whole world at a certain moment ,</p>
<p> Is eternity .</p>
<hr>
<p id="footer">copyright 2020</p>
</div>
</body>
</html>
Animation page ( The rest are the same , Same example )
Kehua page
Animation page html
<html>
<head><title> cartoon </title>
<link href=" ../css.css" rel="stylesheet" type="text/css" />
<style> #box{
background:lightgoldenrodyellow;} </style>
</head>
<body>
<div id="box">
<img class="banner" src="../images/animation_banner.jpg" />
<p id="nav"><a href="#"> The plot </a> <strong> Animation </strong> <a href="sf.htm"> Science fiction </a> <a href="#"> action </a> <a href="#"> The suspense </a></p>
<p id="bread"><a href="../ Movie home page .htm"> home page </a> > <strong> Animation </strong> </p>
<p><a href="nezha.htm"><img class="pics" src="../images/nezha.jpg" /></a><img class="pics" src="../images/spiritedaway.jpg" /><img class="pics" src="../images/zootopia.jpg" /></p>
<hr>
<p id="footer">copyright 2020</p>
</div>
</body>
</html>
Animation page details ( Which zha )
html
<html>
<head><title> cartoon </title>
<link href=" ../css.css" rel="stylesheet" type="text/css" />
<style> #box{
background:lightgoldenrodyellow;} </style>
</head>
<body>
<div id="box">
<img class="banner" src="../images/animation_banner.jpg" />
<p id="nav"><a href="#"> The plot </a> <strong> Animation </strong> <a href="sf.htm"> Science fiction </a> <a href="#"> action </a> <a href="#"> The suspense </a></p>
<p id="bread"><a href="../ Movie home page .htm"> home page </a> > <strong> Animation </strong> </p>
<p><a href="nezha.htm"><img class="pics" src="../images/nezha.jpg" /></a><img class="pics" src="../images/spiritedaway.jpg" /><img class="pics" src="../images/zootopia.jpg" /></p>
<hr>
<p id="footer">copyright 2020</p>
</div>
</body>
</html>
css
#box {text-align : center;
width: 80%;
margin: 0 auto;
}
#nav { font: 36px/2em Regular script ;
background: lightblue;
}
#bread {border-bottom:1px black dotted;
padding:3px;
text-align:left;}
#footer{font-size:small;}
h1{font:36px/2em In black ;}
h2{width:60%;border-bottom:1px black solid;margin:40px auto 20px;}
a{text-decoration:none;}
a:hover{text-decoration:underline;
color:red;}
.banner{width:850px;height:320px;}
.lastline{margin-bottom:2em;}
.pics{
width:350px;height:515px;margin:8px;
}
边栏推荐
- Tutorial on the principle and application of database system (008) -- exercises on database related concepts
- Static comprehensive experiment
- SQL Lab (32~35) contains the principle understanding and precautions of wide byte injection (continuously updated later)
- TypeScript 接口继承
- SQL lab 26~31 summary (subsequent continuous update) (including parameter pollution explanation)
- Several methods of checking JS to judge empty objects
- Sonar:Cognitive Complexity认知复杂度
- 解决 Server returns invalid timezone. Go to ‘Advanced’ tab and set ‘serverTimezone’ property manually
- (to be deleted later) yyds, paid academic resources, please keep a low profile!
- Is it safe to open an account in Ping An Securities mobile bank?
猜你喜欢
《通信软件开发与应用》课程结业报告
2022 年第八届“认证杯”中国高校风险管理与控制能力挑战赛
<No. 8> 1816. Truncate sentences (simple)
Unity map auto match material tool map auto add to shader tool shader match map tool map made by substance painter auto match shader tool
VSCode的学习使用
Processing strategy of message queue message loss and repeated message sending
Completion report of communication software development and Application
数据库系统原理与应用教程(009)—— 概念模型与数据模型
RHSA first day operation
Solutions to cross domain problems
随机推荐
NPC Jincang was invited to participate in the "aerospace 706" I have an appointment with aerospace computer "national Partner Conference
数据库系统原理与应用教程(010)—— 概念模型与数据模型练习题
SQL lab 1~10 summary (subsequent continuous update)
小红书微服务框架及治理等云原生业务架构演进案例
Hi3516全系统类型烧录教程
@Bean与@Component用在同一个类上,会怎么样?
30. Feed shot named entity recognition with self describing networks reading notes
<No. 9> 1805. Number of different integers in the string (simple)
<No. 9> 1805. 字符串中不同整数的数目 (简单)
<No. 8> 1816. 截断句子 (简单)
问题:先后键入字符串和字符,结果发生冲突
File upload vulnerability - upload labs (1~2)
百度数字人度晓晓在线回应网友喊话 应战上海高考英语作文
powershell cs-UTF-16LE编码上线
Introduction and application of smoothstep in unity: optimization of dissolution effect
[filter tracking] strapdown inertial navigation pure inertial navigation solution matlab implementation
[shortest circuit] acwing1128 Messenger: Floyd shortest circuit
即刻报名|飞桨黑客马拉松第三期盛夏登场,等你挑战
zero-shot, one-shot和few-shot
RHSA first day operation