将外层css框架单独存放在一个css文件之中,将iframe的css单独写在一个css文件,避免iframe中的html,body等公共部分的样式冲突。

外层框架单独写在一个css,如:

frame.css

引入页面的css单独写在一个文件,如:

content.css

frame.html如下,只引入frame.css

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>这是框架Html</title>
<link rel="stylesheet" href="frame.css" />
</head>
<body>
<iframe src="content.html" width="100%" height="100%"></iframe>
</body>
</html>

content页面里则不需要引入frame.css文件,

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>这是contentHtml</title>
<link rel="stylesheet" href="content.css" />
</head>
<body>
<!--
作者:983521365@qq.com
时间:2017-05-16
描述:内容区
-->
</body>
</html>

  

iframe引入页面的更多相关文章

  1. 获取iframe引入页面内的元素

    在web开发中,经常会用到iframe,难免会碰到需要在父窗口中使用iframe中的元素.或者在iframe框架中使用父窗口的元素.js在父窗口中获取iframe中的元素1.    格式:window ...

  2. jQuery 获取jsp页面中用iframe引入的jsp页面中的值

    <iframe scrolling="no" src="<c:url value='/unitBaseperson/view.do?para=9&op ...

  3. 使用iframe父页面调用子页面和子页面调用父页面的元素与方法

    在实际的项目开发中,iframe框架经常使用,主要用于引入其他的页面.下面主要介绍一下使用iframe引入其他页面后,父页面如何调用子页面的方法和元素以及子页面如何调用父页面的方法和元素. 1.父页面 ...

  4. 解决SpringSecurity限制iframe引用页面的问题

    使用Spring Security的过程中,需要使用iframe来引入其他域的页面,页面会报X-Frame-Options的错误,试了好几种方法一直未能很好的解决这个问题. 这里涉及到Spring S ...

  5. 使用iframe引入公共模块

    新建一个公共文件head.html <!DOCTYPE html><html lang="en"><head> <meta charset ...

  6. Saiku使用iframe嵌入页面访问地址配置化(二十八)--DWR的基本使用

    Saiku使用iframe嵌入页面使用时ip与端口配置化(二十八)--DWR的基本使用 DWR(Direct Web Remoting)是一个用于改善web页面与Java类交互的远程服务器端Ajax开 ...

  7. 在vue项目中通过iframe引入jquery项目

    最近公司因为原来的jq框架存在的问题太多,所以要进行主题框架的重新搭建,我使用的vue进行的主题框架的重新搭建,但是原来的页面已经完成很多了,而且都是使用的jquery进行开发的 在vue中引入jqu ...

  8. 前端错误监控上报公共方法,可在父页面及iframe子页面同时使用

    先创建公共文件error-reported.js 内容如下: /** * 获取前端错误信息进行上报 * @param iframe */ function catchError (iframe) { ...

  9. 父子页面之间元素相互操作(iframe子页面)

    js/jquery获取iframe子页面中元素的方法: 一.使用window.frames["iframe的ID"]获取元素 window.onload = function() ...

随机推荐

  1. BZOJ 3238 [Ahoi2013]差异 ——后缀自动机

    后缀自动机的parent树就是反串的后缀树. 所以只需要反向构建出后缀树,就可以乱搞了. #include <cstdio> #include <cstring> #inclu ...

  2. BZOJ3473 字符串 【广义后缀自动机】

    题目 给定n个字符串,询问每个字符串有多少子串(不包括空串)是所有n个字符串中至少k个字符串的子串? 输入格式 第一行两个整数n,k. 接下来n行每行一个字符串. 输出格式 一行n个整数,第i个整数表 ...

  3. 算法复习——半平面交(bzoj2618凸多边形)

    讲解: 这里套用wuvin神犇的ppt,附上友情链接:http://blog.leanote.com/wuvin 半平面交: 算法流程: 注意事项: 例题: Description 逆时针给出n个凸多 ...

  4. 刷题总结——road(ssoi)

    题目: 题目背景 SOURCE:NOIP2016-RZZ-1 题目描述 有 N 个城市,这些城市通过 M 条无向边互相连通,每条边有一个权值 Ci ,表示这条边的长度为 2^(Ci) ,没有两条边的长 ...

  5. CodeForces 438D 线段树 剪枝

    D. The Child and Sequence time limit per test 4 seconds memory limit per test 256 megabytes input st ...

  6. laravel控制器

    //访问MemberController下的info的方法 //方法一//访问路径http://localhost/Laravel/public/member/infoRoute::get('memb ...

  7. iOS开发中16进制颜色(html颜色值)字符串转为UIColor

    //16进制颜色(html颜色值)字符串转为UIColor +(UIColor *) hexStringToColor: (NSString *) stringToConvert { NSString ...

  8. Codeforces 515E Drazil and Park (ST表)

    题目链接 Drazil and Park 中文题面 传送门 如果他选择了x和y,那么他消耗的能量为dx + dx + 1 + ... + dy - 1 + 2 * (hx + hy). 把这个式子写成 ...

  9. HDU 4917 Permutation(拓扑排序 + 状压DP + 组合数)

    题目链接 Permutation 题目大意:给出n,和m个关系,每个关系为ai必须排在bi的前面,求符合要求的n的全排列的个数. 数据规模为n <= 40,m <= 20. 直接状压DP空 ...

  10. eclispe集成web插件

    最近公司需要使用开源框架开发,所有下载了最新版本的eclispe工具,但是在官网下载的eclispe是不包含web插件的,无法创建web项目,需要自行集成web插件 eclipse官网下载地址:htt ...