父页面于iframe通信

2018-7-18 liyangweb.com 李杨 HTML

下面是一个iframe和父页面相互通信的demo,其中使用了一个非常方便的方法postMessage,但是有时候,我们的子页面可能会包含其他业务逻辑,这里面如果也用到了postMessage,就难免会产生冲突,这时候,我们可以使用自定义事件来解决。

阅读全文>>

标签: iframe

评论(1) 浏览(310)

iPhone中的webview显示iframe中的页面宽度超出屏幕

2018-4-22 liyangweb.com 李杨 HTML

今日在做一个项目,遇到了iPhone中iframe页面超宽的问题,业务场景大致是这样:

1.项目运行环境是移动端浏览器,APP中的webview,支持Android和iOS

2.页面中有一个iframe,包含了多个不同的外部链接,我们无法对此页面中的内容做任何更改

由于开发都是用PC模拟手机来进行的,本人使用的Android手机,开发完成后简单测试没发现任何问题,但是后期在iPhone中测试的时候,却发现,外部链接竟然有一半以上不能正常显示,经过各种尝试以及找了很多资料,最后终于找到一个完美解决的办法。

代码如下:

<div style="overflow: auto;-webkit-overflow-scrolling:touch;width:100%;height:100%;">
    <iframe src="http://www.baidu.com" frameborder="0" height="100%" scrolling='no' style="width: 1px; min-width: 100%; *width: 100%;"></iframe>
</div>

评论(1) 浏览(600)

为什么 script 标签不能写成自关闭形式

2015-3-24 liyangweb.com 李杨 HTML

今天早上在 Stack Overflow 看到了这个问题:Why don't self-closing script tags work? 。答案给出的解释是,在 XHTML 的标准里面规定非EMPTY 标签不能使用自关闭形式。注意这里使用的是全大写的 EMPTY ,所以我不把它翻译为「空白」。

那么 EMPTY 到底是什么呢?写过 DTD 的人应该知道它是个关键字,用来指明一个标签的内容必须是空白,而不能包含文本内容或子节点。看看具体的例子就很容易明白了:

阅读全文>>

标签: JavaScript HTML

评论(0) 浏览(2002)

十个超级技巧助你解决CSS兼容问题

2014-2-27 liyangweb.com 李杨 HTML

现在大部分都是用!important来 hack,对于ie6和firefox测试可以正常显示,但是ie7对!important可以正确解释, 会导致页面没按要求显示!找到一个针对IE7 不错的hack方式就是使用“*+html”,现在用IE7浏览一下,应该没有问题了现在写一个CSS可以这样。

一、针对firefox ie6 ie7的css样式
现在大部分都是用!important来 hack,对于ie6和firefox测试可以正常显示,但是ie7对!important可以正确解释, 会导致页面没按要求显示!找到一个针对IE7 不错的hack方式就是使用“*+html”,现在用IE7浏览一下,应该没有问题了现在写一个CSS可以这样:

阅读全文>>

标签: CSS初始化 HTML

评论(0) 浏览(2400)

html中几个常用的meta标签

2013-11-15 liyangweb.com 李杨 HTML

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><!--指定字符集-->
<meta name="keywords" content="" /><!--告诉搜索引擎当前网页的关键词-->
<meta name="description" content="" /><!--告诉搜索引擎当前网页的主要内容-->
<meta name="author" content="" /><!--告诉搜索引擎当前站点的作者-->

阅读全文>>

标签: HTML meta

评论(0) 浏览(2203)

HTML5 面试中最常问到的 10 个问题

2013-10-12 liyangweb.com 李杨 HTML

  1. HTML5 新的 DocType 和 Charset 是什么?

  2. 如何在 HTML5 页面中嵌入音频?

  3. 如何在 HTML5 页面中嵌入视频?

  4.除了音频和视频,HTML5 还支持其他什么新的媒体元素?

  5.HTML 5中canvas元素有什么用途?

  6. HTML5 有哪些不同类型的存储?

  7. HTML5 引入什么新的表单属性?

  8. 与 HTML4 比较,HTML5 废弃了哪些元素?

  9. HTML5 标准提供了哪些新的 API?

  10. HTML5 应用缓存和常规的 HTML 浏览器缓存有何差别?

阅读全文>>

标签: HTML5

评论(0) 浏览(3336)

flash挡住页面浮动元素

2013-8-19 liyangweb.com 李杨 HTML

有时候我们的菜单栏下面会放一个flash,但是当菜单栏需要下拉的时候,却发现菜单栏奇迹般的跑到flash下面去了,或者是页面的一个效果跑到flash下面去了。任凭怎么设置z-index都不管用,那么,怎么解决呢?

把引入flash的代码换成这个,一切就大功告成了:

阅读全文>>

标签: flash

评论(0) 浏览(2090)

CSS初始化 Resets

2013-6-5 liyangweb.com 李杨 HTML

经常为同样的CSS在不同的浏览器中显示效果差异头疼,有了这个就简单多了,把下面代码保存为init.css,在每个页面引入。页面布局就简单多了。

阅读全文>>

标签: CSS初始化

评论(0) 浏览(2570)

Powered by emlog 冀ICP备13011830号-1