Question

我想知道如何在网页的页眉和页脚之间添加iframe，我的意思是在页眉和页脚之间的空白处。我尝试了高度100％，但它覆盖了标题！我正在使用http://materializecss.com/templates/starter-template/preview.html中的模板。有人可以帮忙吗？感谢

Answer 1

使用CSS [i for x in cluster[lst[0]] for i in x]和cluster = defaultdict( list ) donotcluster = defaultdict( list ) seen = set() # added this for i, lst1 in tqdm(enumerate(T)): for lst2 in tqdm(T): if hashPair( lst1[1], lst2[1] ) not in seen and lst2 not in cluster[lst1[0]] and lst2 not in donotcluster[lst1[0]]: # changed around your condition seen.add( hashPair( lst1[1], lst2[1] ) # added this distance, path = fastdtw(lst1[1], lst2[1], dist=euclidean) if distance <= distance_threshold: cluster[lst1[0]] += [ lst2 ] cluster[lst2[0]] += [ lst1 ] else: donotcluster[lst1[0]] += [ lst2 ] donotcluster[lst2[0]] += [ lst1 ] def hashPair( a, b ): # added this return ','.join(max(a,b), min(a,b))将iFrame放置在标题下方。尝试使用

position

见这里：

http://www.w3schools.com/cssref/pr_pos_top.asp http://www.w3schools.com/css/css_positioning.asp

Answer 2

要在页眉和页脚之间以HTML格式添加iframe，您将放置此代码，但将源更改为您想要指向的内容。

<iframe src="http://www.unlocktheinbox.com"></iframe>

宽度和高度（如果设置为100％）将仅限于您表单上的父元素，这看起来就像您的DIV之一。

因此，在您的示例页面上，删除此代码。

将此代码替换为。

<div class="section no-pad-bot" id="index-banner">
        <div class="container">
          <br><br>
          <h1 class="header center orange-text">Starter Template</h1>
          <div class="row center">
            <h5 class="header col s12 light">A modern responsive front-end framework based on Material Design</h5>
          </div>
          <div class="row center">
            <a href="http://materializecss.com/getting-started.html" id="download-button" class="btn-large waves-effect waves-light orange">Get Started</a>
          </div>
          <br><br>

        </div>
      </div>


      <div class="container">
        <div class="section">

          <!--   Icon Section   -->
          <div class="row">
            <div class="col s12 m4">
              <div class="icon-block">
                <h2 class="center light-blue-text"><i class="material-icons">flash_on</i></h2>
                <h5 class="center">Speeds up development</h5>

                <p class="light">We did most of the heavy lifting for you to provide a default stylings that incorporate our custom components. Additionally, we refined animations and transitions to provide a smoother experience for developers.</p>
              </div>
            </div>

            <div class="col s12 m4">
              <div class="icon-block">
                <h2 class="center light-blue-text"><i class="material-icons">group</i></h2>
                <h5 class="center">User Experience Focused</h5>

                <p class="light">By utilizing elements and principles of Material Design, we were able to create a framework that incorporates components and animations that provide more feedback to users. Additionally, a single underlying responsive system across all platforms allow for a more unified user experience.</p>
              </div>
            </div>

            <div class="col s12 m4">
              <div class="icon-block">
                <h2 class="center light-blue-text"><i class="material-icons">settings</i></h2>
                <h5 class="center">Easy to work with</h5>

                <p class="light">We have provided detailed documentation as well as specific code examples to help new users get started. We are also always open to feedback and can answer any questions a user may have about Materialize.</p>
              </div>
            </div>
          </div>

        </div>
        <br><br>

        <div class="section">

        </div>
      </div>

使用

 <iframe src="http://www.unlocktheinbox.com" width="100%" height="100%"></iframe>

页眉和页脚之间的iframe

2 个答案: