今天要介绍的是产品经理的小伙伴之一:前端开发工程师,虽然天天和他们打交道,但是想必大家都没有好好的“关心”过他们,今天我们一起来看看天天接触的前端工程师到底在忙些什么。

现在移动互联网发展的这么快,前端开发领域也越来越广,前端早已经告别了切图崽的时代,在web端、移动端(安卓、IOS)、Watch、小程序、公众号开发、混合app开发都能看到前端开发工程师的影子

从狭义上讲,前端工程师使用 HTML、CSS、JavaScript 等专业技能和工具将产品UI设计稿实现成网站产品,涵盖用户PC端、移动端网页,处理视觉和交互问题

从广义上来讲,所有用户终端产品与视觉和交互有关的部分,都是前端工程师的专业领域

简单的说,前端开发工程师日常工作是创建Web页面或移动页面等前端界面呈现给用户的过程,通过前端三大件HTML、CSS、JavaScript以及衍生出来的各种技术、框架、解决方案,来实现互联网产品的用户界面交互 。

用户看到的每一个网页主要由三部分组成:结构( Structure) 、 表现( Presentation) 和行为( Behavior)。

HTML —— 结构, 决定网页的结构和内容(“是什么”);

CSS —— 表现( 样式) , 设定网页的表现样式(“什么样子”);

JavaScript —— 行为, 控制网页的行为(“做什么”);

HTML、CSS、JavaScript是前端开发中最基本也是最必须的三个技能。前端开发中,在页面的布局时, HTML将元素进行定义,CSS对展示的元素进行定位,再通过JavaScript实现相应的效果和交互。接下来我们好好聊聊这三大件,知己知彼。

HTML是什么?

可以把HTML结构想象成一个没穿衣服的人。

HTML指超文本标记语言(HyperText Markup Language),“超文本”就是指页面内可以包含图片、链接,甚至音乐、程序等非文字元素。前端开发利用HTML标签(Tag)来标记(Markup)网页中的文字。

(html代码示例)

上述代码是一个最基础HTML结构,一个网页的结构往往包括“头”和“主体”,头部的内容使用header标签标记,主要存放一些网页信息,例如网页标题、内容摘要、关键词等,头部内容也是SEO优化的重要对象。

主体部分用标签body标签标记,网页的内容全部放在body标签下,其内部又包含了很多代表不同含义的标签(如下表所示,只展示部分常用的)。

这些形形**的标签就构成了页面的内容,要注意的是整个网页的内容都要放在一个顶层标签html标签下。

标签

描述

定义锚。

定义粗体字。

定义文档的主体。

定义文档中的节。

定义定义列表。

to

定义 HTML 标题,可以改变标题的大小。

定义关于文档的信息。

定义 HTML 文档。

定义图像。

定义关于 HTML 文档的元信息。

定义段落。

定义文档中的节。

定义强调文本。

定义表格。

</span><span></span></p> </td> <td width="536" colspan="1" rowspan="1" align="" valign="middle"> <p><span></span></p> <p><span>定义文档的标题。</span><span></span></p> </td> </tr> <tr> <td width="179" colspan="1" rowspan="1" align="" valign="middle"> <p><span></span></p> <p><span></p> <ul></span><span></span></p> </td> <td width="536" colspan="1" rowspan="1" align="" valign="middle"> <p><span></span></p> <p><span>定义无序列表。</span><span></span></p> </td> </tr> <tr> <td width="179" colspan="1" rowspan="1" align="" valign="middle"> <p><span></span></p> <p><span><video></span><span></span></p> </td> <td width="536" colspan="1" rowspan="1" align="" valign="middle"> <p><span></span></p> <p><span>定义视频。</span><span></span></p> </td> </tr> </tbody> </table> <p><span>(常用标签)</span></p> <p></p> <p>例如:我们点击某个链接,然后自动跳转一个新的页面,这过程都是a标签在起作用。还有看到的图片,就是img标签承载图片的数据源。</p> <p>最后,告诉大家两个查看HTML源码的方法,好奇的伙伴可以去试试。</p> <p>(1)打开浏览器,鼠标在页面上右击,然后点击“查看页面源码”;</p> <p>(2)打开浏览器,按 “F12” 键;</p> <p><img loading="lazy" decoding="async" class="alignnone size-full wp-image-46087" src="https://sc1688-1302705511.cos.ap-beijing.myqcloud.com/weituike/2022/07/16392205166049f64dafb942.40575410.png" width="1080" height="337" srcset="https://sc1688-1302705511.cos.ap-beijing.myqcloud.com/weituike/2022/07/16392205166049f64dafb942.40575410.png 1080w, https://sc1688-1302705511.cos.ap-beijing.myqcloud.com/weituike/2022/07/16392205166049f64dafb942.40575410-300x94.png 300w, https://sc1688-1302705511.cos.ap-beijing.myqcloud.com/weituike/2022/07/16392205166049f64dafb942.40575410-768x240.png 768w" sizes="auto, (max-width: 1080px) 100vw, 1080px" /></p> <section></section> <p><span><strong>CSS是什么?</strong></span><span></span></p> <p><span>可以把CSS想象成给一个没穿衣服的人(HTML结构)化妆、穿衣服等,作用是让它变得美美的 。</span></p> <p><strong>CSS 指层叠样式表</strong>(Cascading Style Sheets),是一种将网页内容与网页样式分离的技术。我们经常会对一个网站评价道:这网站页面怎么这么乱;这网站看起来真大气,这背后都是受CSS影响;</p> <p><strong>css可以做什么</strong></p> <p>(1) CSS主要用来设计网页的样式,美化网页;它不仅可以静态地修饰网页,还可以配合各种脚本语言动态地对网页各元素进行格式化。比如一开始文字显示是红色,我点击某个按钮后文字变黑色了。</p> <p>(2) 你可以轻松地控制页面的布局,CSS 能够对网页中元素位置的排版进行像素级精确控制,因此我们能看到各式各样的布局风格。</p> <p>(3) 在页面制作时采用CSS技术,可以有效地对页面的布局、字体、颜色、背景和其它效果实现更加精确的控制。例如通过文本属性,可以改变文本的颜色、字符间距,对齐文本,装饰文本,对文本进行缩进等等。</p> <p>(4) 你可以将许多网页的风格格式同时更新,不用再一页一页地更新了。你可以将站点上所有的网页风格都使用一个CSS文件进行控制,只要修改这个CSS文件中相应的行,那么整个站点的所有页面都会随之发生变动。</p> <p>(5) CSS在几乎所有的浏览器上都可以使用。</p> <p><img loading="lazy" decoding="async" class="alignnone size-full wp-image-46090" src="https://sc1688-1302705511.cos.ap-beijing.myqcloud.com/weituike/2022/07/10873441106049f64e6e33d6.71162926.png" width="805" height="362" srcset="https://sc1688-1302705511.cos.ap-beijing.myqcloud.com/weituike/2022/07/10873441106049f64e6e33d6.71162926.png 805w, https://sc1688-1302705511.cos.ap-beijing.myqcloud.com/weituike/2022/07/10873441106049f64e6e33d6.71162926-300x135.png 300w, https://sc1688-1302705511.cos.ap-beijing.myqcloud.com/weituike/2022/07/10873441106049f64e6e33d6.71162926-768x345.png 768w" sizes="auto, (max-width: 805px) 100vw, 805px" /></p> <p><span>(CSS代码示例)</span></p> <section><span><br /></span></section> <p><span><strong>JS是什么?</strong></span><span></span></p> <p><span>JS能够让HTML结构这个人\”<span>跳舞</span>\”、\”跑步\”等动作,主要</span><span>目的是让\”<span>人</span>\”动起来</span><span>。</span></p> <p>JS(JavaScript)是一种属于网络的高级脚本语言,已经被广泛用于Web应用开发,常用来为网页添加各式各样的动态功能,为用户提供更流畅美观的浏览效果。通常JavaScript脚本是通过嵌入在HTML中来实现自身的功能的。</p> <p><strong>js可以做什么</strong></p> <p>(1) 使网页具有交互性,例如,banner轮播效果、手动Tab切换等效果;</p> <p>(2) 可以处理表单,检验用户的输入,并提供及时反馈节省用户时间。例如,表单中要你输入电子邮箱而你却输入一个手机号,那么应该给你一个错误提醒。</p> <p>(3) 还可以根据用户的操作,动态的创建页面。例如,发邮件时,添加附件操作。</p> <p>(4) 设置cookie,cookie是存储在浏览器上的一些临时信息,例如你浏览过的网站地址,使用过的用户名。</p> <p>(5) 跨平台特性,在绝大多数浏览器的支持下,可以在多种平台下运行(如Windows、Linux、Mac、Android、iOS等)。</p> <p>(6) ……等等</p> <p><img loading="lazy" decoding="async" class="alignnone size-full wp-image-46093" src="https://sc1688-1302705511.cos.ap-beijing.myqcloud.com/weituike/2022/07/14715123706049f64f318116.98880407.png" width="733" height="423" srcset="https://sc1688-1302705511.cos.ap-beijing.myqcloud.com/weituike/2022/07/14715123706049f64f318116.98880407.png 733w, https://sc1688-1302705511.cos.ap-beijing.myqcloud.com/weituike/2022/07/14715123706049f64f318116.98880407-300x173.png 300w" sizes="auto, (max-width: 733px) 100vw, 733px" /></p> <p><span>(JS代码示例)</span></p> <section></section> <p>前端三大件到此介绍完毕,不过现在有些其他语言的程序猿在讨论HTML、CSS、JS倒是算不算编程语言。</p> <p><img loading="lazy" decoding="async" class="alignnone size-full wp-image-46095" src="https://sc1688-1302705511.cos.ap-beijing.myqcloud.com/weituike/2022/07/12792047166049f64fe69a20.50138905.png" width="240" height="219" srcset="https://sc1688-1302705511.cos.ap-beijing.myqcloud.com/weituike/2022/07/12792047166049f64fe69a20.50138905.png 240w, https://sc1688-1302705511.cos.ap-beijing.myqcloud.com/weituike/2022/07/12792047166049f64fe69a20.50138905-219x200.png 219w" sizes="auto, (max-width: 240px) 100vw, 240px" /></p> <p><span><strong>全栈工程师</strong></span><span></span></p> <p>前端开发工程师在精进一步可以发展为全栈工程师,向<span>T</span><span>型人才或者π型人才发展。</span></p> <p>全栈工程师熟悉多种开发语言,同时具备前端和后台开发能力,既能做前端(需要熟悉前端三大件以及Vue等各种前端技术),又能做后端(需要熟悉<span>Node.js</span>或Java或ASP.net或php或Go<span>等</span>),可以独自完成一个产品的前、后台开发工作。</p> <p>简单了解下全栈工程师的技术栈有哪些:</p> <p>(1) 前端技术:HTML/HTML5、CSS/CSS3、LESS/Javascript、jQuery、RequireJS、AngularJS、Vue等;</p> <p>(2) 后端技术:node.js或Java、php等;</p> <p>(3) 中间件:Nginx或Dubbo;</p> <p>(4) 数据库:MySQL或MongoDB;</p> <p>(5) 代码管理:git、svn;</p> <p>(6) 构建工具:webpack、gulp、Jenkins;</p> <p>(7) ……等等;</p> <p>我们可以看到,对于全栈工程师来说,要活到老,学到老,其中最重要的属性,就是不同的思维方式和强大的学习能力。</p> <p>最后,请重新认识一下你身边那个平平无奇的前端小伙伴吧!也可以把本篇文章分享给他看看,到底有几分像,哈哈。</p> <p><img loading="lazy" decoding="async" class="alignnone size-full wp-image-46098" src="https://sc1688-1302705511.cos.ap-beijing.myqcloud.com/weituike/2022/07/10414131460483fb96dcc10.09146632-3.jpeg" width="706" height="401" srcset="https://sc1688-1302705511.cos.ap-beijing.myqcloud.com/weituike/2022/07/10414131460483fb96dcc10.09146632-3.jpeg 706w, https://sc1688-1302705511.cos.ap-beijing.myqcloud.com/weituike/2022/07/10414131460483fb96dcc10.09146632-3-300x170.jpeg 300w" sizes="auto, (max-width: 706px) 100vw, 706px" /></p> <div class="entry-copyright"> <i class="fas fa-info-circle me-1"></i>声明:本站所有文章,如无特殊说明或标注,均为本站原创发布。任何个人或组织,在未征得本站同意时,禁止复制、盗用、采集、发布本站内容到任何网站、书籍等各类媒体平台。如若本站内容侵犯了原著者的合法权益,可联系我们进行处理。</div> </article> <div class="entry-tags"> <i class="fas fa-tags me-1"></i> <a href="http://www.1518.top/tag/%e4%ba%a7%e5%93%81%e8%bf%90%e8%90%a5" rel="tag">产品运营</a> </div> <div class="entry-social"> <div class="row mt-2 mt-lg-3"> <div class="col"> <a class="share-author" href="http://www.1518.top/author/5aa5ebce163d08b4"> <div class="avatar me-1"><img class="avatar-img rounded-circle border border-white border-3 shadow" src="//www.1518.top/wp-content/uploads/1234/01/avatar-1.png" alt=""> </div>微推客 </a> </div> <div class="col-auto"> <a class="btn btn-sm btn-info-soft post-share-btn" href="javascript:void(0);"><i class="fas fa-share-alt me-1"></i>分享</a> <a class="btn btn-sm btn-success-soft post-fav-btn" href="javascript:void(0);" data-is="1"><i class="far fa-star me-1"></i></i>收藏</a> <a class="btn btn-sm btn-danger-soft post-like-btn" href="javascript:void(0);" data-text="已点赞"><i class="far fa-heart me-1"></i>点赞(<span class="count">0</span>)</a> </div> </div> </div> </div> <div class="tab-pane fade" id="pills-faq" role="tabpanel" aria-labelledby="pills-faq-tab"> <ol class="list-group list-group-numbered"> <li class="list-group-item list-group-item-info d-flex justify-content-between align-items-start"> <div class="ms-2 me-auto"> <div class="fw-bold">免费下载或者VIP会员资源能否直接商用?</div> <div class="text-muted">本站所有资源版权均属于原作者所有,这里所提供资源均只能用于参考学习用,请勿直接商用。若由于商用引起版权纠纷,一切责任均由使用者承担。更多说明请参考 VIP介绍。</div> </div> </li> <li class="list-group-item list-group-item-info d-flex justify-content-between align-items-start"> <div class="ms-2 me-auto"> <div class="fw-bold">提示下载完但解压或打开不了?</div> <div class="text-muted">最常见的情况是下载不完整: 可对比下载完压缩包的与网盘上的容量,若小于网盘提示的容量则是这个原因。这是浏览器下载的bug,建议用百度网盘软件或迅雷下载。 若排除这种情况,可在对应资源底部留言,或联络我们。</div> </div> </li> <li class="list-group-item list-group-item-info d-flex justify-content-between align-items-start"> <div class="ms-2 me-auto"> <div class="fw-bold">找不到素材资源介绍文章里的示例图片?</div> <div class="text-muted">对于会员专享、整站源码、程序插件、网站模板、网页模版等类型的素材,文章内用于介绍的图片通常并不包含在对应可供下载素材包内。这些相关商业图片需另外购买,且本站不负责(也没有办法)找到出处。 同样地一些字体文件也是这种情况,但部分素材会在素材包内有一份字体下载链接清单。</div> </div> </li> <li class="list-group-item list-group-item-info d-flex justify-content-between align-items-start"> <div class="ms-2 me-auto"> <div class="fw-bold">付款后无法显示下载地址或者无法查看内容?</div> <div class="text-muted">如果您已经成功付款但是网站没有弹出成功提示,请联系站长提供付款信息为您处理</div> </div> </li> <li class="list-group-item list-group-item-info d-flex justify-content-between align-items-start"> <div class="ms-2 me-auto"> <div class="fw-bold">购买该资源后,可以退款吗?</div> <div class="text-muted">源码素材属于虚拟商品,具有可复制性,可传播性,一旦授予,不接受任何形式的退款、换货要求。请您在购买获取之前确认好 是您所需要的资源</div> </div> </li> </ol> </div> <div class="tab-pane fade" id="pills-comments" role="tabpanel" aria-labelledby="pills-comments-tab"> <div id="comments" class="entry-comments"> <h2 class="comments-title"><i class="fas fa-comment-dots me-1"></i>评论(0)</h2> <div id="respond" class="comment-respond"> <h3 id="reply-title" class="comment-reply-title">提示:请文明发言 <small><a rel="nofollow" id="cancel-comment-reply-link" href="/46099.html#respond" style="display:none;">取消回复</a></small></h3><form action="http://www.1518.top/wp-comments-post.php" method="post" id="commentform" class="comment-form" novalidate><p class="comment-notes"><span id="email-notes">您的邮箱地址不会被公开。</span> <span class="required-field-message">必填项已用 <span class="required">*</span> 标注</span></p><div class="comment-form-comment"><textarea id="comment" name="comment" rows="3" placeholder="请输入评论内容..."></textarea></div><div class="comment-form-author"><input id="author" name="author" type="text" placeholder="*昵称:" value="" size="30" class="required"></div> <div class="comment-form-email"><input id="email" name="email" type="text" placeholder="*邮箱:" value="" class="required"></div> <div class="comment-form-url"><input id="url" name="url" type="text" placeholder="网址:" value="" size="30"></div> <input type="hidden" name="wp-comment-cookies-consent" value="yes"> <p class="form-submit"><input name="submit" type="submit" id="submit" class="submit" value="提交评论" /> <input type='hidden' name='comment_post_ID' value='46099' id='comment_post_ID' /> <input type='hidden' name='comment_parent' id='comment_parent' value='0' /> </p><p style="display: none;"><input type="hidden" id="ak_js" name="ak_js" value="219"/></p></form> </div><!-- #respond --> </div> </div> </div> </div> <div class="entry-navigation"> <div class="row g-3"> <div class="col-lg-6 col-12"> <a class="entry-page-prev" href="http://www.1518.top/46182.html" title="如何让你的图标具有说服力?"> <div class="entry-page-icon"><i class="fas fa-arrow-left"></i></div> <div class="entry-page-info"> <span class="d-block rnav">上一篇</span> <div class="title">如何让你的图标具有说服力?</div> </div> </a> </div> <div class="col-lg-6 col-12"> <a class="entry-page-next" href="http://www.1518.top/46121.html" title="普通家庭出生,如今家庭幸福,为什么会选择创业?"> <div class="entry-page-info"> <span class="d-block rnav">下一篇</span> <div class="title">普通家庭出生,如今家庭幸福,为什么会选择创业?</div> </div> <div class="entry-page-icon"><i class="fas fa-arrow-right"></i></div> </a> </div> </div> </div> <div class="related-posts"> <h2 class="related-posts-title"><i class="fab fa-hive me-1"></i>相关文章</h2> <div class="row g-2 g-md-3 row-cols-2 row-cols-md-3 row-cols-lg-4"> <div class="col"> <article class="post-item item-grid"> <div class="tips-badge position-absolute top-0 start-0 z-1 m-2"> </div> <div class="entry-media ratio ratio-3x2"> <a target="" class="media-img lazy bg-cover bg-center" href="http://www.1518.top/12572.html" title="病毒营销之八卦:为什么八卦这种方式总自带燎原魔力?" data-bg="//image.woshipm.com/wp-files/img/47.png"> <!-- 音视频缩略图 --> </a> </div> <div class="entry-wrapper"> <div class="entry-cat-dot"><a href="http://www.1518.top/yunying/chanpin">产品运营</a></div> <h2 class="entry-title"> <a target="" href="http://www.1518.top/12572.html" title="病毒营销之八卦:为什么八卦这种方式总自带燎原魔力?">病毒营销之八卦:为什么八卦这种方式总自带燎原魔力?</a> </h2> <div class="entry-desc">能够自发产生二次传播的病毒营销只有四种,为何八卦这种方式总是雾里看花最难掌握? ...</div> <div class="entry-meta"> <span class="meta-date"><i class="far fa-clock me-1"></i><time class="pub-date" datetime="2022-07-09T16:45:10+08:00">3 年前</time></span> <span class="meta-likes d-none d-md-inline-block"><i class="far fa-heart me-1"></i>0</span> <span class="meta-fav d-none d-md-inline-block"><i class="far fa-star me-1"></i>0</span> <span class="meta-views"><i class="far fa-eye me-1"></i>6</span> </div> </div> </article> </div> <div class="col"> <article class="post-item item-grid"> <div class="tips-badge position-absolute top-0 start-0 z-1 m-2"> </div> <div class="entry-media ratio ratio-3x2"> <a target="" class="media-img lazy bg-cover bg-center" href="http://www.1518.top/10271.html" title="天猫超级品牌日营销复盘:天猫又搞了什么事?" data-bg="//image.woshipm.com/wp-files/img/59.png"> <!-- 音视频缩略图 --> </a> </div> <div class="entry-wrapper"> <div class="entry-cat-dot"><a href="http://www.1518.top/yunying/chanpin">产品运营</a></div> <h2 class="entry-title"> <a target="" href="http://www.1518.top/10271.html" title="天猫超级品牌日营销复盘:天猫又搞了什么事?">天猫超级品牌日营销复盘:天猫又搞了什么事?</a> </h2> <div class="entry-desc">天猫又来搞事了! 最近,脑洞君又被天猫「cool」到了。 这飞飞扬扬的的雪花,一...</div> <div class="entry-meta"> <span class="meta-date"><i class="far fa-clock me-1"></i><time class="pub-date" datetime="2022-07-08T09:31:20+08:00">3 年前</time></span> <span class="meta-likes d-none d-md-inline-block"><i class="far fa-heart me-1"></i>0</span> <span class="meta-fav d-none d-md-inline-block"><i class="far fa-star me-1"></i>0</span> <span class="meta-views"><i class="far fa-eye me-1"></i>6</span> </div> </div> </article> </div> <div class="col"> <article class="post-item item-grid"> <div class="tips-badge position-absolute top-0 start-0 z-1 m-2"> </div> <div class="entry-media ratio ratio-3x2"> <a target="" class="media-img lazy bg-cover bg-center" href="http://www.1518.top/38713.html" title="产品经理要懂得的那些交互设计" data-bg="https://sc1688-1302705511.cos.ap-beijing.myqcloud.com/weituike/2022/07/1375344591604f9defb861f3.03111503-2-228x200.png"> <!-- 音视频缩略图 --> </a> </div> <div class="entry-wrapper"> <div class="entry-cat-dot"><a href="http://www.1518.top/yunying/chanpin">产品运营</a></div> <h2 class="entry-title"> <a target="" href="http://www.1518.top/38713.html" title="产品经理要懂得的那些交互设计">产品经理要懂得的那些交互设计</a> </h2> <div class="entry-desc">面向企业服务的 B 端产品经理,更偏向于逻辑的思考和练习,对交互反而重视度不够。...</div> <div class="entry-meta"> <span class="meta-date"><i class="far fa-clock me-1"></i><time class="pub-date" datetime="2022-07-11T23:25:35+08:00">3 年前</time></span> <span class="meta-likes d-none d-md-inline-block"><i class="far fa-heart me-1"></i>0</span> <span class="meta-fav d-none d-md-inline-block"><i class="far fa-star me-1"></i>0</span> <span class="meta-views"><i class="far fa-eye me-1"></i>5</span> </div> </div> </article> </div> <div class="col"> <article class="post-item item-grid"> <div class="tips-badge position-absolute top-0 start-0 z-1 m-2"> </div> <div class="entry-media ratio ratio-3x2"> <a target="" class="media-img lazy bg-cover bg-center" href="http://www.1518.top/50935.html" title="38家品牌微信红包封面设计大PK,哪家强?" data-bg="https://sc1688-1302705511.cos.ap-beijing.myqcloud.com/weituike/2022/07/1904486380601e568b575dc2.19984351-1-121x200.jpeg"> <!-- 音视频缩略图 --> </a> </div> <div class="entry-wrapper"> <div class="entry-cat-dot"><a href="http://www.1518.top/yunying/chanpin">产品运营</a></div> <h2 class="entry-title"> <a target="" href="http://www.1518.top/50935.html" title="38家品牌微信红包封面设计大PK,哪家强?">38家品牌微信红包封面设计大PK,哪家强?</a> </h2> <div class="entry-desc">今年各品牌的红包封面也是十分丰富、创意十足。 新年新气象,品牌们更倾向于选用洋溢...</div> <div class="entry-meta"> <span class="meta-date"><i class="far fa-clock me-1"></i><time class="pub-date" datetime="2022-07-12T10:18:58+08:00">3 年前</time></span> <span class="meta-likes d-none d-md-inline-block"><i class="far fa-heart me-1"></i>0</span> <span class="meta-fav d-none d-md-inline-block"><i class="far fa-star me-1"></i>0</span> <span class="meta-views"><i class="far fa-eye me-1"></i>17</span> </div> </div> </article> </div> </div> </div> </div> <div class="sidebar-wrapper col-md-12 col-lg-3 h-100" data-sticky> <div class="sidebar"> <div id="text-2" class="widget widget_text"><h5 class="widget-title">学习交流</h5> <div class="textwidget"><p><strong>QQ客服:312869007<br /> 网赚交流群:37294287</strong></p> </div> </div><div id="media_image-2" class="widget widget_media_image"><h5 class="widget-title">关注公众号学习交流</h5><img width="1280" height="1280" src="https://sc1688-1302705511.cos.ap-beijing.myqcloud.com/weituike/2024/09/公众号.jpg" class="image wp-image-777808 attachment-full size-full" alt="" style="max-width: 100%; height: auto;" decoding="async" loading="lazy" /></div><div id="tag_cloud-2" class="widget widget_tag_cloud"><h5 class="widget-title">标签</h5><div class="tagcloud"><a href="http://www.1518.top/tag/aso-asa" class="tag-cloud-link tag-link-5798 tag-link-position-1" style="font-size: 12.208588957055pt;" aria-label="ASO/ASA (1,567 项)">ASO/ASA</a> <a href="http://www.1518.top/tag/seo-sem" class="tag-cloud-link tag-link-5711 tag-link-position-2" style="font-size: 13.239263803681pt;" aria-label="SEO/SEM (2,101 项)">SEO/SEM</a> <a href="http://www.1518.top/tag/%e4%ba%92%e8%81%94%e7%bd%91" class="tag-cloud-link tag-link-595 tag-link-position-3" style="font-size: 11.865030674847pt;" aria-label="互联网 (1,453 项)">互联网</a> <a href="http://www.1518.top/tag/%e4%ba%a7%e5%93%81%e8%bf%90%e8%90%a5" class="tag-cloud-link tag-link-495 tag-link-position-4" style="font-size: 15.300613496933pt;" aria-label="产品运营 (3,644 项)">产品运营</a> <a href="http://www.1518.top/tag/%e4%bc%a0%e6%92%ad" class="tag-cloud-link tag-link-1003 tag-link-position-5" style="font-size: 8.0858895705521pt;" aria-label="传播 (529 项)">传播</a> <a href="http://www.1518.top/tag/%e4%bf%a1%e6%81%af%e6%b5%81%e5%b9%bf%e5%91%8a" class="tag-cloud-link tag-link-575 tag-link-position-6" style="font-size: 13.926380368098pt;" aria-label="信息流广告 (2,520 项)">信息流广告</a> <a href="http://www.1518.top/tag/%e5%86%85%e5%ae%b9%e8%bf%90%e8%90%a5" class="tag-cloud-link tag-link-485 tag-link-position-7" style="font-size: 14.613496932515pt;" aria-label="内容运营 (3,034 项)">内容运营</a> <a href="http://www.1518.top/tag/%e5%88%9b%e6%84%8f" class="tag-cloud-link tag-link-1029 tag-link-position-8" style="font-size: 9.2883435582822pt;" aria-label="创意 (728 项)">创意</a> <a href="http://www.1518.top/tag/%e5%93%81%e7%89%8c" class="tag-cloud-link tag-link-612 tag-link-position-9" style="font-size: 9.7177914110429pt;" aria-label="品牌 (807 项)">品牌</a> <a href="http://www.1518.top/tag/%e5%93%81%e7%89%8c%e8%90%a5%e9%94%80" class="tag-cloud-link tag-link-487 tag-link-position-10" style="font-size: 10.319018404908pt;" aria-label="品牌营销 (945 项)">品牌营销</a> <a href="http://www.1518.top/tag/%e5%93%81%e7%89%8c%e8%90%a5%e9%94%80%e6%a1%88%e4%be%8b" class="tag-cloud-link tag-link-4306 tag-link-position-11" style="font-size: 16.760736196319pt;" aria-label="品牌营销案例 (5,345 项)">品牌营销案例</a> <a href="http://www.1518.top/tag/%e5%a4%a7%e5%8e%82%e5%8a%a8%e6%80%81" class="tag-cloud-link tag-link-816 tag-link-position-12" style="font-size: 22pt;" aria-label="大厂动态 (22,118 项)">大厂动态</a> <a href="http://www.1518.top/tag/%e5%b0%8f%e7%ba%a2%e4%b9%a6" class="tag-cloud-link tag-link-437 tag-link-position-13" style="font-size: 8.7730061349693pt;" aria-label="小红书 (628 项)">小红书</a> <a href="http://www.1518.top/tag/%e5%b8%82%e5%9c%ba%e6%b4%9e%e5%af%9f" class="tag-cloud-link tag-link-6066 tag-link-position-14" style="font-size: 8.5153374233129pt;" aria-label="市场洞察 (583 项)">市场洞察</a> <a href="http://www.1518.top/tag/%e5%b8%82%e5%9c%ba%e8%bf%90%e8%90%a5" class="tag-cloud-link tag-link-581 tag-link-position-15" style="font-size: 8.7730061349693pt;" aria-label="市场运营 (623 项)">市场运营</a> <a href="http://www.1518.top/tag/%e5%b9%bf%e5%91%8a" class="tag-cloud-link tag-link-963 tag-link-position-16" style="font-size: 8.7730061349693pt;" aria-label="广告 (631 项)">广告</a> <a href="http://www.1518.top/tag/%e5%b9%bf%e5%91%8a%e6%96%87%e6%a1%88%e5%88%9b%e6%84%8f" class="tag-cloud-link tag-link-6171 tag-link-position-17" style="font-size: 19.079754601227pt;" aria-label="广告文案创意 (9,974 项)">广告文案创意</a> <a href="http://www.1518.top/tag/%e6%80%9d%e7%bb%b4" class="tag-cloud-link tag-link-618 tag-link-position-18" style="font-size: 9.8036809815951pt;" aria-label="思维 (833 项)">思维</a> <a href="http://www.1518.top/tag/%e6%8a%96%e9%9f%b3" class="tag-cloud-link tag-link-491 tag-link-position-19" style="font-size: 9.8036809815951pt;" aria-label="抖音 (837 项)">抖音</a> <a href="http://www.1518.top/tag/%e6%8e%a8%e5%b9%bf" class="tag-cloud-link tag-link-617 tag-link-position-20" style="font-size: 8.6871165644172pt;" aria-label="推广 (612 项)">推广</a> <a href="http://www.1518.top/tag/%e6%95%b0%e6%8d%ae%e5%88%86%e6%9e%90" class="tag-cloud-link tag-link-907 tag-link-position-21" style="font-size: 8pt;" aria-label="数据分析 (514 项)">数据分析</a> <a href="http://www.1518.top/tag/%e6%95%b0%e6%8d%ae%e8%bf%90%e8%90%a5" class="tag-cloud-link tag-link-584 tag-link-position-22" style="font-size: 12.80981595092pt;" aria-label="数据运营 (1,851 项)">数据运营</a> <a href="http://www.1518.top/tag/%e6%96%87%e6%a1%88" class="tag-cloud-link tag-link-541 tag-link-position-23" style="font-size: 13.668711656442pt;" aria-label="文案 (2,352 项)">文案</a> <a href="http://www.1518.top/tag/%e6%96%b0%e5%aa%92%e4%bd%93" class="tag-cloud-link tag-link-582 tag-link-position-24" style="font-size: 9.9754601226994pt;" aria-label="新媒体 (860 项)">新媒体</a> <a href="http://www.1518.top/tag/%e6%96%b0%e5%aa%92%e4%bd%93%e8%bf%90%e8%90%a5" class="tag-cloud-link tag-link-471 tag-link-position-25" style="font-size: 15.815950920245pt;" aria-label="新媒体运营 (4,201 项)">新媒体运营</a> <a href="http://www.1518.top/tag/%e6%a1%88%e4%be%8b%e5%88%86%e6%9e%90" class="tag-cloud-link tag-link-596 tag-link-position-26" style="font-size: 11.435582822086pt;" aria-label="案例分析 (1,300 项)">案例分析</a> <a href="http://www.1518.top/tag/%e6%b4%bb%e5%8a%a8%e7%ad%96%e5%88%92" class="tag-cloud-link tag-link-554 tag-link-position-27" style="font-size: 10.748466257669pt;" aria-label="活动策划 (1,082 项)">活动策划</a> <a href="http://www.1518.top/tag/%e6%b4%bb%e5%8a%a8%e8%bf%90%e8%90%a5" class="tag-cloud-link tag-link-500 tag-link-position-28" style="font-size: 8.4294478527607pt;" aria-label="活动运营 (581 项)">活动运营</a> <a href="http://www.1518.top/tag/%e6%b4%bb%e5%8a%a8%e8%bf%90%e8%90%a5%e6%96%b9%e6%a1%88" class="tag-cloud-link tag-link-579 tag-link-position-29" style="font-size: 8.0858895705521pt;" aria-label="活动运营方案 (520 项)">活动运营方案</a> <a href="http://www.1518.top/tag/%e7%94%a8%e6%88%b7%e7%a0%94%e7%a9%b6" class="tag-cloud-link tag-link-589 tag-link-position-30" style="font-size: 8.3435582822086pt;" aria-label="用户研究 (567 项)">用户研究</a> <a href="http://www.1518.top/tag/%e7%94%a8%e6%88%b7%e8%bf%90%e8%90%a5" class="tag-cloud-link tag-link-501 tag-link-position-31" style="font-size: 15.901840490798pt;" aria-label="用户运营 (4,300 项)">用户运营</a> <a href="http://www.1518.top/tag/%e7%94%b5%e5%95%86" class="tag-cloud-link tag-link-641 tag-link-position-32" style="font-size: 10.576687116564pt;" aria-label="电商 (1,030 项)">电商</a> <a href="http://www.1518.top/tag/%e7%9b%b4%e6%92%ad%e5%b8%a6%e8%b4%a7" class="tag-cloud-link tag-link-481 tag-link-position-33" style="font-size: 8.4294478527607pt;" aria-label="直播带货 (571 项)">直播带货</a> <a href="http://www.1518.top/tag/%e7%9b%b4%e6%92%ad%e7%9f%ad%e8%a7%86%e9%a2%91" class="tag-cloud-link tag-link-975 tag-link-position-34" style="font-size: 15.042944785276pt;" aria-label="直播短视频 (3,378 项)">直播短视频</a> <a href="http://www.1518.top/tag/%e7%9f%ad%e8%a7%86%e9%a2%91" class="tag-cloud-link tag-link-558 tag-link-position-35" style="font-size: 9.9754601226994pt;" aria-label="短视频 (877 项)">短视频</a> <a href="http://www.1518.top/tag/%e7%a7%81%e5%9f%9f%e7%a4%be%e7%be%a4" class="tag-cloud-link tag-link-2702 tag-link-position-36" style="font-size: 16.331288343558pt;" aria-label="私域社群 (4,769 项)">私域社群</a> <a href="http://www.1518.top/tag/%e7%ad%96%e7%95%a5" class="tag-cloud-link tag-link-601 tag-link-position-37" style="font-size: 13.239263803681pt;" aria-label="策略 (2,081 项)">策略</a> <a href="http://www.1518.top/tag/%e7%bd%91%e7%bb%9c%e8%90%a5%e9%94%80" class="tag-cloud-link tag-link-1549 tag-link-position-38" style="font-size: 20.110429447853pt;" aria-label="网络营销 (13,272 项)">网络营销</a> <a href="http://www.1518.top/tag/%e8%81%8c%e5%9c%ba" class="tag-cloud-link tag-link-607 tag-link-position-39" style="font-size: 8.8588957055215pt;" aria-label="职场 (651 项)">职场</a> <a href="http://www.1518.top/tag/%e8%81%8c%e5%9c%ba%e7%94%9f%e6%b6%af" class="tag-cloud-link tag-link-7244 tag-link-position-40" style="font-size: 16.159509202454pt;" aria-label="职场生涯 (4,583 项)">职场生涯</a> <a href="http://www.1518.top/tag/%e8%90%a5%e9%94%80" class="tag-cloud-link tag-link-602 tag-link-position-41" style="font-size: 20.625766871166pt;" aria-label="营销 (15,305 项)">营销</a> <a href="http://www.1518.top/tag/%e8%a1%8c%e4%b8%9a%e5%8a%a8%e6%80%81" class="tag-cloud-link tag-link-594 tag-link-position-42" style="font-size: 12.036809815951pt;" aria-label="行业动态 (1,510 项)">行业动态</a> <a href="http://www.1518.top/tag/%e8%b5%84%e6%96%99%e4%b8%8b%e8%bd%bd" class="tag-cloud-link tag-link-6047 tag-link-position-43" style="font-size: 13.411042944785pt;" aria-label="资料下载 (2,191 项)">资料下载</a> <a href="http://www.1518.top/tag/%e8%bf%90%e8%90%a5%e6%95%b0%e6%8d%ae" class="tag-cloud-link tag-link-583 tag-link-position-44" style="font-size: 13.754601226994pt;" aria-label="运营数据 (2,372 项)">运营数据</a> <a href="http://www.1518.top/tag/%e8%bf%90%e8%90%a5%e6%96%b9%e6%a1%88" class="tag-cloud-link tag-link-580 tag-link-position-45" style="font-size: 17.963190184049pt;" aria-label="运营方案 (7,486 项)">运营方案</a></div> </div> <div id="recent-posts-2" class="widget widget_recent_entries"> <h5 class="widget-title">近期文章</h5> <ul> <li> <a href="http://www.1518.top/777797.html">淘系运营21天速成班(更新24年7月),0基础轻松搞定淘系运营,不做假把式</a> </li> <li> <a href="http://www.1518.top/777796.html">AI自动生成短视频和图文课程,全方位手把手教学</a> </li> <li> <a href="http://www.1518.top/777795.html">外贸线上实战训练营,拆解外贸的底层逻辑,打破你对外贸的固有认知</a> </li> <li> <a href="http://www.1518.top/777794.html">拼多多日销千单训练营,从0开始带你做好拼多多,让日销千单可以快速复制(更新24年7月)</a> </li> <li> <a href="http://www.1518.top/777793.html">艾敏19天小红书涨粉变现特训营-第7期,快速学会小红书涨粉,月入十万轻松变现!</a> </li> </ul> </div> </div> </div> </div> </div> </main> <!-- **************** MAIN CONTENT END **************** --> <!-- ======================= Footer START --> <footer class="site-footer py-md-4 py-2 mt-2 mt-md-4"> <div class="container"> <div class="row d-none d-lg-flex mb-3"> <div class="col-md-4"> <div class="logo-wrapper"> </div> <div class="logo-wrapper"> <a rel="nofollow noopener noreferrer" href="http://www.1518.top/"><img class="logo regular" data-light="https://sc1688-1302705511.cos.ap-beijing.myqcloud.com/weituike/2024/09/未命名15.png" data-dark="https://sc1688-1302705511.cos.ap-beijing.myqcloud.com/weituike/2024/09/未命名15-1.png" src="https://sc1688-1302705511.cos.ap-beijing.myqcloud.com/weituike/2024/09/未命名15-1.png" alt="资源库"></a></div> <p class="small mb-0">本站提供各类源码、模板、小程序、IT视频等资源,本站所有源码不保证没有任何BUG,源码也仅供有技术能力的开发人员学习研究之用,商用请去官方购买正式商用版!</p> </div> <div class="col-md-2"> <h4 class="widget-title">快速导航</h4> <ul class="list-unstyled widget-links"> <li><a href="http://www.1518.top/user">个人中心</a></li><li><a href="http://www.1518.top/tags">标签云</a></li><li><a href="http://www.1518.top/links">网址导航</a></li> </ul> </div> <div class="col-md-2"> <h4 class="widget-title">关于本站</h4> <ul class="list-unstyled widget-links"> <li><a href="http://www.1518.top/vip-prices">VIP介绍</a></li><li><a href="http://www.1518.top/user/ticket">客服咨询</a></li><li><a href="http://www.1518.top/user/aff">推广计划</a></li> </ul> </div> <div class="col-md-4"> <h4 class="widget-title">联系我们</h4> <div class=""><img width="80" height="80" src="http://www.1518.top/微信号.jpg" style="float: left;" title="二维码"><img width="80" height="80" src="http://www.1518.top/公众号.jpg" style="float: left;" title="二维码">如有BUG或建议可与我们在线联系或关注公众号学习交流。</div> </div> </div> <div class="text-center small w-100"> <div>Copyright © 2017 - 2022 413Z.COM. All RightsReserved.<a href="/" target="_blank">微推客</a> 版权所有 未经允许禁止建立影像</div> <div class=""><a href="https://beian.miit.gov.cn/" target="_blank" rel="noreferrer nofollow">鲁ICP备2021021744号-1</a></div> </div> </div> </footer> <!-- ======================= Footer END --> <!-- Back to top rollbar--> <div class="rollbar"> <ul class="actions"> <li><a target="" href="http://www.1518.top/" rel="nofollow noopener noreferrer"><i class="fas fa-home"></i><span>首页</span></a></li><li><a target="" href="http://www.1518.top/user" rel="nofollow noopener noreferrer"><i class="far fa-user"></i><span>用户中心</span></a></li><li><a target="" href="http://www.1518.top/vip-prices" rel="nofollow noopener noreferrer"><i class="fa fa-diamond"></i><span>会员介绍</span></a></li><li><a target="" href="http://wpa.qq.com/msgrd?v=3&uin=3519798887&site=qq&menu=yes" rel="nofollow noopener noreferrer"><i class="fab fa-qq"></i><span>QQ客服</span></a></li> </ul> </div> <div class="back-top"><i class="fas fa-caret-up"></i></div> <!-- m-navbar --> <div class="m-navbar"> <ul> <li><a target="" href="http://www.1518.top" rel="nofollow noopener noreferrer"><i class="fas fa-home"></i><span>首页</span></a></li><li><a target="" href="http://www.1518.top/tags" rel="nofollow noopener noreferrer"><i class="fas fa-layer-group"></i><span>分类</span></a></li><li><a target="" href="http://www.1518.top/vip-prices" rel="nofollow noopener noreferrer"><i class="far fa-gem"></i><span>会员</span></a></li><li><a target="" href="http://www.1518.top/user" rel="nofollow noopener noreferrer"><i class="fas fa-user"></i><span>我的</span></a></li> </ul> </div> <!-- dimmer--> <div class="dimmer"></div> <div class="off-canvas"> <div class="canvas-close"><i class="fas fa-times"></i></div> <!-- logo --> <div class="logo-wrapper"> <a rel="nofollow noopener noreferrer" href="http://www.1518.top/"><img class="logo regular" data-light="https://sc1688-1302705511.cos.ap-beijing.myqcloud.com/weituike/2024/09/未命名15.png" data-dark="https://sc1688-1302705511.cos.ap-beijing.myqcloud.com/weituike/2024/09/未命名15-1.png" src="https://sc1688-1302705511.cos.ap-beijing.myqcloud.com/weituike/2024/09/未命名15-1.png" alt="资源库"></a></div> <div class="mobile-menu d-block d-lg-none"></div> </div> <script type="speculationrules"> {"prefetch":[{"source":"document","where":{"and":[{"href_matches":"\/*"},{"not":{"href_matches":["\/wp-*.php","\/wp-admin\/*","\/weituike\/*","\/wp-content\/*","\/wp-content\/plugins\/*","\/wp-content\/themes\/ripro-v5\/*","\/*\\?(.+)"]}},{"not":{"selector_matches":"a[rel~=\"nofollow\"]"}},{"not":{"selector_matches":".no-prefetch, .no-prefetch a"}}]},"eagerness":"conservative"}]} </script> <script src="http://www.1518.top/wp-content/plugins/Pure-Highlightjs-master/highlight/highlight.pack.js?ver=0.9.2" id="pure-highlightjs-pack-js"></script> <script src="http://www.1518.top/wp-content/themes/ripro-v5/assets/js/highlight.min.js?ver=11.7.0" id="highlight-js"></script> <script src="http://www.1518.top/wp-content/themes/ripro-v5/assets/js/vendor.min.js?ver=8.2" id="vendor-js"></script> <script id="main-js-extra"> var zb = {"home_url":"http:\/\/www.1518.top","ajax_url":"http:\/\/www.1518.top\/wp-admin\/admin-ajax.php","theme_url":"http:\/\/www.1518.top\/wp-content\/themes\/ripro-v5","singular_id":"46099","post_content_nav":"0","site_popup_login":"1","site_notify_auto":"0","current_user_id":"0","ajax_nonce":"eeb0605711","gettext":{"__copypwd":"\u5bc6\u7801\u5df2\u590d\u5236\u526a\u8d34\u677f","__copybtn":"\u590d\u5236","__copy_succes":"\u590d\u5236\u6210\u529f","__comment_be":"\u63d0\u4ea4\u4e2d...","__comment_succes":"\u8bc4\u8bba\u6210\u529f","__comment_succes_n":"\u8bc4\u8bba\u6210\u529f\uff0c\u5373\u5c06\u5237\u65b0\u9875\u9762","__buy_be_n":"\u8bf7\u6c42\u652f\u4ed8\u4e2d\u00b7\u00b7\u00b7","__buy_no_n":"\u652f\u4ed8\u5df2\u53d6\u6d88","__is_delete_n":"\u786e\u5b9a\u5220\u9664\u6b64\u8bb0\u5f55\uff1f"}}; </script> <script src="http://www.1518.top/wp-content/themes/ripro-v5/assets/js/main.min.js?ver=8.2" id="main-js"></script> <script src="http://www.1518.top/wp-includes/js/comment-reply.min.js?ver=6.8.1" id="comment-reply-js" async data-wp-strategy="async"></script> <!-- 自定义js代码 统计代码 --> <!-- 自定义js代码 统计代码 END --> </body> </html>