首页
素材
图标
PNG
PSD素材
HTML5
CSS+DIV
JS代码
PPT模板
设计模板
符号
网名符号
表情符号
标点符号
语言符号
符号图案
特殊符号
货币符号
数学符号
emoji大全
模板
迅睿cms模板
修罗bbs模板
WordPress主题
PbootCms模板
帝国cms模板
易优Cms模板
DeStoon模板
Dedecms模板
404页面模板
精品
作品
插件
迅睿cms插件
帝国cms插件
eyoucms插件
dedecm插件
xiunoBBS插件
教程
PS教程
3D教程
html+css教程
java/安卓教程
wordpress教程
帝国cms教程
织梦cms教程
易优cms教程
Z-blog教程
修罗bbs教程
discuz教程
typecho教程
PPT教程
vps教程
技术分享
提升
个人提升
创业项目
淘宝美工
电商知识
单页简历
毕业论文
教学论文
实用文
开场白
领条
收据
实习
DJ大全
登录
当前位置：
美工之家
>
教程
>
html+css教程
>
是什么？html中iframe标签的用法详解 </div> <div class="row"> <div class="content-column col-lg-9"> <div class="content-area"> <main class="site-main"> <article id="post-53411" class="article-content"> <div class="container"> <div class="cao_entry_header"> <header class="entry-header"> <div class="entry-meta"> <span class="meta-author"> <a> <img alt='runsly' data-src='https://www.9502669.com/wp-content/uploads/avatar/avatar-1.jpg' class='lazyload avatar avatar-40 photo gravatar' height='40' width='40' />runsly </a> </span> <span class="meta-category"> <a href="http://www.9502669.com/jiaocheng/css" rel="category"> <i class="dot"></i>html+css教程 </a> </span> <span class="meta-date"> <a href="http://www.9502669.com/53411.html"> <time datetime="2021-12-10T15:39:21+08:00"> 2021-12-10 </time> </a> </span> </div> <h1 class="entry-title"><iframe>是什么？html中iframe标签的用法详解</h1> </header></div></div> <div class="container"> <div class="entry-wrapper"> <div class="entry-content u-text-format u-clearfix"> <p>经常进行页面布局的人对于HTML中的iframe标签一定不陌生，iframe标签是一个内联框架，说白了就是用来在当前 HTML 页面中嵌入另一个文档的。刚刚接触前端的小伙伴可能不知道html中iframe标签的用法，这篇文章就结合实例给大家讲解html中iframe标签的使用用法，有一定的参考价值，感兴趣的朋友可以看看。</p> <p><iframe> 标签是一个内联框架，即用来在当前 HTML 页面中嵌入另一个文档的，且所有主流浏览器都支持iframe标签。</p> <p>基本语法：<iframe src=”文件路径”></iframe></p> <p><iframe> 标签常用属性介绍:</p> <p>height可以设置框架显示的高度<br />width可以设置框架显示的宽度<br />name可以定义框架的名称<br />frameborder用来定义是否需要显示边框，取值为1表示需要边框<br />scrolling用来设置框架是否需要滚动条，取值可以是yes,no,auto<br />src用于设置框架的地址，可以使页面地址，也可以是图片地址<br />align用于设置元素对齐方式，取值可以是left，right，top，middle，bottom</p> <p>以上属性可以根据需要进行设置。</p> <p><strong>实例讲解：html中<iframe>标签的使用方法</strong></p> <p>首先新建两个HTML页面，一个命名为iframe-content.html，另一个命名为iframe.html，在iframe-content.html中添加内容，代码如下：</p> <pre><!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> </head> <body> <p>蒹葭苍苍，白露为霜。所谓伊人，在水一方。</p> <p>溯洄从之，道阻且长。溯游从之，宛在水中央。</p> <p>蒹葭萋萋，白露未晞。所谓伊人，在水之湄。</p> <p>溯洄从之，道阻且跻。溯游从之，宛在水中坻。</p> </body> </html></pre> <p>然后用<iframe>标签将iframe-content.html文件嵌入到iframe.html中，可以根据自己的需要设置样式，此例将frameborder设为0，不需要边框， 将scrolling设为no，不需要滚动条，具体代码如下：</p> <pre><!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> </head> <body> <iframe src="iframe-content.html" width="400px" height="150px" frameborder="0" scrolling="no"></iframe> </body> </html></pre> <p>有边框和滚动条的效果图：</p> <p><img loading="lazy" class="lazyload alignnone size-full wp-image-53409" src="data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" data-srcset="http://www.9502669.com/wp-content/uploads/2021/12/1639121962-bee520b0b2cebfa.jpg?x-oss-process=style/p63q90" width="431" height="175" srcset="http://www.9502669.com/wp-content/uploads/2021/12/1639121962-bee520b0b2cebfa.jpg?x-oss-process=style/p63q90 431w, http://www.9502669.com/wp-content/uploads/2021/12/1639121962-bee520b0b2cebfa-300x122.jpg 300w" sizes="(max-width: 431px) 100vw, 431px" /><noscript><img loading="lazy" class="alignnone size-full wp-image-53409" src="http://www.9502669.com/wp-content/uploads/2021/12/1639121962-bee520b0b2cebfa.jpg?x-oss-process=style/p63q90" width="431" height="175" srcset="http://www.9502669.com/wp-content/uploads/2021/12/1639121962-bee520b0b2cebfa.jpg?x-oss-process=style/p63q90 431w, http://www.9502669.com/wp-content/uploads/2021/12/1639121962-bee520b0b2cebfa-300x122.jpg 300w" sizes="(max-width: 431px) 100vw, 431px" /></noscript></p> <p>没有边框和滚动条的效果图：</p> <p><img loading="lazy" class="lazyload alignnone size-full wp-image-53410" src="data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" data-srcset="http://www.9502669.com/wp-content/uploads/2021/12/1639121963-231086b891a7d7f.jpg?x-oss-process=style/p63q90" width="391" height="172" srcset="http://www.9502669.com/wp-content/uploads/2021/12/1639121963-231086b891a7d7f.jpg?x-oss-process=style/p63q90 391w, http://www.9502669.com/wp-content/uploads/2021/12/1639121963-231086b891a7d7f-300x132.jpg 300w" sizes="(max-width: 391px) 100vw, 391px" /><noscript><img loading="lazy" class="alignnone size-full wp-image-53410" src="http://www.9502669.com/wp-content/uploads/2021/12/1639121963-231086b891a7d7f.jpg?x-oss-process=style/p63q90" width="391" height="172" srcset="http://www.9502669.com/wp-content/uploads/2021/12/1639121963-231086b891a7d7f.jpg?x-oss-process=style/p63q90 391w, http://www.9502669.com/wp-content/uploads/2021/12/1639121963-231086b891a7d7f-300x132.jpg 300w" sizes="(max-width: 391px) 100vw, 391px" /></noscript></p> <p>当页面中有大部分内容相同时，比如页面的头部和底部，我们就可以使用<iframe>标签将重复的部分嵌入页面中，这样可以减少代码的重复率，减轻代码量，但不足之处是页面url地址没有改变。</p> <p>以上结合实例给大家介绍了html中<iframe>标签的使用方法，小白一定要自己动手尝试，看看你的代码能不能实现这样的效果，希望这篇文章对你有所帮助！</p> <p>【相关教程推荐】</p> <p>1. HTML教程<br />2. Html5视频教程<br />3. bootstrap教程 </p> <p>以上就是<iframe>是什么？html中iframe标签的用法详解的详细内容，更多请关注其它相关文章！</p> </div> <div id="pay-single-box"></div> <div class="entry-tags"> <a href="http://www.9502669.com/tag/%e7%9b%b8%e5%85%b3%e6%a0%87%e7%ad%be%ef%bc%9ahtml-iframe" rel="tag"> 相关标签：html iframe </a> </div> <div class="ripro_gg_wrap pc"><fieldset><legend>2021服务器优惠</legend><p><strong><span style="color: #ff6600;">阿里云：</span></strong><a href="https://www.aliyun.com/daily-act/ecs/activity_selection?userCode=yl9oi3of" target="_blank" title="阿里云服务器优惠">2核2G5M服务器60元/年、2核4G 200元/年、4核8G服务器365元/年 更多...</a><br> <span style="color: #006eff;">腾讯云：</span><a href="https://cloud.tencent.com/act/cps/redirect?redirect=1077&cps_key=a9dd15029bda048463f3605da38c5b6f&from=console" target="_blank" title="腾讯云服务器优惠">云产品限时秒杀，爆款1核2G云服务器，首年74元 更多...</a></p> <div class="clear"></div></fieldset> </div><div class="article-footer"> <div class="author-box"> <div class="author-image"> <img alt='runsly' data-src='https://www.9502669.com/wp-content/uploads/avatar/avatar-1.jpg' class='lazyload avatar avatar-140 photo gravatar' height='140' width='140' /> </div> <div class="author-info"> <h4 class="author-name"> <a href="javascript:;">runsly</a> <span class="label label-warning"><i class="fa fa-diamond"></i> 钻石</span> </h4> </div> </div> </div> </div> </div> </article> <div class="entry-navigation"> <nav class="article-nav"> <span class="article-nav-prev">上一篇<br><a href="http://www.9502669.com/53407.html" rel="prev">line-height什么意思？line-height带单位与不带单位的区别</a></span> <span class="article-nav-next">下一篇<br><a href="http://www.9502669.com/53416.html" rel="next">哪些标签可以制作html按钮（图文详解）</a></span> </nav> </div> <!-- # 标准网格模式... --> <div class="related-posts-grid"> <h4 class="u-border-title">相关推荐</h4> <div class="row"> <div class="col-6 col-sm-3 col-md-3 mt-10 mb-10"> <article class="post"> <div class="entry-media"> <div class="placeholder" style="padding-bottom: 66.666666666667%;"> <a href="http://www.9502669.com/53599.html"> <img class="lazyload" data-src="https://src.9502669.com/wp-content/uploads/2020/05/1590650547-b351bb9b0af6e4f.png" src="data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" alt="如何在HTML中引入外部页面（iframe标签法）"> </a> </div> <div class="entry-star"><a href="javascript:;" title="收藏文章" etap="star" data-postid="53599" class="ripro-star"><i class="fa fa-star-o"></i></a></div> </div> <div class="entry-wrapper"> <header class="entry-header"> <h4 class="entry-title"><a href="http://www.9502669.com/53599.html" title="如何在HTML中引入外部页面（iframe标签法）" rel="bookmark">如何在HTML中引入外部页面（iframe标签法）</a></h4> </header> </div> </article> </div> </div> </div> </main> </div> </div> <div class="sidebar-column col-lg-3"> <aside class="widget-area"> <div id="search-2" class="widget widget_search"><form method="get" class="search-form inline" action="http://www.9502669.com/"> <input type="search" class="search-field inline-field" placeholder="输入关键词，回车..." autocomplete="off" value="" name="s" required="required"> <button type="submit" class="search-submit"><i class="mdi mdi-magnify"></i></button> </form></div><div id="cao_widget_post-2" class="widget cao-widget-posts"><h5 class="widget-title">最新动态</h5><div class="posts"><div class="left"> <div class="entry-media"> <div class="placeholder" style="padding-bottom: 66.666666666667%;"> <a href="http://www.9502669.com/126088.html"> <img class="lazyload" data-src="http://www.9502669.com/wp-content/uploads/2024/05/425a22841ff1410a964a54c68dc82790.jpg" src="data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" alt="Roaming是什么文件夹可以删除吗（电脑里面的roaming可以删除吗）"> </a> </div> <div class="entry-star"><a href="javascript:;" title="收藏文章" etap="star" data-postid="126088" class="ripro-star"><i class="fa fa-star-o"></i></a></div> </div> <a href="http://www.9502669.com/126088.html" rel="bookmark" title="Roaming是什么文件夹可以删除吗（电脑里面的roaming可以删除吗）">Roaming是什么文件夹可以删除吗（电脑里面的roaming可以删除吗）</a></div><div class="left"> <div class="entry-media"> <div class="placeholder" style="padding-bottom: 66.666666666667%;"> <a href="http://www.9502669.com/126085.html"> <img class="lazyload" data-src="http://www.9502669.com/wp-content/uploads/2024/05/d4b16286dbcde4d23cfe397dc95732a7.jpg" src="data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" alt="4g网怎么生成5g网"> </a> </div> <div class="entry-star"><a href="javascript:;" title="收藏文章" etap="star" data-postid="126085" class="ripro-star"><i class="fa fa-star-o"></i></a></div> </div> <a href="http://www.9502669.com/126085.html" rel="bookmark" title="4g网怎么生成5g网">4g网怎么生成5g网</a></div><div class="left"> <div class="entry-media"> <div class="placeholder" style="padding-bottom: 66.666666666667%;"> <a href="http://www.9502669.com/126082.html"> <img class="lazyload" data-src="http://www.9502669.com/wp-content/uploads/2024/05/ac40e1606ff3b6675393654426e7d0dd.jpg" src="data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" alt="win10我的电脑图标怎么调出来（win11我的电脑图标怎么调出来）"> </a> </div> <div class="entry-star"><a href="javascript:;" title="收藏文章" etap="star" data-postid="126082" class="ripro-star"><i class="fa fa-star-o"></i></a></div> </div> <a href="http://www.9502669.com/126082.html" rel="bookmark" title="win10我的电脑图标怎么调出来（win11我的电脑图标怎么调出来）">win10我的电脑图标怎么调出来（win11我的电脑图标怎么调出来）</a></div><div class="left"> <div class="entry-media"> <div class="placeholder" style="padding-bottom: 66.666666666667%;"> <a href="http://www.9502669.com/126078.html"> <img class="lazyload" data-src="http://www.9502669.com/wp-content/uploads/2023/12/3dd57195710dd1cf6358891150dbc9ef.jpg" src="data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" alt="从零开始学习HTML编程的简单网页代码"> </a> </div> <div class="entry-star"><a href="javascript:;" title="收藏文章" etap="star" data-postid="126078" class="ripro-star"><i class="fa fa-star-o"></i></a></div> </div> <a href="http://www.9502669.com/126078.html" rel="bookmark" title="从零开始学习HTML编程的简单网页代码">从零开始学习HTML编程的简单网页代码</a></div><div class="left"> <div class="entry-media"> <div class="placeholder" style="padding-bottom: 66.666666666667%;"> <a href="http://www.9502669.com/126076.html"> <img class="lazyload" data-src="http://www.9502669.com/wp-content/uploads/2023/12/3dd57195710dd1cf6358891150dbc9ef.jpg" src="data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" alt="CSS3D立体动画效果的实现方法和技巧"> </a> </div> <div class="entry-star"><a href="javascript:;" title="收藏文章" etap="star" data-postid="126076" class="ripro-star"><i class="fa fa-star-o"></i></a></div> </div> <a href="http://www.9502669.com/126076.html" rel="bookmark" title="CSS3D立体动画效果的实现方法和技巧">CSS3D立体动画效果的实现方法和技巧</a></div><div class="left"> <div class="entry-media"> <div class="placeholder" style="padding-bottom: 66.666666666667%;"> <a href="http://www.9502669.com/126073.html"> <img class="lazyload" data-src="http://www.9502669.com/wp-content/uploads/2023/12/3dd57195710dd1cf6358891150dbc9ef.jpg" src="data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" alt="HTML中如何编写点击显示文字的代码片段"> </a> </div> <div class="entry-star"><a href="javascript:;" title="收藏文章" etap="star" data-postid="126073" class="ripro-star"><i class="fa fa-star-o"></i></a></div> </div> <a href="http://www.9502669.com/126073.html" rel="bookmark" title="HTML中如何编写点击显示文字的代码片段">HTML中如何编写点击显示文字的代码片段</a></div></div></div><div id="tag_cloud-2" class="widget widget_tag_cloud"><h5 class="widget-title">标签</h5><div class="tagcloud"><a href="http://www.9502669.com/tag/cms%e7%b3%bb%e7%bb%9f" class="tag-cloud-link tag-link-4616 tag-link-position-1" style="font-size: 11.305555555556pt;" aria-label="cms系统 (128个项目)">cms系统</a> <a href="http://www.9502669.com/tag/css" class="tag-cloud-link tag-link-3860 tag-link-position-2" style="font-size: 13.541666666667pt;" aria-label="css (368个项目)">css</a> <a href="http://www.9502669.com/tag/css3" class="tag-cloud-link tag-link-3864 tag-link-position-3" style="font-size: 8.7291666666667pt;" aria-label="css3 (37个项目)">css3</a> <a href="http://www.9502669.com/tag/css%e7%9f%a5%e8%af%86" class="tag-cloud-link tag-link-955 tag-link-position-4" style="font-size: 8.7291666666667pt;" aria-label="css知识 (37个项目)">css知识</a> <a href="http://www.9502669.com/tag/html" class="tag-cloud-link tag-link-1390 tag-link-position-5" style="font-size: 12.8125pt;" aria-label="HTML (263个项目)">HTML</a> <a href="http://www.9502669.com/tag/html5" class="tag-cloud-link tag-link-1072 tag-link-position-6" style="font-size: 9.0208333333333pt;" aria-label="HTML5 (43个项目)">HTML5</a> <a href="http://www.9502669.com/tag/it%e6%95%99%e7%a8%8b%e5%a4%a7%e5%85%a8" class="tag-cloud-link tag-link-4445 tag-link-position-7" style="font-size: 17.479166666667pt;" aria-label="IT教程大全 (2,417个项目)">IT教程大全</a> <a href="http://www.9502669.com/tag/it%e9%97%ae%e7%ad%94" class="tag-cloud-link tag-link-4620 tag-link-position-8" style="font-size: 10.673611111111pt;" aria-label="IT问答 (94个项目)">IT问答</a> <a href="http://www.9502669.com/tag/java" class="tag-cloud-link tag-link-1017 tag-link-position-9" style="font-size: 9.9444444444444pt;" aria-label="java (67个项目)">java</a> <a href="http://www.9502669.com/tag/javascript" class="tag-cloud-link tag-link-3854 tag-link-position-10" style="font-size: 13.930555555556pt;" aria-label="JavaScript (442个项目)">JavaScript</a> <a href="http://www.9502669.com/tag/jquery" class="tag-cloud-link tag-link-689 tag-link-position-11" style="font-size: 10.479166666667pt;" aria-label="jQuery (87个项目)">jQuery</a> <a href="http://www.9502669.com/tag/nodejs" class="tag-cloud-link tag-link-3952 tag-link-position-12" style="font-size: 9.5069444444444pt;" aria-label="nodejs (54个项目)">nodejs</a> <a href="http://www.9502669.com/tag/ps" class="tag-cloud-link tag-link-1126 tag-link-position-13" style="font-size: 12.277777777778pt;" aria-label="PS (201个项目)">PS</a> <a href="http://www.9502669.com/tag/ps%e6%8a%80%e5%b7%a7" class="tag-cloud-link tag-link-1087 tag-link-position-14" style="font-size: 12.375pt;" aria-label="ps技巧 (214个项目)">ps技巧</a> <a href="http://www.9502669.com/tag/typecho" class="tag-cloud-link tag-link-4425 tag-link-position-15" style="font-size: 10.284722222222pt;" aria-label="Typecho (79个项目)">Typecho</a> <a href="http://www.9502669.com/tag/vue" class="tag-cloud-link tag-link-3950 tag-link-position-16" style="font-size: 8.1458333333333pt;" aria-label="vue (28个项目)">vue</a> <a href="http://www.9502669.com/tag/vuejs" class="tag-cloud-link tag-link-3953 tag-link-position-17" style="font-size: 8.7291666666667pt;" aria-label="vuejs (37个项目)">vuejs</a> <a href="http://www.9502669.com/tag/web%e5%bc%80%e5%8f%91" class="tag-cloud-link tag-link-89 tag-link-position-18" style="font-size: 10.479166666667pt;" aria-label="Web开发 (87个项目)">Web开发</a> <a href="http://www.9502669.com/tag/xunruicms" class="tag-cloud-link tag-link-4741 tag-link-position-19" style="font-size: 10.381944444444pt;" aria-label="XunRuiCMS (82个项目)">XunRuiCMS</a> <a href="http://www.9502669.com/tag/%e5%88%9b%e6%84%8f%e6%96%87%e6%a1%88" class="tag-cloud-link tag-link-4457 tag-link-position-20" style="font-size: 8.2916666666667pt;" aria-label="创意文案 (30个项目)">创意文案</a> <a href="http://www.9502669.com/tag/%e5%9b%be%e6%a1%88%e7%ac%a6%e5%8f%b7%e5%a4%a7%e5%85%a8" class="tag-cloud-link tag-link-1012 tag-link-position-21" style="font-size: 8.2916666666667pt;" aria-label="图案符号大全 (30个项目)">图案符号大全</a> <a href="http://www.9502669.com/tag/%e5%ae%89%e5%8d%93" class="tag-cloud-link tag-link-1018 tag-link-position-22" style="font-size: 9.75pt;" aria-label="安卓 (60个项目)">安卓</a> <a href="http://www.9502669.com/tag/%e5%b8%9d%e5%9b%bd" class="tag-cloud-link tag-link-4753 tag-link-position-23" style="font-size: 22pt;" aria-label="帝国 (20,322个项目)">帝国</a> <a href="http://www.9502669.com/tag/%e5%b8%9d%e5%9b%bdcms%e6%95%99%e7%a8%8b" class="tag-cloud-link tag-link-662 tag-link-position-24" style="font-size: 12.034722222222pt;" aria-label="帝国cms教程 (181个项目)">帝国cms教程</a> <a href="http://www.9502669.com/tag/%e5%bc%80%e5%9c%ba%e7%99%bd" class="tag-cloud-link tag-link-990 tag-link-position-25" style="font-size: 8.6319444444444pt;" aria-label="开场白 (35个项目)">开场白</a> <a href="http://www.9502669.com/tag/%e6%8a%80%e6%9c%af%e6%80%bb%e7%bb%93" class="tag-cloud-link tag-link-1231 tag-link-position-26" style="font-size: 12.131944444444pt;" aria-label="技术总结 (191个项目)">技术总结</a> <a href="http://www.9502669.com/tag/%e6%8a%80%e6%9c%af%e7%ac%94%e8%ae%b0" class="tag-cloud-link tag-link-1232 tag-link-position-27" style="font-size: 12.131944444444pt;" aria-label="技术笔记 (191个项目)">技术笔记</a> <a href="http://www.9502669.com/tag/%e6%b7%98%e5%ae%9d%e7%be%8e%e5%b7%a5" class="tag-cloud-link tag-link-960 tag-link-position-28" style="font-size: 8.5347222222222pt;" aria-label="淘宝美工 (34个项目)">淘宝美工</a> <a href="http://www.9502669.com/tag/%e6%ba%90%e7%a0%81%e6%a8%a1%e6%9d%bf" class="tag-cloud-link tag-link-1145 tag-link-position-29" style="font-size: 10.430555555556pt;" aria-label="源码模板 (84个项目)">源码模板</a> <a href="http://www.9502669.com/tag/%e6%bc%94%e8%ae%b2%e5%bc%80%e5%9c%ba%e7%99%bd" class="tag-cloud-link tag-link-991 tag-link-position-30" style="font-size: 8.6319444444444pt;" aria-label="演讲开场白 (35个项目)">演讲开场白</a> <a href="http://www.9502669.com/tag/%e7%89%b9%e6%ae%8a%e7%ac%a6%e5%8f%b7" class="tag-cloud-link tag-link-992 tag-link-position-31" style="font-size: 9.1180555555556pt;" aria-label="特殊符号 (45个项目)">特殊符号</a> <a href="http://www.9502669.com/tag/%e7%9b%b8%e5%85%b3%e6%a0%87%e7%ad%be%ef%bc%9acss" class="tag-cloud-link tag-link-1468 tag-link-position-32" style="font-size: 14.5625pt;" aria-label="相关标签：css (595个项目)">相关标签：css</a> <a href="http://www.9502669.com/tag/%e7%9b%b8%e5%85%b3%e6%a0%87%e7%ad%be%ef%bc%9ahtml" class="tag-cloud-link tag-link-1522 tag-link-position-33" style="font-size: 12.8125pt;" aria-label="相关标签：html (264个项目)">相关标签：html</a> <a href="http://www.9502669.com/tag/%e7%9b%b8%e5%85%b3%e6%a0%87%e7%ad%be%ef%bc%9ajavascript" class="tag-cloud-link tag-link-1628 tag-link-position-34" style="font-size: 12.958333333333pt;" aria-label="相关标签：javascript (283个项目)">相关标签：javascript</a> <a href="http://www.9502669.com/tag/%e7%9b%b8%e5%85%b3%e6%a0%87%e7%ad%be%ef%bc%9ajquery" class="tag-cloud-link tag-link-1896 tag-link-position-35" style="font-size: 10.090277777778pt;" aria-label="相关标签：jquery (71个项目)">相关标签：jquery</a> <a href="http://www.9502669.com/tag/%e7%9b%b8%e5%85%b3%e6%a0%87%e7%ad%be%ef%bc%9ajs" class="tag-cloud-link tag-link-2374 tag-link-position-36" style="font-size: 8pt;" aria-label="相关标签：js (26个项目)">相关标签：js</a> <a href="http://www.9502669.com/tag/%e7%9f%a2%e9%87%8f%e5%9b%be" class="tag-cloud-link tag-link-37 tag-link-position-37" style="font-size: 8.4861111111111pt;" aria-label="矢量图 (33个项目)">矢量图</a> <a href="http://www.9502669.com/tag/%e7%ac%a6%e5%8f%b7" class="tag-cloud-link tag-link-993 tag-link-position-38" style="font-size: 11.791666666667pt;" aria-label="符号 (162个项目)">符号</a> <a href="http://www.9502669.com/tag/%e7%ac%a6%e5%8f%b7%e5%9b%be%e6%a1%88" class="tag-cloud-link tag-link-1011 tag-link-position-39" style="font-size: 8.2916666666667pt;" aria-label="符号图案 (30个项目)">符号图案</a> <a href="http://www.9502669.com/tag/%e7%ac%a6%e5%8f%b7%e5%a4%a7%e5%85%a8" class="tag-cloud-link tag-link-986 tag-link-position-40" style="font-size: 9.1666666666667pt;" aria-label="符号大全 (46个项目)">符号大全</a> <a href="http://www.9502669.com/tag/%e7%bb%87%e6%a2%a6%e6%95%99%e7%a8%8b" class="tag-cloud-link tag-link-560 tag-link-position-41" style="font-size: 11.743055555556pt;" aria-label="织梦教程 (157个项目)">织梦教程</a> <a href="http://www.9502669.com/tag/%e7%be%8e%e5%b7%a5%e7%9f%a5%e8%af%86" class="tag-cloud-link tag-link-1118 tag-link-position-42" style="font-size: 8.3888888888889pt;" aria-label="美工知识 (31个项目)">美工知识</a> <a href="http://www.9502669.com/tag/%e7%be%8e%e5%b7%a5%e8%ae%be%e8%ae%a1" class="tag-cloud-link tag-link-1117 tag-link-position-43" style="font-size: 8.3888888888889pt;" aria-label="美工设计 (31个项目)">美工设计</a> <a href="http://www.9502669.com/tag/%e8%af%ad%e8%a8%80%e7%ac%a6%e5%8f%b7" class="tag-cloud-link tag-link-1014 tag-link-position-44" style="font-size: 8.3888888888889pt;" aria-label="语言符号 (31个项目)">语言符号</a> <a href="http://www.9502669.com/tag/%e8%af%ad%e8%a8%80%e7%ac%a6%e5%8f%b7%e5%a4%a7%e5%85%a8" class="tag-cloud-link tag-link-1015 tag-link-position-45" style="font-size: 8.3888888888889pt;" aria-label="语言符号大全 (31个项目)">语言符号大全</a></div> </div></aside> </div> </div> </div> </div><!-- end sitecoent --> <footer class="site-footer"> <div class="container"> <div class="footer-widget"> <div class="row"> <div class="col-xs-12 col-sm-6 col-md-3 widget--about"> <div class="widget--content"> <div class="footer--logo mb-20"> <img class="tap-logo" src="/logo.png" data-dark="/logo.png" alt="美工之家"> </div> <p class="mb-10">加入美工之家发布作品/付费下载/余额管理/积分换码，大家一起技术交流，共同进步。美工素材基地9502669.com</p> </div> </div> <!-- .col-md-2 end --> <div class="col-xs-12 col-sm-3 col-md-2 col-md-offset-1 widget--links"> <div class="widget--title"> <h5>本站导航</h5> </div> <div class="widget--content"> <ul class="list-unstyled mb-0"> <li><a href="https://www.9502669.com/jingpin">精品资源</a></li><li><a href="https://www.9502669.com/sucai">美工素材</a></li><li><a href="https://www.9502669.com/zuopin">个人作品</a></li> </ul> </div> </div> <!-- .col-md-2 end --> <div class="col-xs-12 col-sm-3 col-md-2 widget--links"> <div class="widget--title"> <h5>友情链接</h5> </div> <div class="widget--content"> <ul class="list-unstyled mb-0"> <li><a href="https://www.99zt.cn/">高端源码</a></li><li><a href="https://www.52fw.cn">免费范文</a></li><li><a href="https://www.443.net.cn">免费外链</a></li> </ul> </div> </div> <!-- .col-md-2 end --> <div class="col-xs-12 col-sm-12 col-md-4 widget--newsletter"> <div class="widget--title"> <h5>快速搜索</h5> </div> <div class="widget--content"> <form class="newsletter--form mb-30" action="http://www.9502669.com/" method="get"> <input type="text" class="form-control" name="s" placeholder="关键词"> <button type="submit"><i class="fa fa-arrow-right"></i></button> </form> <h6>美工之家-美工素材交流分享首选平台，设计师互相学习区。</h6> </div> </div> </div> </div> <div class="site-info"> © 2020 9502669.com All rights reserved. <a href="https://www.9502669.com/">美工之家</a> 版权所有 <a href="https://beian.miit.gov.cn" target="_blank" class="text" rel="noreferrer nofollow"> 鲁ICP备18023744号-2</a> <br> </div> </div> </footer> <div class="rollbar"> <div class="rollbar-item tap-dark" etap="tap-dark" title="夜间模式"><i class="mdi mdi-brightness-4"></i></div> <div class="rollbar-item tap-click-qiandao"><a class="click-qiandao" title="签到" href="javascript:;"><i class="fa fa-calendar-check-o"></i></a></div> <div class="rollbar-item tap-pencil"><a target="_blank" title="投稿赚钱" href="http://www.9502669.com/wp-admin/post-new.php"><i class="fa fa-pencil"></i></a></div> <div class="rollbar-item tap-qq" etap="tap-qq"><a target="_blank" title="QQ咨询" href="http://wpa.qq.com/msgrd?v=3&uin=9502669&site=qq&menu=yes"><i class="fa fa-qq"></i></a></div> <div class="rollbar-item tap-blog-style" etap="tap-blog-style" data-id="0" title="博客模式"><i class="fa fa-list"></i></div> <div class="rollbar-item" etap="to_full" title="全屏页面"><i class="fa fa-arrows-alt"></i></div> <div class="rollbar-item" etap="to_top" title="返回顶部"><i class="fa fa-angle-up"></i></div> </div> <div class="dimmer"></div> <div id="popup-signup" class="popup-signup fade" style="display: none;"> <div class="register-login-modal" role="document"> <div class="modal-content"> <div class="modal-body"> <img class="popup-logo" src="/logo.png" data-dark="/logo.png" alt="美工之家"> <!-- Nav tabs --> <ul class="nav nav-tabs"> <li class="active"><a href="#login" data-toggle="login">登录</a> </li> <li><a href="#signup" data-toggle="signup">注册</a> </li> </ul> <!-- Tab panes --> <div class="tab-content"> <div class="tab-pane fade in active" id="login"> <div class="signup-form-container text-center"> <form class="mb-0"> <div class="open-oauth text-center"><a href="http://www.9502669.com/oauth/qq?rurl=http://www.9502669.com/53411.html" class="btn btn-qq"><i class="fa fa-qq"></i></a></div><div class="or-text"><span>or</span></div> <a href="#" class="forget-password">仅开放社交账号登录</a> </form> <!-- form end --> </div> <!-- .signup-form end --> </div> <div class="tab-pane fade in" id="signup"> <form class="mb-0"> <div class="open-oauth text-center"><a href="http://www.9502669.com/oauth/qq?rurl=http://www.9502669.com/53411.html" class="btn btn-qq"><i class="fa fa-qq"></i></a></div><div class="or-text"><span>or</span></div> <a href="#" class="forget-password">仅开放社交账号注册</a> </form> <!-- form end --> </div> </div> <a target="_blank" href="http://www.9502669.com/wp-login.php?action=lostpassword" class="rest-password">忘记密码？</a> </div> <!-- /.modal-content --> </div> <!-- /.modal-dialog --> </div> <!-- /.modal --> </div> <div class="off-canvas"> <div class="canvas-close"><i class="mdi mdi-close"></i></div> <div class="logo-wrapper"> <a href="http://www.9502669.com/"> <img class="logo regular" src="/logo.png" alt="美工之家"> </a> </div> <div class="mobile-menu hidden-lg hidden-xl"></div> <aside class="widget-area"> </aside> </div> <script> var _hmt = _hmt || []; (function() { var hm = document.createElement("script"); hm.src = "https://hm.baidu.com/hm.js?6e3e432e6b34baedf97226f570ecbb67"; var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(hm, s); })(); </script> <script type="text/javascript"> ((function() { var callbacks = [], timeLimit = 50, open = false; setInterval(loop, 1); return { addListener: function(fn) { callbacks.push(fn); }, cancleListenr: function(fn) { callbacks = callbacks.filter(function(v) { return v !== fn; }); } } function loop() { var startTime = new Date(); debugger; if (new Date() - startTime > timeLimit) { if (!open) { callbacks.forEach(function(fn) { fn.call(null); }); } open = true; window.stop(); alert('不要扒我了'); window.location.reload(); } else { open = false; } } })()).addListener(function() { window.location.reload(); }); </script> <script type='text/javascript' src='http://www.9502669.com/wp-content/themes/ripro/assets/js/plugins.js?ver=8.0.0' id='plugins-js'></script> <script type='text/javascript' id='app-js-extra'> /* <![CDATA[ */ var caozhuti = {"site_name":"\u7f8e\u5de5\u4e4b\u5bb6","home_url":"http:\/\/www.9502669.com","ajaxurl":"http:\/\/www.9502669.com\/wp-admin\/admin-ajax.php","is_singular":"1","tencent_captcha":{"is":"","appid":""},"infinite_load":"\u52a0\u8f7d\u66f4\u591a","infinite_loading":"<i class=\"fa fa-spinner fa-spin\"><\/i> \u52a0\u8f7d\u4e2d...","site_notice":{"is":"0","color":"#1e73be","html":"<div class=\"notify-content\"><h3>\u7f8e\u5de5\u4e4b\u5bb6\u6700\u65b0\u516c\u544a<\/h3><div>\u7f8e\u5de5\u3001\u8bbe\u8ba1\u5e08\u805a\u96c6\u5730\u3002\u8d44\u6e90\u4ea4\u6362\uff0c\u53d1\u5e03\u81ea\u5df1\u7684\u6536\u85cf\u6362\u53d6\u4ed6\u4eba\u7684\u6536\u85cf\uff0c\u540c\u65f6\u5356\u51fa\u53ef\u4ee5\u6d3b\u52a8\u6536\u5165\u54e6\uff01QQ\u4e00\u952e\u767b\u5f55\uff0c\u5feb\u6765\u5c1d\u8bd5 \u4e00\u4e0b\u5427<\/div><\/div>"},"pay_type_html":{"html":"<div class=\"pay-button-box\"><div class=\"pay-item\" id=\"alipay\" data-type=\"6\"><i class=\"alipay\"><\/i><span>\u652f\u4ed8\u5b9d<\/span><\/div><\/div><p style=\"font-size: 13px; padding: 0; margin: 0;\">\u5f53\u524d\u4e3a\u6e38\u5ba2\u8d2d\u4e70\u6a21\u5f0f<\/p>","alipay":6,"weixinpay":0}}; /* ]]> */ </script> <script type='text/javascript' src='http://www.9502669.com/wp-content/themes/ripro/assets/js/app.js?ver=8.0.0' id='app-js'></script> <script type='text/javascript' src='http://www.9502669.com/wp-content/themes/ripro/assets/js/plugins/jquery.fancybox.min.js?ver=8.0.0' id='fancybox-js'></script> <script type='text/javascript' id='QAPress-js-js-extra'> /* <![CDATA[ */ var QAPress_js = {"ajaxurl":"http:\/\/www.9502669.com\/wp-admin\/admin-ajax.php","ajaxloading":"http:\/\/www.9502669.com\/wp-content\/plugins\/QAPress\/images\/loading.gif"}; /* ]]> */ </script> <script type='text/javascript' src='http://www.9502669.com/wp-content/plugins/QAPress/js/scripts.min.js?ver=2.3.1' id='QAPress-js-js'></script> </body> </html>
