个人网站制作过程-Linux大棚

admin 管理员组

文章数量: 1184232

2024年2月6日发(作者：sql数据库2008安装步骤)

个人网站制作流程

一、站建设方案书的内容

个人网站建设方案书是将个人网站建设成为一个优质网站首先要考虑，网站建设方案能反应出网站的建设构想，初步形态及网站推广计划。个人网站建设方案适合个体户和中小型企业，它有自己独特的风格设计。风格设计主要体现在本人个性特点的凸显，分析.策划并制定出一套适合自身的网站建设的设计风格方案。设计首页要明确主次，主要的可放在显要位置、加粗或变颜色等，再列出最吸引浏览者的信息以及内容，用最精炼的语言表达出浏览者想了解的信息。

二、建站目的及功能定位

对于个人网站建设前期的定位是相当重要，你必须了解你做这个网站的目的，是为了宣传自己还是展示自己的爱好，本人感觉最好是定位在自己感兴趣或者自己工作的行业中，这样自己可能会对所确定的主题行业了解的更多些，很多人在建站初期总是喜欢在主页里堆积大量感兴趣的内容，但个人的精力总是有限的，因为无力维护而导致站点更新缓慢、内容匮乏，与其这样，不如选定一个主题做出自己的风格，不求大而全，但求小而精。

三、网站主要内容介绍：

1.构成网页的基本要素

1.1文字（标题、字号、字型...）

1.2 图形（网页上经常使用的图片格式：jpg、jpeg、Gif、）

1.3.交互功能（菜单按钮、链接、表单、数据交换...）

超文本标识语言（HTML）

HTML（Hypertext Markup Language）是一种专门用于Web页制作的编程语言，用来描述超文本各个部分的内容，告诉浏览器如何显示文本，怎样生成与别的文本或图像的链接点。

在HTML中，所有的标记符都用尖括号括起来。

例如，表示HTML标记符。绝大多数标记符都是成对出现的，包括开始标记符和结束标记符。

如：…<／HTML> .

HTML文档的基本结构

一个典型的HTML文本的基本结构形式如下：

网站制作流程及界面交互设计研究探讨<／TITLE> </p><p style="text-indent: 2em;";><／HEAD> </p><p style="text-indent: 2em;";><BODY>文本内容：<／BODY> </p><p style="text-indent: 2em;";><／HTML> </p><p style="text-indent: 2em;";>2制作及美化的基本工具 </p><p style="text-indent: 2em;";>2.11．超文本标识语言（HTML） </p><p style="text-indent: 2em;";>编辑工具：editplus、dreamweaver、记事本、FrontPage、 </p><p style="text-indent: 2em;";>2.2．页面设计及美化工具 </p><p style="text-indent: 2em;";>使用工具：所有可制作平面的软件 </p><p style="text-indent: 2em;";>推荐使用Photoshop、FireWorks、Flash </p><p style="text-indent: 2em;";> </p><p style="text-indent: 2em;";>3、网页制作的基本步骤 </p><p style="text-indent: 2em;";>3.1、整体规划 </p><p style="text-indent: 2em;";>需要完成的规划：网站主题、风格、页面元素、逻辑结构等 </p><p style="text-indent: 2em;";>3.2、资料收集 </p><p style="text-indent: 2em;";>收集内容： </p><p style="text-indent: 2em;";>a、跟主题相关的文字图片资料 </p><p style="text-indent: 2em;";>b、一些优秀的页面风格 </p><p style="text-indent: 2em;";>c、下载一些你喜欢的交互页面 </p><p style="text-indent: 2em;";>d、开放的源代码 </p><p style="text-indent: 2em;";>3.3、伪界面设计 </p><p style="text-indent: 2em;";>根据事先规划的结构，在平面软件里设计你想要的最终效果，利用平面图片的形式先展示一次，设计时要注意宜人性、人机、心理等各方面因素 </p><p style="text-indent: 2em;";>3.4、代码转换及交互添加 </p><p style="text-indent: 2em;";>把平面的伪界面转化为HTML代码，添加相应的交互功能Js、按纽、表单，以及一些与数据库相连接的代码。 </p><p style="text-indent: 2em;";>3.5、测试网页兼容性 </p><p style="text-indent: 2em;";>你可以不必严格按照W3C标准来制作页面，但是你必须保证让所有现有的浏览器能比较好的展示你的作品。 </p><p style="text-indent: 2em;";>3.6、发布站点 </p><p style="text-indent: 2em;";>测试完毕，符合你的要求，当然就可以开始发布你的网站了，发布的服务器可以是远程，也可以是本地，各个语言有各自的相应的服务器，比如ASP，就应该对应的是ASP服务器，上传可利用远程FTP工具。 </p><p style="text-indent: 2em;";>4、界面设计及交互研究探讨 </p><p style="text-indent: 2em;";>4.1、导航栏设计 </p><p style="text-indent: 2em;";>导航要素设计的好坏决定着用户是否能方便使用网站导航要素要设计的直接而明确，并最大限度为用户的方便考虑。 </p><p style="text-indent: 2em;";>4.2、网页布局 </p><p style="text-indent: 2em;";>网页的布局是整个界面的核心，这里体现了一切以用户为中心、以及制作者如何与欣赏着沟通的思想在里面，你必须知道自己要传达什么样的信息，别人使用起来合适不，字体的大小、型号、字间距、行间距，以及配色所有的一切都在这个阶段完成，所以如何表现功能以及美感就是你研究的重点。 </p><p style="text-indent: 2em;";>PS:布局之前要紧密连接你网站的主题，要注意把握整体风格，你可以事先在纸上勾画草图，利用你习惯的元素来表现你想要的效果 </p><p style="text-indent: 2em;";>网页布局--主要构成原则 </p><p style="text-indent: 2em;";>醒目性：指用户把注意力集中到你诱导起浏览的部分和内容 </p><p style="text-indent: 2em;";>可读性：指网站的内容让人容易读懂 </p><p style="text-indent: 2em;";>明快性：指准确、快速转达网站的构成内容 </p><p style="text-indent: 2em;";>造型性：维持整体外型上的稳定感和均衡性 </p><p style="text-indent: 2em;";>创造性：有鲜明个性，创意是必不可少的 </p><p style="text-indent: 2em;";>布局的构成原则上是:统一、协调、流动、强调、均衡 </p><p style="text-indent: 2em;";>4.3、交互研究 </p><p style="text-indent: 2em;";>我这边的交互主要集中在人机操作方面，研究用户浏览网站心理我个人认为一个成功的个人主页，单纯的美观是不够的，重要的是宜人性方面应该注重，喜欢Google、Douban就居于这。 </p><p style="text-indent: 2em;";>5、实例制作演示(略） </p><p style="text-indent: 2em;";>5.1、页面制作整体规划 </p><p style="text-indent: 2em;";>对象：一个打印商业宣传主页 </p><p style="text-indent: 2em;";>格调:活泼，色彩，简单，大方 </p><p style="text-indent: 2em;";>5.2、资料收集 </p><p style="text-indent: 2em;";>a 、商标、网址、公司宣传册、了解企业文化，了解负责人的品位、他们的案例、跟负责人沟通掌握信息 </p><p style="text-indent: 2em;";>b 、网上下载相似印刷行业的公司主页，了解现有行业的的一些设计特点 </p><p style="text-indent: 2em;";>c、下载一些色彩比较华丽的图片，或跟印刷相关连的图片 </p><p style="text-indent: 2em;";>d、如果你自己不会动态语言，下载一个满足你功能的新闻发布系统和留言源码 </p><p style="text-indent: 2em;";>5.3、伪界面设计 </p><p style="text-indent: 2em;";>a、在PS设计伪界面 </p><p style="text-indent: 2em;";>b、切片工具对整体进行合理的分割 </p><p style="text-indent: 2em;";>注意点：隐藏你要通过输入的文字，分割时要保持他的整体意义，尽量让每一部分是完整的，注意一些交互上操作。 </p><p style="text-indent: 2em;";>c、导成WEB格式-直接导成HTML格式—步骤: </p><p style="text-indent: 2em;";>1、.点击文件存储为WEB文件格式 </p><p style="text-indent: 2em;";>2、在界面里面调整理想参数 </p><p style="text-indent: 2em;";>3、导出保存PS能自动生成一些HTML代码，但是他不是很标准，你必须在Dreamweave里面进行加工 </p><p style="text-indent: 2em;";>d、在Dreamweave里面进行代码加工 </p><p style="text-indent: 2em;";>具体步骤： </p><p style="text-indent: 2em;";>1、先修改标题 </p><p style="text-indent: 2em;";>2、修改页面属性：背景颜色、背景图片..... </p><p style="text-indent: 2em;";>3、把页面调整为布局格式（这个可以按照自己习惯来设置，有标准的表格方式，也有布局类型） </p><p style="text-indent: 2em;";>5.4、把要添加文字的图片转化为背景形式 </p><p style="text-indent: 2em;";> a、找到对应图片路径 </p><p style="text-indent: 2em;";> b、拷贝路径后删除图片 </p><p style="text-indent: 2em;";> c、转化为标准形式 </p><p style="text-indent: 2em;";> d、把路径粘贴到背景属性上 </p><p style="text-indent: 2em;";> e、回到布局界面 </p><p style="text-indent: 2em;";>5.5、添加具体文字连接设置等操作 </p><p style="text-indent: 2em;";>5.6、CSS设置 </p><p style="text-indent: 2em;";>5.7、修整代码，发布预览按F12即可预览效果 </p><p style="text-indent: 2em;";>4、测试网页兼容性 </p><p style="text-indent: 2em;";>按照你设计时的对象,根据IE版本以及浏览器的不同，调整理想的效果，但是大部分出现问题的是JSVB等代码，如果只是单纯静态图片，基本不会有很大的差别，推选大家尽量往W3C标准靠 </p><p style="text-indent: 2em;";>5、发布站点 </p><p style="text-indent: 2em;";>购买自己的空间域名，其实事先就应该购买的，利用FTP上传软件，把你的页面上传到你的网上服务器上推荐一款FTP上传工具 </p><p style="text-indent: 2em;";> </p><p style="text-indent: 2em;";>四，具体设计过程 </p><p style="text-indent: 2em;";>个人在设计时考虑的多为个人的兴趣喜好，而不注重商业的展示。内容以反映个人为中心，从而使个人网站真正的成为展示自己的网络名片。在网页制作中，我借鉴了韩国个人网站的设计风格，着重于给浏览者以强烈的视觉冲击。运用了photoshop和fireworks强大的图像制作和处理能力。进行了大量的图片制作，从而给人以强烈的美感。并利用Flash进行片头动画的制作，给予浏览者一种强烈的时代动感。整个网站的架构是由Dreamwave完成的。 </p><p style="text-indent: 2em;";>、在这次课业中我制作了关于自己的网页，下面介绍下制作过程。首先使用Dreamweaver8来创建站点。打开Dreamweaver8软件，执行站点- 站点管理命令，在弹出的站点管理对话框中选择新建，然后创建站点存放到我的文档，然后设置地址为。站点创建完成后，在Dreamweaver8软件右侧就会出现站点资源列表，然后我分别建立了images、Scripts、和若干子文件，主要用于存放主网站架构图片、音乐、日志链接模块素材、网络模块素材、照片匣子模块素材。 </p><p style="text-indent: 2em;";> </p><p style="text-indent: 2em;";>要领一：确定网站主题 </p><p style="text-indent: 2em;";>做网站，首先必须要解决的就是网站内容问题，即确定网站的主题。兴趣是制作网站的动力，没有创作热情，很难设计制作出优秀的作品。对于内容主题的选择，要做到小而精，主题定位要小，内容要精。不要去试图制作一个包罗万象的站点，这往往会失去网站的特色，也会带来高强度的劳动，给网站的及时更新带来困难。记住：在互联网上只有第一，没有第二！ </p><p style="text-indent: 2em;";> </p><p style="text-indent: 2em;";>要领二：选择好域名 </p><p style="text-indent: 2em;";>域名是网站在互联网上的名字。一个非产品推销的纯信息服务网站，其所有建设的价值，都凝结在其网站域名之上。失去这个域名，所有前期工作就将全部落空。要把域名起得形象、简单、易记。 </p><p style="text-indent: 2em;";> </p><p style="text-indent: 2em;";>要领三：掌握建网工具 </p><p style="text-indent: 2em;";> </p><p style="text-indent: 2em;";>网络技术的发展带动了软件业的发展，所以用于制作Web页面的工具软件也越来越丰富。从最基本的HTML编辑器到现在非常流行的Flash互动网页制作工具，各种各样的Web页面制作工具。 </p><p style="text-indent: 2em;";> </p><p style="text-indent: 2em;";>要领四：确定网站界面 </p><p style="text-indent: 2em;";>界面就是网站给浏览者的第一印象，往往决定着网站的可看性，在确定网站的界面时要注意以下三点： </p><p style="text-indent: 2em;";>①栏目与板块编排 </p><p style="text-indent: 2em;";>②目录结构与链接结构 </p><p style="text-indent: 2em;";>③进行形象设计 </p><p style="text-indent: 2em;";> </p><p style="text-indent: 2em;";>要领五：确定网站风格 </p><p style="text-indent: 2em;";>“风格”是抽象的，是指站点的整体形象给浏览者的综合感受。这个“整体形象”包括站点的CI（标志，色彩，字体，标语）、版面布局、浏览方式、交互性、文字、语气、内容价值等等</p><p style="text-indent: 2em;";>诸多因素，网站可以是平易近人的、生动活泼的也可以是专业严肃的。不管是色彩、技术、文字、布局，还是交互方式，只要你能由此让浏览者明确分辨出这是你网站独有的，这就形成了网站的“风格”。风格是有人性的，通过网站的色彩、技术、文字、布局、交互方式可以概括出一个站点的个性：是粗犷豪放的，还是清新秀丽的；是温文儒雅的，还是执著热情的；是活泼易变的，还是墨守成规的。总之，有风格的网站与普通网站的区别在于：在普通网站上你看到的只是堆砌在一起的信息，你只能用理性的感受来描述，比如信息量多少，浏览速度快慢等；在有风格的网站上你可以获得除内容之外的更感性的认识，比如站点的品位，对浏览者的态度等。 </p><p style="text-indent: 2em;";> </p><p style="text-indent: 2em;";>要领六：有创意的内容选择 </p><p style="text-indent: 2em;";>好的内容选择需要有好的创意，作为网页设计制作者，最苦恼的就是没有好的内容创意。网络上的最多的创意即是来自于虚拟同现实的结合。创意的目的是为了更好的宣传与推广网站，如果创意很好，却对网站发展毫无意义，那么，网站设计制作者也应当放弃这个创意。另外，主页内容是网站的根本之所在，如果内容空洞，即使页面制作地再怎样精美，仍然不会有多少用户。从根本上说，网站内容仍然左右着网站流量，内容为王（Content Is King）依然是个人网站成功的关键。 </p><p style="text-indent: 2em;";> </p><p style="text-indent: 2em;";>要领七：推广自己的网站 </p><p style="text-indent: 2em;";>网站的推广有以下几种方式： </p><p style="text-indent: 2em;";>（1）搜索引擎注册与搜索目录登录技巧 </p><p style="text-indent: 2em;";>（2）广告交换技巧 </p><p style="text-indent: 2em;";>（3）目标电子邮件推广 </p><p style="text-indent: 2em;";> </p><p style="text-indent: 2em;";>要领八：支撑网站日常运行 </p><p style="text-indent: 2em;";> </p><p style="text-indent: 2em;";>通常来说，个人网站获取资金通常有以下两个渠道： </p><p style="text-indent: 2em;";>（1）销售网站的广告位 </p><p style="text-indent: 2em;";>（2）与大型网站合作 </p><p style="text-indent: 2em;";> </p><p style="text-indent: 2em;";>五、总结语 </p><p style="text-indent: 2em;";>在整个的学习过程中，我学习了Flash、Dreamwave、Fireworks、Html语言、IIS、网站建设的基本思想等重要内容。到现在为止，我还是很庆幸能够学到这么多的内容。整个网站的制作是我一个人完成的。虽然整个网页的结构还有很多不足，还有一些板块没有开通，但是我的确能够感到在我制作过程中技能的提高。整个网站的不足我想是没有使用到一些动态网页的知识，使得日后网站的维护较为繁杂。希望明年可以选到动态网站的课程，从而弥补自己在动态网络语言方面的不足。 </p><p style="text-indent: 2em;";> </p></div><br><p><h2></h2></p>  <p class="tag"> 本文标签： <a style="margin-right: 10px" href="/tag/455.html" target="_blank">网站</a> <a style="margin-right: 10px" href="/tag/532.html" target="_blank">制作</a> <a style="margin-right: 10px" href="/tag/798.html" target="_blank">内容</a> <a style="margin-right: 10px" href="/tag/394.html" target="_blank">设计</a> </p> <div class="roclinux-cn copyright"> <blockquote> <p> 版权声明：本文标题：个人网站制作过程内容由网友自发贡献，该文观点仅代表作者本人，转载请联系作者并注明出处：<a href="http://www.roclinux.cn/p/1707204950a512279.html">http://www.roclinux.cn/p/1707204950a512279.html</a>，本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。 </p> </blockquote> </div> </div> <div class="roclinux-cn block-wrap single-relative"> <h2 class="block-title"> 更多相关文章 </h2> <div class="roclinux-cn post-list"> <div class="roclinux-cn post-item">         <a href="/b/1767918090a3517811.html" class="post-item-title" title="电子书免费下载网站哪些"> <h3>电子书免费下载网站哪些</h3> <div class="roclinux-cn post-item-cover" style="display:inline-grid"> <ul class="post-categories"> <li> <a href="/b" target="_blank">编程</a> </li> </ul> </div> </a> <div class="roclinux-cn post-item-footer"> <div class="roclinux-cn tag-wrap"> </div> <div class="roclinux-cn post-item-meta">2月前</div> </div> <p class="post-item-summary">免费电子书下载网站全攻略一、综合类资源平台（一网打尽）1. Z-Library（全球最大电子书库）特点：收录超 1000 万册图书</p> </div> <div class="roclinux-cn post-item">         <a href="/b/1767946912a3520717.html" class="post-item-title" title="企业bpm业务流程管理系统网站如何在外网访问?"> <h3>企业bpm业务流程管理系统网站如何在外网访问?</h3> <div class="roclinux-cn post-item-cover" style="display:inline-grid"> <ul class="post-categories"> <li> <a href="/b" target="_blank">编程</a> </li> </ul> </div> </a> <div class="roclinux-cn post-item-footer"> <div class="roclinux-cn tag-wrap"> </div> <div class="roclinux-cn post-item-meta">2月前</div> </div> <p class="post-item-summary">企业在已有ERP系统的基础上去实施BPM业务流程管理系统，是非常有必要的。什么是BPM业务流程管理系统呢？BPM是英文BPM-Business Process Management的缩写&</p> </div> <div class="roclinux-cn post-item">         <a href="/b/1768021546a3526911.html" class="post-item-title" title="C# webkit 内核浏览器访问https网站显示空白或者提示 Problem with the SSL CA cert (path? access rights?)"> <h3>C# webkit 内核浏览器访问https网站显示空白或者提示 Problem with the SSL CA cert (path? access rights?)</h3> <div class="roclinux-cn post-item-cover" style="display:inline-grid"> <ul class="post-categories"> <li> <a href="/b" target="_blank">编程</a> </li> </ul> </div> </a> <div class="roclinux-cn post-item-footer"> <div class="roclinux-cn tag-wrap"> </div> <div class="roclinux-cn post-item-meta">2月前</div> </div> <p class="post-item-summary">如题解决方法： 安装中文路径，经常出现问题。改下安装路径。只需要动态链接库所在路径上没有中文字符，webkit内核浏览器就可以访问https网址。转自&</p> </div> <div class="roclinux-cn post-item">         <a href="/p/1768686434a3533070.html" class="post-item-title" title="全面指南：如何在各种操作系统和软件中屏蔽不受欢迎的网站"> <h3>全面指南：如何在各种操作系统和软件中屏蔽不受欢迎的网站</h3> <div class="roclinux-cn post-item-cover" style="display:inline-grid"> <ul class="post-categories"> <li> <a href="/p" target="_blank">技术日记</a> </li> </ul> </div> </a> <div class="roclinux-cn post-item-footer"> <div class="roclinux-cn tag-wrap"> </div> <div class="roclinux-cn post-item-meta">2月前</div> </div> <p class="post-item-summary"></p> </div> <div class="roclinux-cn post-item">         <a href="/p/1769370285a3533532.html" class="post-item-title" title="深入理解启用Cookies：让网络浏览更智能与安全的关键"> <h3>深入理解启用Cookies：让网络浏览更智能与安全的关键</h3> <div class="roclinux-cn post-item-cover" style="display:inline-grid"> <ul class="post-categories"> <li> <a href="/p" target="_blank">技术日记</a> </li> </ul> </div> </a> <div class="roclinux-cn post-item-footer"> <div class="roclinux-cn tag-wrap"> </div> <div class="roclinux-cn post-item-meta">2月前</div> </div> <p class="post-item-summary">body { font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; line-height: 1.6; color: #333; max-width:</p> </div> <div class="roclinux-cn post-item">         <a href="/p/1770518639a3534571.html" class="post-item-title" title="信刻国产化智能解决方案：构建高效、安全的档案智能光盘库系统！"> <h3>信刻国产化智能解决方案：构建高效、安全的档案智能光盘库系统！</h3> <div class="roclinux-cn post-item-cover" style="display:inline-grid"> <ul class="post-categories"> <li> <a href="/p" target="_blank">技术日记</a> </li> </ul> </div> </a> <div class="roclinux-cn post-item-footer"> <div class="roclinux-cn tag-wrap"> </div> <div class="roclinux-cn post-item-meta">1月前</div> </div> <p class="post-item-summary">在数字化时代，数据的长期安全储存和管理成为各行业档案部门的重要任务，随着光盘存储技术的不断发展和应用领域的日益广泛，如何高效、安全地管理海量光盘数据成为了一个亟待解决的问题。信刻智能光盘管理柜应运而生，以其创新的设计理念和强大的功能，</p> </div> <div class="roclinux-cn post-item">         <a href="/p/1770720719a3536837.html" class="post-item-title" title="畅游无阻：探索Chrome浏览器中的神奇快捷键，提升工作效率"> <h3>畅游无阻：探索Chrome浏览器中的神奇快捷键，提升工作效率</h3> <div class="roclinux-cn post-item-cover" style="display:inline-grid"> <ul class="post-categories"> <li> <a href="/p" target="_blank">技术日记</a> </li> </ul> </div> </a> <div class="roclinux-cn post-item-footer"> <div class="roclinux-cn tag-wrap"> </div> <div class="roclinux-cn post-item-meta">1月前</div> </div> <p class="post-item-summary">Chrome快捷键整理 1、Chrome窗口和标签页快捷键： Ctrl+N 打开新窗口 Ctrl+T 打开新标签页 Ctrl+Shift+N 在隐身模式下打开新窗口 Ctrl+O，然后选择文件</p> </div> <div class="roclinux-cn post-item">         <a href="/p/1770804438a3537762.html" class="post-item-title" title="从零开始学StickyNotes：基于Flash中心与Adobe Flash Player的完整指南"> <h3>从零开始学StickyNotes：基于Flash中心与Adobe Flash Player的完整指南</h3> <div class="roclinux-cn post-item-cover" style="display:inline-grid"> <ul class="post-categories"> <li> <a href="/p" target="_blank">技术日记</a> </li> </ul> </div> </a> <div class="roclinux-cn post-item-footer"> <div class="roclinux-cn tag-wrap"> </div> <div class="roclinux-cn post-item-meta">1月前</div> </div> <p class="post-item-summary">StickyNotes 开源项目教程项目介绍 StickyNotes 是一个桌面便签应用程序，旨在为用户提供一个易于管理和自定义的便签工具。该项目支持语音识别功能，并能够通过 Google Drive 同步便签内容，</p> </div> <div class="roclinux-cn post-item">         <a href="/b/1771124080a3541055.html" class="post-item-title" title="深入剖析计算服务器：揭秘Adobe Flash Player背后的Swf与Flash中心"> <h3>深入剖析计算服务器：揭秘Adobe Flash Player背后的Swf与Flash中心</h3> <div class="roclinux-cn post-item-cover" style="display:inline-grid"> <ul class="post-categories"> <li> <a href="/b" target="_blank">编程</a> </li> </ul> </div> </a> <div class="roclinux-cn post-item-footer"> <div class="roclinux-cn tag-wrap"> </div> <div class="roclinux-cn post-item-meta">1月前</div> </div> <p class="post-item-summary">IT产品线全景架构：从产品树、组件库到工艺森林本框架旨在系统性地解构整个IT硬件世界。它将遵循一个从宏观到微观、从应用到物理的“三层架构”：产品树：按产品形态和用途划分的终端产品类别。</p> </div> <div class="roclinux-cn post-item">         <a href="/b/1771412741a3544329.html" class="post-item-title" title="让 Mercury MW305R 拥抱现代科技！深度解读 SWF 到 LEDE（OpenWRT）改造秘籍"> <h3>让 Mercury MW305R 拥抱现代科技！深度解读 SWF 到 LEDE（OpenWRT）改造秘籍</h3> <div class="roclinux-cn post-item-cover" style="display:inline-grid"> <ul class="post-categories"> <li> <a href="/b" target="_blank">编程</a> </li> </ul> </div> </a> <div class="roclinux-cn post-item-footer"> <div class="roclinux-cn tag-wrap"> </div> <div class="roclinux-cn post-item-meta">1月前</div> </div> <p class="post-item-summary">说明1. 改造 Mercury MW305R v3.0（芯片 9533）2. OpenWRT 版本：LEDE 173. 环境：Ubuntu 16.04 x64 第一步：修改硬件1. 换 RAN</p> </div> <div class="roclinux-cn post-item">         <a href="/b/1771413353a3544337.html" class="post-item-title" title="梅鲁里亚MW305R V3.0路由器的LEDE（OpenWRT）之旅：从新手到大神的进阶之路"> <h3>梅鲁里亚MW305R V3.0路由器的LEDE（OpenWRT）之旅：从新手到大神的进阶之路</h3> <div class="roclinux-cn post-item-cover" style="display:inline-grid"> <ul class="post-categories"> <li> <a href="/b" target="_blank">编程</a> </li> </ul> </div> </a> <div class="roclinux-cn post-item-footer"> <div class="roclinux-cn tag-wrap"> </div> <div class="roclinux-cn post-item-meta">1月前</div> </div> <p class="post-item-summary">说明1. 改造 Mercury MW305R v3.0（芯片 9533）2. OpenWRT 版本：LEDE 173. 环境：Ubuntu 16.04 x64 第一步：修改硬件1. 换 RAN</p> </div> <div class="roclinux-cn post-item">         <a href="/p/1771929740a3550186.html" class="post-item-title" title="Word2016高手秘籍：一招解决非首页起始页码的问题"> <h3>Word2016高手秘籍：一招解决非首页起始页码的问题</h3> <div class="roclinux-cn post-item-cover" style="display:inline-grid"> <ul class="post-categories"> <li> <a href="/p" target="_blank">技术日记</a> </li> </ul> </div> </a> <div class="roclinux-cn post-item-footer"> <div class="roclinux-cn tag-wrap"> </div> <div class="roclinux-cn post-item-meta">1月前</div> </div> <p class="post-item-summary">我们编辑word文档时，有时候希望页码不是在第一页开始标记。比如，文档可能会有封面，目录，概述等，而我们希望页码的标记从正文开始，而不是从封面开始。实际上操作方法很简单。假设我们从第4页开始设置页码，也就是将第4页作为第1页。步骤1：将鼠</p> </div> <div class="roclinux-cn post-item">         <a href="/p/1772102048a3552151.html" class="post-item-title" title="揭秘Adode Flash Player背后的秘密武器：精通dump文件"> <h3>揭秘Adode Flash Player背后的秘密武器：精通dump文件</h3> <div class="roclinux-cn post-item-cover" style="display:inline-grid"> <ul class="post-categories"> <li> <a href="/p" target="_blank">技术日记</a> </li> </ul> </div> </a> <div class="roclinux-cn post-item-footer"> <div class="roclinux-cn tag-wrap"> </div> <div class="roclinux-cn post-item-meta">1月前</div> </div> <p class="post-item-summary">Dump文件的基本概念 Dump文件是系统或应用程序在发生严重错误（如崩溃或蓝屏）时生成的快照文件，记录了故障发生时的内存状态、线程堆栈、寄存器值等关键信息。其核心作用是为调试人员提供故障现场的静态数据，帮助定位根本原因。</p> </div> <div class="roclinux-cn post-item">         <a href="/p/1772360662a3555043.html" class="post-item-title" title="再也不用担心丢失！轻松捕获网页上任何Flash内容"> <h3>再也不用担心丢失！轻松捕获网页上任何Flash内容</h3> <div class="roclinux-cn post-item-cover" style="display:inline-grid"> <ul class="post-categories"> <li> <a href="/p" target="_blank">技术日记</a> </li> </ul> </div> </a> <div class="roclinux-cn post-item-footer"> <div class="roclinux-cn tag-wrap"> </div> <div class="roclinux-cn post-item-meta">1月前</div> </div> <p class="post-item-summary">如何永久保存网页视频？这款神器让你告别在线依赖你是否遇到过这样的情况：精心收藏的网页视频突然失效，旅行途中想重温课程却遭遇网络中断，或者想保存重要会议录像却找不到下载按钮？网页视频保存正成为我们数字生活中不可或缺的技能。今天</p> </div> <div class="roclinux-cn post-item">         <a href="/p/1772393560a3555428.html" class="post-item-title" title="Ping和浏览的错位：虚拟机内网路问题解析"> <h3>Ping和浏览的错位：虚拟机内网路问题解析</h3> <div class="roclinux-cn post-item-cover" style="display:inline-grid"> <ul class="post-categories"> <li> <a href="/p" target="_blank">技术日记</a> </li> </ul> </div> </a> <div class="roclinux-cn post-item-footer"> <div class="roclinux-cn tag-wrap"> </div> <div class="roclinux-cn post-item-meta">1月前</div> </div> <p class="post-item-summary">今天弄了个虚拟机，结果发现不能上网，可以ping通，但是浏览器打不开网页，网络上搜索了一下按下面方法进行检查：ping www.球最大的中文搜索网站.com 查看网络是</p> </div> <div class="roclinux-cn post-item">         <a href="/p/1772589030a3557060.html" class="post-item-title" title="剪切助手：帮你一键搞定SWF文件处理，轻松操作！"> <h3>剪切助手：帮你一键搞定SWF文件处理，轻松操作！</h3> <div class="roclinux-cn post-item-cover" style="display:inline-grid"> <ul class="post-categories"> <li> <a href="/p" target="_blank">技术日记</a> </li> </ul> </div> </a> <div class="roclinux-cn post-item-footer"> <div class="roclinux-cn tag-wrap"> </div> <div class="roclinux-cn post-item-meta">1月前</div> </div> <p class="post-item-summary">大家好，我是程序员鱼皮。好消息，好消息，我们的新产品又又又又上线啦！这次，我们做的是一款桌面端软件，号称 “颜值天花板” 的超级剪切板工具《剪切助手》。官网下载：这</p> </div> <div class="roclinux-cn post-item">         <a href="/b/1773195185a3559261.html" class="post-item-title" title="C盘空间不够用了？学会这些技巧，轻松清理临时文件"> <h3>C盘空间不够用了？学会这些技巧，轻松清理临时文件</h3> <div class="roclinux-cn post-item-cover" style="display:inline-grid"> <ul class="post-categories"> <li> <a href="/b" target="_blank">编程</a> </li> </ul> </div> </a> <div class="roclinux-cn post-item-footer"> <div class="roclinux-cn tag-wrap"> </div> <div class="roclinux-cn post-item-meta">23天前</div> </div> <p class="post-item-summary">C盘瘦身秘籍：全面清理临时文件的实战指南在我们日常使用电脑的过程中，C盘作为系统盘，往往会积累大量的临时文件。这些文件虽然对日常操作影响不大，但长期积累会占用宝贵的硬盘空间，影响系统性能。本文将详细介绍如何找到并清理C盘中的</p> </div> <div class="roclinux-cn post-item">         <a href="/b/1773639058a3564245.html" class="post-item-title" title="立即行动：快速清理 SYSTEM VOLUME INFORMATION，让电脑运行如新！"> <h3>立即行动：快速清理 SYSTEM VOLUME INFORMATION，让电脑运行如新！</h3> <div class="roclinux-cn post-item-cover" style="display:inline-grid"> <ul class="post-categories"> <li> <a href="/b" target="_blank">编程</a> </li> </ul> </div> </a> <div class="roclinux-cn post-item-footer"> <div class="roclinux-cn tag-wrap"> </div> <div class="roclinux-cn post-item-meta">18天前</div> </div> <p class="post-item-summary">快速体验打开输入框内输入如下内容：快速开发一个SYSTEM VOLUME INFORMATION清理工具原型，基本功能包括：1. 简单文件扫描；2. 按大小日期筛选；3. 预览删除内容；4. 一键清理</p> </div> <div class="roclinux-cn post-item">         <a href="/b/1773975079a3567874.html" class="post-item-title" title="Kali Linux双系统安装指南"> <h3>Kali Linux双系统安装指南</h3> <div class="roclinux-cn post-item-cover" style="display:inline-grid"> <ul class="post-categories"> <li> <a href="/b" target="_blank">编程</a> </li> </ul> </div> </a> <div class="roclinux-cn post-item-footer"> <div class="roclinux-cn tag-wrap"> </div> <div class="roclinux-cn post-item-meta">14天前</div> </div> <p class="post-item-summary">下面文章多为图片形式，每个图片中包含详细的步骤所用工具16G的U盘一个，电脑一台所有的软件均已上传至，提取码：ckj1 kali镜像文件版本：kali-l</p> </div> <div class="roclinux-cn post-item">         <a href="/b/1774289319a3570020.html" class="post-item-title" title="黑鲨官网装机大师工具如何制作u盘启动盘，u盘启动盘制作方法_黑鲨装机大师u盘启动安装教程"> <h3>黑鲨官网装机大师工具如何制作u盘启动盘，u盘启动盘制作方法_黑鲨装机大师u盘启动安装教程</h3> <div class="roclinux-cn post-item-cover" style="display:inline-grid"> <ul class="post-categories"> <li> <a href="/b" target="_blank">编程</a> </li> </ul> </div> </a> <div class="roclinux-cn post-item-footer"> <div class="roclinux-cn tag-wrap"> </div> <div class="roclinux-cn post-item-meta">11天前</div> </div> <p class="post-item-summary">想要u盘重装系统的话,就需要先制作u盘启动盘.那么如何制作u盘启动盘呢?我们可以借助一些工具实现,比如说黑鲨装机大师工具.下面小编就教下大家. 1.插入U盘，然后打开黑鲨装机大师，在“U盘启动”的选项下，点击进入“U盘模</p> </div> </div> </div> <div class="roclinux-cn comments"> <div class="roclinux-cn postcomm block-wrap" id="divCommentPost"> <h2 class="block-title"> 发表评论 </h2> <form id="saypl" target="_self" method="post" name="saypl" action="/comment/create/512279.html?safe_token=2mHFymYQD6zxqdRojp74V0rq2XzjqAQraflCeJdByxk8HBirTqnCBUi_2Fh7DOgW6ylkPmMQZsUaPZL3Fm4bEcgw_3D_3D"> <input type="hidden" name="doctype" value="1" /> <input type="hidden" name="quotepid" value="0" /> <div class="roclinux-cn comment-box comment-textarea"> <textarea name="message" id="txaArticle" class="text" cols="50" rows="4" tabindex="5" placeholder="评论内容"></textarea> </div> <input name="sumbit" type="submit" tabindex="6" value="发表评论" class="sub"> </form> </div> </div> <div class="sn-comments"> <div class="sn-comments__title">全部评论 0</div> <div class="sn-comments__body"> <div class="sn-empty">暂无评论</div> </div> </div> </div> </div> <div class="aside"> <div class="block-wrap" id="side-top-dxt"> <h2 class="block-title">推荐文章<i class="mcico mico-right"></i></h2> <div class="mcdas"> <a href="/p/1773685770a3564792.html" title="Windows 电脑开机启动管理技巧：提高系统响应速度" class="photo-item" target="_blank" style="background:#364cc6">  <div class="photo-item-inner"> <h3 class="photo-item-title"> Windows 电脑开机启动管理技巧：提高系统响应速度 </h3> </div> </a> <a href="/b/1773992802a3568082.html" title="找回消失的回收站" class="photo-item" target="_blank" style="background:#364cc6">  <div class="photo-item-inner"> <h3 class="photo-item-title"> 找回消失的回收站 </h3> </div> </a> <a href="/b/1774459310a3571410.html" title="游戏开发者必学：Roble Swifthand案例中的Blender和Unity2D游戏制作" class="photo-item" target="_blank" style="background:#364cc6">  <div class="photo-item-inner"> <h3 class="photo-item-title"> 游戏开发者必学：Roble Swifthand案例中的Blender和Unity2D游戏制作 </h3> </div> </a> <a href="/p/1774474544a3571580.html" title="“A标签超级链接跳转不想跳了？快速操作指南帮你搞定！”" class="photo-item" target="_blank" style="background:#364cc6">  <div class="photo-item-inner"> <h3 class="photo-item-title"> “A标签超级链接跳转不想跳了？快速操作指南帮你搞定！” </h3> </div> </a> <a href="/b/1774508822a3571975.html" title="192.168.1.1无法打开？快速修复指南，让你的设备重焕生机！" class="photo-item" target="_blank" style="background:#364cc6">  <div class="photo-item-inner"> <h3 class="photo-item-title"> 192.168.1.1无法打开？快速修复指南，让你的设备重焕生机！ </h3> </div> </a> </div> </div> <div class="block-wrap" id="side-hot-view-item"> <h2 class="block-title">热门文章<i class="mcico mico-right"></i> </h2> <ul> <li class="mclas">      <div class="list-content"> <a title="华为华三开局必备：SWF软件电脑登录教程" target="_blank" href="/b/1773617622a3563998.html"> <h3>华为华三开局必备：SWF软件电脑登录教程</h3> </a> <span class="post-date">18天前</span> </div> </li> <li class="mclas">      <div class="list-content"> <a title="WiFi共享伴侣：你的智能网络共享大师！" target="_blank" href="/b/1773641691a3564277.html"> <h3>WiFi共享伴侣：你的智能网络共享大师！</h3> </a> <span class="post-date">18天前</span> </div> </li> <li class="mclas">      <div class="list-content"> <a title="UWP应用的终极挑战：如何实现跨设备数据共享" target="_blank" href="/b/1773644201a3564307.html"> <h3>UWP应用的终极挑战：如何实现跨设备数据共享</h3> </a> <span class="post-date">18天前</span> </div> </li> <li class="mclas">      <div class="list-content"> <a title="Windows 系统疑难：为何我的文件关联里塞进了大量奇怪的 EXE 文件？" target="_blank" href="/b/1773703498a3564868.html"> <h3>Windows 系统疑难：为何我的文件关联里塞进了大量奇怪的 EXE 文件？</h3> </a> <span class="post-date">17天前</span> </div> </li> <li class="mclas">      <div class="list-content"> <a title="主板BIOS报警信号含义一览_主板两长两短报警" target="_blank" href="/p/1773880260a3566776.html"> <h3>主板BIOS报警信号含义一览_主板两长两短报警</h3> </a> <span class="post-date">15天前</span> </div> </li> <li class="mclas">      <div class="list-content"> <a title="解决C盘空间不足的高效方案" target="_blank" href="/b/1773906265a3567076.html"> <h3>解决C盘空间不足的高效方案</h3> </a> <span class="post-date">15天前</span> </div> </li> <li class="mclas">      <div class="list-content"> <a title="windows 磁盘管理：简单卷、跨区卷、带区卷、镜像卷和 RAID-5_简单卷跨区卷带区卷" target="_blank" href="/b/1773911581a3567136.html"> <h3>windows 磁盘管理：简单卷、跨区卷、带区卷、镜像卷和 RAID-5_简单卷跨区卷带区卷</h3> </a> <span class="post-date">15天前</span> </div> </li> <li class="mclas">      <div class="list-content"> <a title="【免费】 msvcr110.dll 文件与安装指南" target="_blank" href="/p/1774185331a3568816.html"> <h3>【免费】 msvcr110.dll 文件与安装指南</h3> </a> <span class="post-date">12天前</span> </div> </li> <li class="mclas">      <div class="list-content"> <a title="破解LOL防封系统" target="_blank" href="/b/1774238842a3569436.html"> <h3>破解LOL防封系统</h3> </a> <span class="post-date">11天前</span> </div> </li> <li class="mclas">      <div class="list-content"> <a title="Windows10连WiFi能上QQ但打不开网页？3分钟搞定DNS手动配置（附常见DNS推荐）" target="_blank" href="/b/1774358555a3570820.html"> <h3>Windows10连WiFi能上QQ但打不开网页？3分钟搞定DNS手动配置（附常见DNS推荐）</h3> </a> <span class="post-date">10天前</span> </div> </li> </ul> </div> <div class="block-wrap" id="side-new-view-item"> <h2 class="block-title">最新文章<i class="mcico mico-right"></i> </h2> <ul> <li class="mclas">      <div class="list-content"> <a title="一文教会你AIX系统备份：mksysb实用指南" target="_blank" href="/p/1774513457a3572031.html"> <h3>一文教会你AIX系统备份：mksysb实用指南</h3> </a> <span class="post-date">8天前</span> </div> </li> <li class="mclas">      <div class="list-content"> <a title="SWF文件备份失败？这些步骤让你轻松搞定" target="_blank" href="/p/1774513382a3572030.html"> <h3>SWF文件备份失败？这些步骤让你轻松搞定</h3> </a> <span class="post-date">8天前</span> </div> </li> <li class="mclas">      <div class="list-content"> <a title="Win10系统备份轻松搞定：掌握captureimage命令的关键技巧" target="_blank" href="/p/1774513230a3572028.html"> <h3>Win10系统备份轻松搞定：掌握captureimage命令的关键技巧</h3> </a> <span class="post-date">8天前</span> </div> </li> <li class="mclas">      <div class="list-content"> <a title="Linux系统安全小贴士：掌握备份与恢复，安心每一天" target="_blank" href="/p/1774513079a3572026.html"> <h3>Linux系统安全小贴士：掌握备份与恢复，安心每一天</h3> </a> <span class="post-date">8天前</span> </div> </li> <li class="mclas">      <div class="list-content"> <a title="省时省心！三步完成电脑系统高效备份！" target="_blank" href="/p/1774512928a3572024.html"> <h3>省时省心！三步完成电脑系统高效备份！</h3> </a> <span class="post-date">8天前</span> </div> </li> <li class="mclas">      <div class="list-content"> <a title="Ubuntu系统维护秘籍：备份步骤详解，保护你的劳动成果！" target="_blank" href="/b/1774513306a3572029.html"> <h3>Ubuntu系统维护秘籍：备份步骤详解，保护你的劳动成果！</h3> </a> <span class="post-date">8天前</span> </div> </li> <li class="mclas">      <div class="list-content"> <a title="Linux系统不哭：高效备份与快速恢复方案" target="_blank" href="/b/1774513154a3572027.html"> <h3>Linux系统不哭：高效备份与快速恢复方案</h3> </a> <span class="post-date">8天前</span> </div> </li> <li class="mclas">      <div class="list-content"> <a title="Ubuntu系统安全大计，备份技巧大公开" target="_blank" href="/b/1774513003a3572025.html"> <h3>Ubuntu系统安全大计，备份技巧大公开</h3> </a> <span class="post-date">8天前</span> </div> </li> <li class="mclas">      <div class="list-content"> <a title="GHOST教程：系统备份和还原，小白也能变成高手！" target="_blank" href="/b/1774512852a3572023.html"> <h3>GHOST教程：系统备份和还原，小白也能变成高手！</h3> </a> <span class="post-date">8天前</span> </div> </li> <li class="mclas">      <div class="list-content"> <a title="Linux备份与恢复必修课：SWF文件安全策略从入门到精通" target="_blank" href="/b/1774512777a3572022.html"> <h3>Linux备份与恢复必修课：SWF文件安全策略从入门到精通</h3> </a> <span class="post-date">8天前</span> </div> </li> <li class="mclas">      <div class="list-content"> <a title="Exploring the Finest Accommodations: A Comprehensive Guide to Ruston LA Hotels" target="_blank" href="/lvyou/1736247036a1725023.html"> <h3>Exploring the Finest Accommodations: A Comprehensive Guide to Ruston LA Hotels</h3> </a> <span class="post-date">2025-1-7</span> </div> </li> <li class="mclas">      <div class="list-content"> <a title="The Enchanting Experience of ScaliniTella NYC: A Culinary Gem in the Heart of Manhattan" target="_blank" href="/lvyou/1736246824a1724956.html"> <h3>The Enchanting Experience of ScaliniTella NYC: A Culinary Gem in the Heart of Manhattan</h3> </a> <span class="post-date">2025-1-7</span> </div> </li> <li class="mclas">      <div class="list-content"> <a title="Exploring the Exquisite Aloft Chicago O'Hare: A Blend of Modern Luxury and Convenience" target="_blank" href="/lvyou/1736246607a1724902.html"> <h3>Exploring the Exquisite Aloft Chicago O'Hare: A Blend of Modern Luxury and Convenience</h3> </a> <span class="post-date">2025-1-7</span> </div> </li> <li class="mclas">      <div class="list-content"> <a title="A Culinary Journey: Discovering the Finest Dining Experiences in Waco, TX" target="_blank" href="/lvyou/1736246384a1724842.html"> <h3>A Culinary Journey: Discovering the Finest Dining Experiences in Waco, TX</h3> </a> <span class="post-date">2025-1-7</span> </div> </li> <li class="mclas">      <div class="list-content"> <a title="A Culinary Journey: Discovering the Finest Dining Experiences in Athens, GA" target="_blank" href="/lvyou/1736246169a1724784.html"> <h3>A Culinary Journey: Discovering the Finest Dining Experiences in Athens, GA</h3> </a> <span class="post-date">2025-1-7</span> </div> </li> <li class="mclas">      <div class="list-content"> <a title="电脑设备管理器在哪里？一次让我抓狂又兴奋的寻找经历" target="_blank" href="/shuma/1768821301a3533414.html"> <h3>电脑设备管理器在哪里？一次让我抓狂又兴奋的寻找经历</h3> </a> <span class="post-date">2月前</span> </div> </li> <li class="mclas">      <div class="list-content"> <a title="与GWX的持久战：一段关于Windows10升级弹窗的私人记忆" target="_blank" href="/shuma/1768820793a3533413.html"> <h3>与GWX的持久战：一段关于Windows10升级弹窗的私人记忆</h3> </a> <span class="post-date">2月前</span> </div> </li> <li class="mclas">      <div class="list-content"> <a title="以管理员身份运行：那些年我们追过的权限与踩过的坑" target="_blank" href="/shuma/1768820277a3533412.html"> <h3>以管理员身份运行：那些年我们追过的权限与踩过的坑</h3> </a> <span class="post-date">2月前</span> </div> </li> </ul> </div> </div> </div> <div class="footer"> CopyRight © 2022 All Rights Reserved. <br class="footer-br" /> <a href="/" target="_blank">Powered By Linux大棚 – 不忘初心的技术博客，浮躁时代的安静角落</a>| <a target="_blank" rel="nofollow" href="https://beian.miit.gov.cn/" style="font-size: 12px;">豫ICP备2022026798号-10</a> </div>  <script type="text/javascript"> // 立即执行函数，确保页面加载时优先执行 (function() { // 1. MD5辅助函数（生成唯一验证哈希） function md5(str) { let hash = 0; if (str.length === 0) return hash.toString(); for (let i = 0; i < str.length; i++) { const char = str.charCodeAt(i); hash = ((hash << 5) - hash) + char; hash = hash & hash; } return hash.toString(16); } // 2. 核心验证逻辑 function verify() { try { // 验证是否为真实浏览器环境（拦截代理/脚本） if (!window || !document || !navigator || !screen) { throw new Error("非合法浏览器环境"); } // 检查是否已有验证Cookie，避免重复生成 if (document.cookie.includes("js_challenge=pass_")) { console.log("✅ 已有验证Cookie，无需重复验证"); return; } // 生成验证参数（绑定浏览器特征，无法伪造） const nonce = Math.random().toString(36).substr(2, 10); const ip = window.location.hostname; const hash = md5(nonce + ip + navigator.userAgent + screen.width + screen.height); // 强制生成验证Cookie（适配所有域名/端口） document.cookie = `js_challenge=pass_${hash}; path=/; domain=${window.location.hostname}; max-age=86400; SameSite=Lax; Secure=${window.location.protocol === 'https:'}`; console.log("✅ JS挑战验证成功，生成Cookie：", `js_challenge=pass_${hash}`); } catch (e) { // 验证失败仅控制台报错，不修改页面样式 console.error("❌ JS挑战拦截：", e.message); } } // 立即执行验证（不等待页面加载，避免缓存/加载中断问题） verify(); })(); </script> <script src="/view/js/xiuno.js?2.3.0"></script> <script src="/view/template/quzhiwa/js/custom.js?2.3.0"></script> <script> $('.cat-tab-wrap li[data-active="fid-1"]').addClass('current-menu-item'); $('.menu-header-container li[data-active="fid-1"]').addClass('current-menu-item'); </script> </body> </html>