如何在div中制作响应式文本?

时间:2015-02-25 08:40:48

标签: javascript jquery html css responsive-design

我想让左侧的高度与右侧的高度相同,所以如果它在平板电脑,电脑等中打开会很好。但是当我调整浏览器窗口的大小时,视频在右边部分变小,但左边的文字部分没有变化。



<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
  <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
</head>

<body>
  <div class="container-fluid">
    <div class="row" style="background-color:lavender;">
      <div class="col-sm-9" style="background-color:lavender;">
        <div class="embed-responsive embed-responsive-16by9">
          <iframe class="embed-responsive-item" src="http://youtube.com/embed/BG9rW-hYikw?autoplay=1&loop=1&playlist=BG9rW-hYikw" allowfullscreen></iframe>
        </div>
      </div>
    <div class="col-sm-3" align="middle" style="background-color:lavender;">
      <div id="header">
        <img src="https://lh5.googleusercontent.com/-zeb_mXjp28c/VCoaTmC6JmI/AAAAAAAADuQ/wUXv4gILN_s/w1043-h225-no/30-logo-freecyberscom-baru.png" height="50" /><p><br></p>
      </div> 
      <div>
        <marquee direction="up" behaviour="scroll" scrollamount="3" height="474px">
        <ul>
          <li><strong><p align="justify">I was wondering if it's possible</strong> to create HTML Rolling Credits in a website. If so, how do I need to do? Thanks</p></li><br/>
          <li><strong><p align="justify">I was wondering if it's possible</strong> to create HTML Rolling Credits in a website. If so, how do I need to do? Thanks</p></li><br/>
          <li><strong><p align="justify">I was wondering if it's possible</strong> to create HTML Rolling Credits in a website. If so, how do I need to do? Thanks</p></li><br/>
          <li><strong><p align="justify">I was wondering if it's possible</strong> to create HTML Rolling Credits in a website. If so, how do I need to do? Thanks</p></li><br/>
          <li><strong><p align="justify">I was wondering if it's possible</strong> to create HTML Rolling Credits in a website. If so, how do I need to do? Thanks</p></li><br/>
          <li><strong><p align="justify">I was wondering if it's possible</strong> to create HTML Rolling Credits in a website. If so, how do I need to do? Thanks</p></li><br/>
          <li><strong><p align="justify">I was wondering if it's possible</strong> to create HTML Rolling Credits in a website. If so, how do I need to do? Thanks</p></li><br/>
          <li><strong><p align="justify">I was wondering if it's possible</strong> to create HTML Rolling Credits in a website. If so, how do I need to do? Thanks</p></li><br/>
          <li><strong><p align="justify">I was wondering if it's possible</strong> to create HTML Rolling Credits in a website. If so, how do I need to do? Thanks</p></li><br/>
          <li><strong><p align="justify">I was wondering if it's possible</strong> to create HTML Rolling Credits in a website. If so, how do I need to do? Thanks</p></li><br/>
          <li><strong><p align="justify">I was wondering if it's possible</strong> to create HTML Rolling Credits in a website. If so, how do I need to do? Thanks</p></li><br/>
          <li><strong><p align="justify">I was wondering if it's possible</strong> to create HTML Rolling Credits in a website. If so, how do I need to do? Thanks</p></li><br/>
        </ul>
        </marquee>
      </div>
    </div>
    <div class="row" style="background-color:lightblue;" width="1024px">
      <img class="img-responsive" src="C:\Users\hendra\Downloads\logo2.jpg" height="500px">
    </div>
  </div>
</body>
</html>
&#13;
&#13;
&#13;

1 个答案:

答案 0 :(得分:0)

文本应该在em而不是px中,并且marquee的div父必须在%

为什么你固定身高=&#34; 474px&#34; ??没有必要