文档建议反馈控制台
首页
学习
活动
专区
工具
TVP
最新优惠活动
文章/答案/技术大牛
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

谈谈html中一些比较偏门的知识(map&area；iframe；label)

说明：这里所说的"偏门"只是相对于本人而言，记录在此，加深印象。也希望有需要的朋友能获得些许收获！ 1.空元素(void)：没有内容的元素。...常见的有：,（显示一条水平线）,,,（描述文档内元数据，如描述，编码，作者，关键字）； 不常见的有：,,,<command...关于hr： ps：上述这行代码：改变水平线颜色；但如果要在css中设置，color:red不会生效（因为color设置的是字体颜色），可以考虑采用border....icon,.png等 2.块元素&行元素：css标准规定：每个元素都有默认的display值。...：各顶点坐标；如果第一对坐标与最后一对坐标不一致，浏览器会添加一对坐标进行闭合图形 6.如何在页面上实现一个圆形的点击区域： map+area或者svg border-radius 纯js实现：首先判断一个点在不在圆上面

3.1K60
您找到你想要的搜索结果了吗？
是的
没有找到

前端面试那些坑之HTML篇

空(void)元素有那些？...首先：CSS规范规定，每个元素都有display属性，确定该元素的类型，每个元素都有默认的display值，如div的display默认值为“block”，则为“块级”元素；span默认display属性值为...（1）行内元素有：ab span img input select strong（强调的语气） （2）块级元素有：divul ol li dl dt dd h1 h2 h3 h4…p （3）常见的空元素...使用iframe之前需要考虑这两个缺点。如果需要使用iframe，最好是通过javascript 动态给iframe添加src属性值，这样可以绕开以上两个问题。 13、Label的作用是什么？...通过visibilityState 的值检测页面当前是否可见，以及打开网页的时间等; 在页面被切换到其他后台进程的时候，自动暂停音乐或视频的播放； 17、如何在页面上实现一个圆形的可点击区域？

1.4K90

ps切图必知必会

,拖动鼠标,可以实现图片的移动) 自由变换(ctrl+T):想要抹掉图片的文字或者图片等 缩放(ctrl+放大,ctrl-缩小,Alt+滚轮实现放大和缩小的操作) 简单 操作过程如gif下所示,整个过程...原文件或者图片的文字 方法一:使用矩形框工具,在空白区选一个区域,复制,然后粘贴,拖动该复制的区块盖住文字或者图片即可即可 方法二:使用自由变换(推荐使用):在空白区选一个空白矩形框—>ctrl+T–>...如何在网页中抠图 印屏幕,键盘上的prtSc SysRq键(把你屏幕上你看到的给截取出来) 浏览器(chrome)插件,控制台工具,审查元素,探测到图片,打开图片url,打开图片保存即可 网页上的图片都可以拿到...IE浏览器按住Alt键+鼠标点击一下图片 控制台调试工具的Source下的image,可以进行抠图 合成雪壁图(css sprite) 意义:把页面上的很多小图合并成一张图,利用背景定位的技术实现,减少.../png)特点 JPG/GIF/PNG的应用 如何抹掉psd原文件或者图片的文字 添加前景色和删除背景色 如何在网页中抠图 合成雪壁图(css sprite) 使用雪碧图结合定位嵌入到网页中去

2.9K20

前端进程间通讯的渗透之术

前端渗透的应用场景有很多，比如在《魔改npm私有仓库 》一文中就介绍了如何在框架中植入私有代码，让逻辑线程和主线程激情博弈。...iframe的内容，这两种方法的优点是：子页面的开发商只需要一点点的配合就能实现，主动权掌握在父页面手中。...比如想去掉iframe中的导航栏（nav元素），可以通过下面的代码实现： iframe.contentDocument.querySelector('nav').remove(); 如果只是想隐藏掉...iframe暴露JS和CSS接口 如果不幸父页面和iframe不同域，那只能通过跨域的方式传序列化数据：父页面向子页面postMessage传值，子页面监听message事件。...比如希望传递一份CSS字符串，覆盖iframe中的样式： iframe.contentWindow.postMessage({ type: "css", content: `

1.7K31

前端安全编码规范

跨站脚本攻击（Cross Sites Script） 跨站脚本攻击，Cross Site Script（简称 CSS或）。...（常见的Web漏洞如XSS、SQLInjection等，都要求攻击者构造一些特殊字符） * 输入检查的逻辑，必须在服务端实现，因为客户端的检查也是很容易被攻击者绕过，现有的普遍做法是两端都做同样的检查，...**`用户身份`**操作用户账户的一种攻击方式 如电影速度与激情5中吉赛尔使用内裤获取巴西大佬指纹，最后成功使用伪造指纹的手法打开保险柜，CSRF只不过是网络上这个手法的实现。...比如，程序员小王在访问A网页时，点击空白区域，浏览器却意外打开了xx新葡京赌场的页面，于是他在A网页打开控制台，在空白区域发现了一个透明的iframe，该iframe嵌入了一个第三方网页的URL 3.1...实际上是在代码上实现一次同源策略的验证过程。接受窗口对接口的信息进行安全检查。

1.3K11

easyui+ssm+shiro做的登录注册修改密码审核用户(四)

破解激活，IntelliJ IDEA 注册码，2020.2 IDEA 激活码 easyui+ssm+shiro做的登录注册修改密码审核用户(四) 修改密码页面的具体实现步骤 修改密码：根据输入原账号和原密码来判断是否存在改用户...id="iframe" name="iframe" style="display:none;"> 第二步：根据保存密码按钮的 οnclick="doUpdatePwd(...id获取用户账号         var password = 判断这三个是否为空，为空直接return，不为空就使用ajax传参，在注册的时候再做判断，如果原账号错误会弹出提示原账号错误，请重新输入...实现方法 改方法的业务逻辑如下： 先调用userDao里面的根据用户名查询用户的方法，如果用户为空直接返回字符串500，else if用户不为空，就把修改好的密码用shiro加密方法加密，再判断如果 !...在form表单上加个 target="iframe" 的属性，在form表单外面加个</

2K10

前端技术探索 - 你不知道的JS 沙箱隔离

、使全局 CSS 样式生效等常见的需求在多个子应用切换时便会成为一种污染性的副作用，为了解决这些副作用，后来出现的很多微前端架构（如 乾坤）有着各种各样的实现。...譬如 CSS 隔离中常见的命名空间前缀、Shadow DOM、 乾坤 sandbox css 的运行时动态增删等，都有着确实行之有效的具体实践，而这里最麻烦棘手的，还是微应用间的 JavaScript...在模拟的 Context 中，new 一个 iframe 对象，提供一个和宿主应用空的（about:blank) 同域 URL 来作为这个 iframe 初始加载的 URL（空的 URL 不会发生资源加载...但其最大的亮点还是借助 iframe 做了一些取巧的实现，当这个为每个子应用创建的 iframe 被移除时，写在其下 window 上的变量和 setTimeout、全局事件监听等也会一并被移除；另外基于...（基于存储数据结构是否以及如何在渲染阶段有优化还需进一步研究源码）。

1.7K30

WEB开发面面谈之（5）——写JS时必须注意的的一些问题

写法2: iframe.style.boder = 'none'; 问题: 完全依赖CSS控制，但存在兼容性问题，IE继续头疼 最终解决方案: iframe.boder = 0; iframe.style.boder...可采用CSS样式来解决cursor:pointer 。...如defer/async属性 使用script.onerror来监听脚本执行失败的情况（语法错误，初始化运行时错误等都会触发） 监听script的完成事件比较复杂。...obj.hasOwnProperty(key) continue; //... } 不论是数组或对象，在遍历操作时不要改变被遍历的变量结构，如增删元素，增删key值等（虽然你可以这么做）,对于元素自身及子成员的修改是绝对安全的...非标准实现，存在兼容性问题，请不要使用 原则上不要轻易重写已存在的prototype方法。

1.7K60

你不知道的JS 沙箱隔离

、使全局 CSS 样式生效等常见的需求在多个子应用切换时便会成为一种污染性的副作用，为了解决这些副作用，后来出现的很多微前端架构（如 乾坤）有着各种各样的实现。...譬如 CSS 隔离中常见的命名空间前缀、Shadow DOM、 乾坤 sandbox css 的运行时动态增删等，都有着确实行之有效的具体实践，而这里最麻烦棘手的，还是微应用间的 JavaScript...在模拟的 Context 中，new 一个 iframe 对象，提供一个和宿主应用空的（about:blank) 同域 URL 来作为这个 iframe 初始加载的 URL（空的 URL 不会发生资源加载...但其最大的亮点还是借助 iframe 做了一些取巧的实现，当这个为每个子应用创建的 iframe 被移除时，写在其下 window 上的变量和 setTimeout、全局事件监听等也会一并被移除；另外基于...（基于存储数据结构是否以及如何在渲染阶段有优化还需进一步研究源码）。

1.9K40

求职 | 史上最全的web前端面试题汇总及答案2

空(void)元素有那些？ 行内元素和块级元素的区别是什么？行内块元素的兼容性使用？...①iframe会阻塞主页面的Onload事件，搜索引擎的检索程序无法解读这种页面，不利于SEO； ②iframe和主页面共享连接池，而浏览器对相同域的连接有限制，所以会影响页面的并行加载。...使用iframe之前需要考虑这两个缺点。如果需要使用iframe，最好是通过javascript动态给iframe添加src属性值，这样可以绕开以上两个问题。...注意quirks：Safari 在无痕模式下设置localstorge值时会抛出 QuotaExceededError 的异常。 21、如何在页面上实现一个圆形的可点击区域？...因为它涉及浏览器兼容、跨域等问题，在项目中一般会使用一些基础类库辅助实现，如jQuery等。 一个简单的Ajax操作如下。 5、谈谈你对JSON的理解。

6K20

web调用打印机自动打印_网页打印如何设置默认打印机

大家好，又见面了，我是你们的朋友全栈君。 浏览器网页打印 1. 前言 客户对于一些插件比较敏感，如金融、银行等出于安全的考虑和产品的把控，可能不愿意页面打印的时候，客户端浏览器安装插件。...打印功能介绍 2.1 普通打印 如果要将当前网页的内容直接打印到白纸上，很简单，使用如下js代码即可实现。...使用css控制某一部分不打印 当然，使用css来控制某一区域不打印，也是很方便的。...2.4 iframe打印 如果你的打印格式比较复杂，在现有页面通过上边介绍的方式实现起来比较麻烦，那就干脆使用iframe打印吧。...如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 举报，一经查实，本站将立刻删除。

6.1K20

前端面试题1（HTML篇）

HTML ---- 语义化 HTML标签的语义化是指：通过使用包含语义的标签（如h1-h6）恰当地表示文档结构 css命名的语义化是指：为html标签添加有意义的class 为什么需要语义化： 去掉样式后页面呈现清晰的结构...，操作window.applicationCache进行需求实现 CACHE MANIFEST #v0.11 CACHE: js/app.js css/style.css...缺点： iframe会阻塞主页面的Onload事件 搜索引擎的检索程序无法解读这种页面，不利于SEO iframe和主页面共享连接池，而浏览器对相同域的连接有限制，所以会影响页面的并行加载 使用iframe...如果需要使用iframe，最好是通过javascript动态给iframe添加src属性值，这样可以绕开以上两个问题 优点： 用来加载速度较慢的内容（如广告） 可以使脚本可以并行下载 可以实现跨子域通信...通过 visibilityState 的值检测页面当前是否可见，以及打开网页的时间等; 在页面被切换到其他后台进程的时候，自动暂停音乐或视频的播放 如何在页面上实现一个圆形的可点击区域？

1.8K10

前端性能优化

从以下几个角度考虑移除不必要的标记： 是否还在使用表格布局？ 塞进去更多的仅为了处理布局问题？也许有更好、更语义化的标记。 能通过伪元素实现的功能，就没必要添加额外元素，如清除浮动。...尽量减少iframe的使用 用iframe可以把一个HTML文档插入到父文档里，重要的是明白iframe是如何工作的并高效地使用它。...的优点： 可以用来加载速度较慢的第三方资源，如广告、徽章； 可用作安全沙箱； 可以并行下载脚本。...的缺点： 加载代价昂贵，即使是空的页面； 阻塞页面 load 事件触发； Iframe 完全加载以后，父页面才会触发 load 事件。...得益于Node.js的流行，开源社区涌现出许多高效、易用的前端优化工具，JavaScript 和CSS压缩类的，不敢说多如牛毛，多入鸡毛倒是一点不夸张，如[UglifyJS 2] (github.com

2K41

Vue隐藏技能：运行时渲染用户写入的组件代码！

本地编译与运行时编译 用户想通过编写template + js + css的方式实现运行时渲染页面，那肯定是不能本地编译的（此处的编译指将 vue 文件编译为 js 资源文件），即不能把用户写的代码像编译源码一样打包成静态资源文件...对于没有设置 src 的 iframe，页面只能加载一个空的 iframe，因此还需要在 iframe 加载完后再动态加载依赖的资源，如：vuejs，其他运行时的依赖库（示例 demo 加载了 ant-design-vue...body 的第一个子元素的方式，这么做的原因是一些第三方的库（如 ant-design-vue）也会向 body 中动态添加 element，虽然采用docment.body.innerHTML=''...为了使 css 变化后也引发重绘，在计算属性component中也绑定了 css 的值，但这对于新建 vm 实例这个字段是无用的，也可以通过 watch css 的方式实现 接下来考虑错误处理，对于 iframe...对于这个限制的解决方案是：对不支持的数据类型进行序列化，转成支持的类型，如 string，渲染时再反序列化回来。

3.6K10
点击加载更多

扫码

添加站长 进交流群

领取专属 10元无门槛券

手把手带您无忧上云

扫码加入开发者社群

相关资讯

热门标签

更多标签

活动推荐

    运营活动

    活动名称
    广告关闭

    腾讯云开发者

    扫码关注腾讯云开发者

    扫码关注腾讯云开发者

    领取腾讯云代金券

    热门产品

    热门推荐

    更多推荐

    Copyright © 2013 - 2024 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有

    深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 深公网安备号 44030502008569

    腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号 | 京公网安备号11010802020287

    领券