是否可以通过css文件设置弹出窗口的样式?

时间:2014-09-08 15:48:44

标签: javascript css popup

我搜索了该网站,但遗憾的是,找不到合适的答案并决定发布问题。

我有一个有几页的小项目。我有一个css文件来设置其内容的样式。 内容应显示在另一方将打开的window.open上的弹出窗口中。我只需要在部署页面之前测试我的内容在弹出窗口中的显示方式。

目前,我使用" javascript:window.open(' mypage.htm',' content')"创建了一个包含链接和测试的测试页面。测试它。我给它一些宽度和高度来适应我的内容尺寸。但是,因为,另一方可以在部署后控制弹出窗口的尺寸,我想确保我的内容完全适合它。这有可能吗?

这是我所拥有的一个页面的html部分:

<script type="text/javascript">
    this.name = 'content';
</script> 
<body>
  <div id="wrapper"> 
    <div class="mainImg"><img alt="" src="images/InfoSearchA.jpg"/>
    </div>
      <article>
        <header>
          <h1 class="txtName">Header</h1>
        </header>
        <p class="txtDesc">Some description</p>
      </article>
      <div class="frame">
         <div class="iframe">
             <script language="javascript" type="text/javascript">
           document.write("<iframe id=\"frame\" src=\"someIframeContent.html</iframe>");
             </script>
          </div>
      </div>
      <div class="privacyterms"><a class="terms" href="privacynotes.htm"     onclick="window.open(this.href, '_blank'); return false;">Privacy</a> <span class="separator"> |</span> <a class="terms" href="terms.htm" onclick="window.open(this.href, '_blank'); return false;">Terms</a></div>
      <div class="footerImg"><img alt="" src="images/footer.jpg" />
      </div>
      <div class="footerText">Footer.<br/>
      </div>
  </div>
</body>

这是我的css文件:

@font-face
{
    font-family: 'Open Sans Light';
    src: url('fonts/OpenSans-Light-webfont.eot');
    src: local('Open Sans Light'), local('OpenSans-Light'),
         url('fonts/OpenSans-Light.eot') format('embedded-opentype');
}

@font-face
{
    font-family: 'Open Sans';
    src: url('fonts/OpenSans-Regular.eot');
    src: local('Open Sans'), local('OpenSans'),
         url('fonts/OpenSans-Regular.eot') format('embedded-opentype');
}

html
{
 overflow: -moz-scrollbars-vertical;
}

body 
{
    overflow-x:hidden;
    line-height:1;
    font-style: normal;
    font-weight:normal;
    margin-left:1px;
    margin-right:1px;
}

h1
{
    line-height: 1.4em;
}

article
{
    color: #000000;    
}

article h1
{
    color: #0140be;
    font-family: 'Open Sans Light';
    font-size: 20px;
    font-weight: normal;
}

.txtName
{
    margin-left: 18px;    
}

.frame iframe
{
 overflow-x: hidden;
 overflow-y: auto;
 text-align:center;   
}

.frame
{
   padding-top: 5px; 
   margin-left: 10px;
}   

article p.txtDesc
{
    line-height:1.6;
    font-family: 'Open Sans', Arial, sans-serif;
    font-size: 14px;
    margin-left: 18px;
    font-weight:normal;      
}

.footer
{
    margin-top:1px;
    width:855px;
}

.mainImg
{
    height:395px;
    width:875px;
    margin-right:10px;
    padding-bottom:20px;  
}

.footerText
{
    color: #666666;
    line-height: 1.3em;
    font-family: 'Open Sans', Sans-Serif;
    font-size: 11px;
    padding-left:15px;
    margin-left:1px;        
}

.footerImg
{
    width:800px;
    padding-left:7px;
    margin-left:1px;    
}

#wrapper
{
    margin-left:auto;
    margin-right:auto;
    width:875px;
}

.privacyterms
{
    line-height: 1.3em;
    font-size: 11px;
    padding-left:12px;
    margin-left:5px;      
}

.terms
{
    text-decoration: none;
    text-transform: uppercase;
    font-family: 'Open Sans';
    font-style: Light;
    color: #0140be;
}

.separator
{
    font-family: 'Open Sans';
    color: #0140be;
    font-weight: 300; 
}

0 个答案:

没有答案