这是我的汇总代码
HTML:
<div class="wrap">
<div>
<img src="Pictures/titlepic.jpg" width="1035" height="200">
<h1 class="text_over_image">Welcome to my Sandbox</h1>
</div>
</div>
CSS:
.wrap{
width: 1060px;
margin: auto;
}
.text_over_image{
position: absolute;
top: 20px;
}
我已经尝试了left: 50%,text-align:center任何一些没有好运的东西.我不想做一个left: 50px(或任何需要的值),因为看不见的是文本的长度根据Javascript值而变化.因此标题可能很短或很长,我希望它无论如何都要居中.
想法？
在jlmcdonald的一些明智的输入后,我重新写了这篇文章
最终目标是使用YouTube API做一些有趣的事情.今天的目标是让它发挥作用.
我在这里做了youtube dev java-scrip API教程:
https://developers.google.com/youtube/v3/code_samples/javascript#my_uploads
但是,我没有使用单独的文档,而是根据需要调整了一个大文件.
无法让它工作......想法？
以下是Google的API代码(如果需要)http://d.pr/i/Ybcx
<!doctype html>
<html>
<head>
<title>My Uploads</title>
<link rel="stylesheet" href="my_uploads.css" />
<style>
.paging-button {
visibility: hidden;
}
.video-content {
width: 200px;
height: 200px;
background-position: center;
background-repeat: no-repeat;
float: left;
position: relative;
margin: 5px;
}
.video-title {
width: 100%;
text-align: center;
background-color: rgba(0, 0, 0, .5);
color: white;
top: 50%;
left: 50%;
position: absolute;
-moz-transform: translate(-50%, -50%);
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
}
.video-content:nth-child(3n+1) {
clear: both;
}
.button-container …