Question

首先，抱歉我的英语不好，我尽力了。

我有一个css样式表和一个html档案，我有很多选项适合我在css中创建的框中的文本。

这是一张比我更好解释的图片。

http://gyazo.com/829e68851198bc630827cd4a9236f154

我的问题是当我试图在盒子里放一个标记。视频不会在框中输入并显示出来。

http://gyazo.com/1b3fe57988d61a688d73edda1289912e

我该怎么做？谢谢。

我发布了你所有的css文件和html。

CSS文件：

body {
margin :0; 
padding :0; 
background: transparent url("../images/backgrounds/bg.jpg");
}
img {
border :0;
}
a {
text-decoration :none;
color: #FFFFFF;
}
ul {
list-style:none;
}

video {
float: left;
}

/*HEADER*/

#header {
height :250px;
width :100%;
background-position :bottom; 
}

#header div {
width :960px;
margin :0 auto;
height :203px;
position :relative;
}
#header div img.logo { 
display: block;
margin-right: auto;
margin-left: auto;
margin-top :0px;
opacity: .8;
}
#header div ul.navigation {
margin :0;
margin-left: 15px;
padding :0;
position :absolute; 
left :10px;
top :227px;
width :900px;
}
#header div ul.navigation li { 
display: block;
list-style: none;
float :left;
height: 200px;
}
#header div ul.navigation li a {
text-decoration :none; 
padding : 8px 50px 0px 50px;
margin-right: 5px;
color :#0066A7;
font-size :28px;
background: transparent url("../images/backgrounds/navigation-    background.png") no-repeat;
background-size: 100%;
}
#header div ul.navigation li a:hover { 
color :#27ABCA;
}
#header div ul.navigation li a.active { 
color :#172C4E;
background: transparent url("../images/backgrounds/navigation-background-active.png") no-repeat;
padding : 34px 50px 0px 50px;
background-size: 100%;
}

/*BODY*/

#body {
width :100%;
margin :0 auto;
overflow :hidden; 
}

#body p {
font-size :17px;
color :#653B23;
}

/*Contenedores*/

#body #content {
width :960px;
margin : 0 auto;
height :auto;
padding-top :18px;
background :transparent url("../images/backgrounds/bg-content-top.png");
background-position :center top;
background-repeat :no-repeat;
}

#body #content div {
width :960px;
background :transparent url("../images/backgrounds/bg-content-bottom.png");
background-position :center bottom;
background-repeat :no-repeat;
padding-bottom :22px;
}

#body #content div div {
width :860px;
padding :10px 50px 20px 50px;
background :transparent url("../images/backgrounds/bg-content.png");
background-position :center center;
background-repeat :repeat-y;
}   


/*FOOTER*/

#footer {
height :250px;
width :960px;
padding :20px;
margin-top :20px;
margin-left :100px;
overflow: hidden;
}

#footer div img.postit {
position: absolute;
z-index: -1 ;
width: 422px;
height: 185px;
}

#footer div div img {
float: left;
margin-left: 25px;
padding: 80px 18px 0px 0px;
width: 60px;
height: 60px;
display: block;
}

#footer div div img:hover {
opacity: 0.6;
}

#footer div div p {
float: right;
color: #653B23;
margin-top: 127px;
font-size :25px;
}

HTML文件：

<head>
<title>RC Global Systems</title>
<link rel="shortcut icon" href="favicon.ico" />
<meta charset="utf-8">
<link href="css/style.css" rel="stylesheet" type="text/css">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>
<div id="header">


    <div>
        <a href="index.html"><img class="logo" src="images/logorc.png"   width="422" height="185" alt="logo"></a>
        <ul class="navigation">
            <li>
                <a class="active" href="index.html">Índice</a>
            </li>
            <li>
                <a href="servicios.html">Servicio</a>
            </li>
            <li>
                <a href="trabajos.html">Trabajos</a>
            </li>
            <li>
                <a href="contacto.html">Contacto</a>
            </li>
        </ul>
    </div>
</div>

<!---------------------------------------Body-------------------------------------------------------------------->


<div id="body">

    <div id="content">
        <div>
            <div>
<!----editable>
                <p>This is the text that fits in this box.</br>
                The box enlarge if the text does.
                </p>
<!----end-editable>
            </div>
        </div>
    </div>
</div>

<!---------------------------------------Footer----------------------------------------------------------------->

<div id="footer">
    <div>
     <img class="postit" src="images/backgrounds/postit.png" alt="background">
        <div>
            <a href="http://www.facebook.com/"><img class="facebook" src="images/social/facebook-off.png" alt="facebook"></a>
            <a href="http://www.linkedin.com/"><img class="linkedin" src="images/social/linkedin-off.png" alt="linkedin"></a>
            <a href="http://www.twitter.com/"><img class="twitter" src="images/social/twitter-off.png" alt="twitter"></a>
            <a href="http://www.youtube.com/"><img class="youtube" src="images/social/youtube-off.png" alt="youtube"></a>

            <p>Copyright &copy; 2015 RC-Global Systems</p>

        </div>
    </div>
</div>
</body>
</html>

Answer 1

HTML的评论方式错误。

将您的代码更改为此

<!DOCTYPE html>
<html>
<head>
<title>RC Global Systems</title>
<link rel="shortcut icon" href="favicon.ico" />
<meta charset="utf-8">
<link href="css/style.css" rel="stylesheet" type="text/css">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
    <div id="body">

            <div id="content">
                <div>
                    <div>
        <!-- editable -->
                        <iframe width="560" height="315" src="https://www.youtube.com/embed/sEo8ci9Lfmw" frameborder="0" allowfullscreen></iframe>
        <!-- endeditable -->
                    </div>
                </div>
            </div>
        </div>

        <!---------------------------------------Footer----------------------------------------------------------------->

        <div id="footer">
            <div>
             <img class="postit" src="images/backgrounds/postit.png" alt="background">
                <div>
                    <a href="http://www.facebook.com/"><img class="facebook" src="images/social/facebook-off.png" alt="facebook"></a>
                    <a href="http://www.linkedin.com/"><img class="linkedin" src="images/social/linkedin-off.png" alt="linkedin"></a>
                    <a href="http://www.twitter.com/"><img class="twitter" src="images/social/twitter-off.png" alt="twitter"></a>
                    <a href="http://www.youtube.com/"><img class="youtube" src="images/social/youtube-off.png" alt="youtube"></a>

                    <p>Copyright &copy; 2015 RC-Global Systems</p>

                </div>
            </div>
        </div>
        </body>
        </html>

HTML评论以

结束

您还忘记了顶部的<html>标记。

视频不进入我的CSS背景！：（

1 个答案:

视频不进入我的CSS背景！ ：（

1 个答案:

视频不进入我的CSS背景！：（