html - 如何在 html/css 中移动文本
问题描述
嗨,伙计们,我想知道如何解决这个问题。正如您在下图中看到的那样,文本粘在左侧。
这里的HTML代码:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title> PROJETO HARDWELL - História </title>
<meta name="author" content="João Santos">
<meta name="description" content="Aqui descrevo a minha página">
<meta name="keywords" content="HARDWELL ">
<link rel="icon" type="image/png" href="//cdn.djhardwell.com/assets/core/img/favicon.png">
<meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no">
<link href="assets/css/historia.css" rel="stylesheet">
</head>
<body>
<!-----------------------------VIDEO E TEXTO------------------------------------->
<div style="max-width:1280px;margin:0 auto; padding:5px; ">
<div style="position: relative;padding-bottom: 56.25%; height: 0; overflow: hidden;">
<iframe width="1280" height="720" frameborder="0" allowfullscreen="" autoplay
src="https://www.youtube.com/embed/WSYWLB3QKik?autoplay=1&mute=1" scrolling="no"
style="position: absolute; overflow: hidden; top: 0px; left: 0px; width: 100%; height: 100%; max-width: 1280px; max-height: 720px;"
tabindex="-1"></iframe>
</div>
</div>
<section>
<div class="content">
<p>Hardwell (nascido como Robbert van de Corput em Breda, Holanda) é um produtor progressivo de electro
house DJ. Em 2009 , após o sucesso de “Show Me Love vs.Be”, ele começou a produzir várias outras track
“singles” de sucesso na EDM como “Encoded” e “Cobra” e também começou a forma grandes parcerias como o
seu ídolo de infância DJ Tiesto e entre outros nomes da musica eletrônica.
<br>Em 2010 ele formou a sua própria produtora a Revelad Recordings e em 2011 foi classificado em número
24 no Top DJ Mag.
<br>Ao lado de outros artistas como Alesso, Koyu Deniz e R3hab, Hardwell foi nomeado para artista do ano
em 2012 pela MTV.
<br>Em Novembro participou do Dreamvalley Festival em Santa Catarina e também neste mês tornou-se o #6
no Top Dj Mag do mundo pela revista DjMag.
<br>
<br>
<br>
<h1 style="color:white;">Lista de remixes:</h1>
<br>
<!---->
<h2 style="color:white;">2003</h2>
<br>
<p style="color:white;font-size:19px;"> .The Underdog Project vs. Sunclub – "Summer
Jam 2003" (DJ Hardwell Bubbling Mix) </p>
<br>
<p style="color:white;font-size:19px;"> .DHS – "House of God" (DJ Hardwell Mix) </p>
<br>
<p style="color:white;font-size:19px;"> .Da Klubb Kings – "Two Thumbs Up" (DJ
Hardwell Mix) </p>
<br>
<p style="color:white;font-size:19px;"> .Ruthless & Vorwerk – "I Feel Like Dancing"
(DJ Hardwell Mix) </p>
<br>
<p style="color:white;font-size:19px;"> .Rmxcrw – "Turn Me On" (DJ Hardwell Mix) </p>
<br>
<p style="color:white;font-size:19px;"> .Camisra – "Let Me Show You" (DJ Hardwell
Mix) </p>
<br>
<p style="color:white;font-size:19px;"> .Praise Cats – "Shined On Me" (DJ Hardwell
Mix) </p>
<br>
<!---->
<br>
<h2 style="color:white;">2008</h2>
<br>
<p style="color:white;font-size:19px;"> .EliZe – "Hot Stuff" (Hardwell Sunrise Mix)
</p>
<br>
<p style="color:white;font-size:19px;"> .Gregor Salto – "Bouncing Harbour" (Hardwell
& R3hab Remix) </p>
<br>
<p style="color:white;font-size:19px;"> .Laidback Luke – "Break Down the House"
(Hardwell & R3hab Remix) </p>
<br>
<p style="color:white;font-size:19px;"> .The Partysquad – "Stuk" </p>
<br>
<p style="color:white;font-size:19px;"> .Robbie Taylor & Marc MacRowland – "Black
Bamboo" </p>
<br>
<p style="color:white;font-size:19px;"> .Booty Luv – "Dance Dance" </p>
<br>
<p style="color:white;font-size:19px;"> .DJ Chuckie - "Drop Low" </p>
<br>
<!---->
<br>
<h2 style="color:white;">2015</h2>
<br>
<p style="color:white;font-size:19px;"> .Domeno & Michael Sparks - Locked & Loaded
(Hardwell Edit) </p>
<br>
<p style="color:white;font-size:19px;"> .Calvin Harris feat. Ellie Goulding - Outside
(Hardwell Remix) </p>
<br>
<p style="color:white;font-size:19px;"> .Quintino - Scorpion (Hardwell Edit) </p>
<!---->
<br>
<h2 style="color:white;">2016</h2>
<br>
<p style="color:white;font-size:19px;"> .Alan Walker feat. Iselin Solheim – "Faded"
(Hardwell Remix) </p>
<br>
<p style="color:white;font-size:19px;"> .The Chainsmokers feat. Daya – "Don't Let Me
Down" (Hardwell & Sephyx Remix) </p>
<br>
<p style="color:white;font-size:19px;"> .Moby – "Go" (Hardwell Remix) </p>
<!---->
<br>
<h2 style="color:white;">2017</h2>
<br>
<p style="color:white;font-size:19px;"> .Kill The Buzz – "Break The House Down"
(Hardwell Edit) </p>
<br>
<p style="color:white;font-size:19px;"> .TBadd Dimes – "Go Down Low" (Hardwell Edit)
</p>
</div>
</section>
<!-----------------------------VIDEO E TEXTO------------------------------------->
</body>
</html>
这里的CSS代码:
* {
margin: 0;
padding: 10;
font-family: Century Gothic;
box-sizing: border-box;
}
/*---------------------VIDEO-------------------*/
section {
position: relative;
width: 100%;
min-height: 100vh;
display: flex;
justify-content: center;
align-items: center;
overflow: hidden;
padding: 100px;
}
section video {
position: absolute;
top: 8%;
left: 0;
width: 100%;
height: 100%;
object-fit: cover;
pointer-events: none;
}
section p {
top: 80%;
position: relative;
font-size: 1.2em;
}
/*---------------------VIDEO-------------------*/
/*------------------TEXTO-----------------------*/
.content{
color:white;
font-size:16px;
font-family:Century Gothic;
}
/*------------------TEXTO-----------------------*/
我想知道我该如何移动它。
解决方案
推荐阅读
- apache-spark - spark-submit 在 zip 中传递 python 文件不起作用
- php - 我想从 php 对象类添加自定义属性
- mysql - 在 docker / docker-compose 中连接 Python 和 MySQL
- azure - 在 Azure 中,是否可以在不增加 VM 大小的情况下增加 NIC 带宽限制?
- c# - OnPropertyChanged 2 级更新
- javascript - 用户添加选项后在 HTML 选择标记中选择新选项?
- redis - 如何在 C# 中从 Redis 获取数据?
- javascript - 我有视频列表我只想在弹出模式中播放一个视频
- javascript - 无法使用 Phantomjs 代码示例在 instagram.com 上截屏,为什么总是黑屏?
- java - 如何使用 Java 更改我的 PC 的主音量?