【Web前端】怎样用记事本写一个简单的网页-html

前言

出于对网站的一些突然的兴趣,我开始了解网页是如何被设计出来的
作者水平有限,如有问题,欢迎指出。


文章目录

  • 前言
  • 一. 对网页设计的基本了解
    • 1. 网站
    • 2. 网页编辑工具
      • 1)语言
      • 2)软件
  • 二. 第一个网页
    • 1. 实操——用记事本写个朴素的网页
    • 2. 代码讲解
    • 3. 更丰富一点
  • 总结

一. 对网页设计的基本了解

1. 网站

1)一个网站由若干个网页构成,这些网页是用超级链接有逻辑地联系起来的。
2)网站由网址来识别和存取。
3)网页需要上传到网络空间中,才能供浏览者访问网站中的内容。
即,一个网站需要有域名(网址)、网页网络空间三部分。

2. 网页编辑工具

1)语言

我们可以使用HTML来编写网页,HTML文件就是增加了标记普通文本文件
可以简单的使用记事本来编写一个网页,只需将文件后缀名该为html,然后用浏览器打开。

现在编写网页的语言其实由三部分构成:HTML,CSS,JavaScript
1)HTML:早期编写网站的语言
2)CSS:负责网站内容的表现形式。是在HTML原来的功能中分离出来的,这种分离可以使维护站点外观更容易,也让文档代码更简练,网页加载快
3)JavaScript:负责动态部分。 使网页更加生动活泼,增加和用户互动。

2)软件

前面已经讲到,可以简单地使用记事本来编辑网页。
这里在提出两款编辑软件:EditPlusDreamweaver。它们的能力是递增的。

EditPlus:
图片[1] - 【Web前端】怎样用记事本写一个简单的网页-html - MaxSSL

EditPlus相比记事本的优点是,可以带有html语言的语法高亮,而且可以在这个编辑页面中直接预览网页(点击左上角部分的小地球图标)。


二. 第一个网页

前面已经提到,html语言文件就是增加了标记普通文本
那么首先,我们就要了解标记的作用:
一些简单的标记,可以让文本在网页中以另一种形式呈现出来

1. 实操——用记事本写个朴素的网页

简单起见,接下来就使用记事本来编写我们的网页。
图片[2] - 【Web前端】怎样用记事本写一个简单的网页-html - MaxSSL

首先,新建一个文本文件(txt),给它起个随便的名字。

图片[3] - 【Web前端】怎样用记事本写一个简单的网页-html - MaxSSL

然后用记事本打开它,输入以上内容,记得保存

图片[4] - 【Web前端】怎样用记事本写一个简单的网页-html - MaxSSL

重命名文件,将文件后缀名改为html

图片[5] - 【Web前端】怎样用记事本写一个简单的网页-html - MaxSSL

接着选择打开方式为某个浏览器(系统默认的浏览器就可以),就可以显示出我们刚刚编写的网页啦!
是不是感觉朴素地有点过头了?没关系,第一次嘛。

2. 代码讲解

<html><body>这是我们第一个网页的内容哈。</body></html>

这里我们用到了两个基本的标签:
其中标志着我们html文件的开始,则表示正文内容的开始。而分别代表着对应部分的结束。之间的一行文本,则是我们要展现的内容
(是不是有点明白为什么”html是增加了标记的普通文本了”?)

3. 更丰富一点

增加一些其它的标签,让我们的网页更加生动一点。

<!doctype html><html><title>第一个网页</title><body background = "宇宙.jpeg"text = "#00ff33"leftmargin = "300"><h1>这是我们的第一个网页!</h1><p>可以简单留作一个纪念。</p><p>但我们的征途,是星辰大海!</p></body></html>
标签功能
标识文件的语言标准,这里指的是html5
</td><td>网页的标题,即浏览器中页面的名字</td></tr><tr><td><h1></td><td>一级标题</td></tr><tr><td></td><td>一个段落的开始</td></tr></tbody></table><p><code>注意:标签的括号和字母之间是没有空格的,我这里是因为不加空格显示不出来。</code></p><blockquote><p>在<code></code>标记中,还可以控制一些全局的呈现效果:</p></blockquote><table><thead><tr><th>标识符</th><th>控制内容</th></tr></thead><tbody><tr><td>background</td><td>背景图片(需要在html文件相同目录下,加入相应的图片文件)</td></tr><tr><td>text</td><td>文本内容的颜色</td></tr><tr><td>leftmargin</td><td>两边间距大小</td></tr></tbody></table><p><strong><mark>下面是新的网页:</mark></strong></p><p><noscript><img alt="图片[6] - 【Web前端】怎样用记事本写一个简单的网页-html - MaxSSL" decoding="async" class="aligncenter" src="https://www.maxssl.com/uploads/?url=https://img-blog.csdnimg.cn/2f640a5b604e4a83a89d5be9f044b530.png" /></noscript><img alt="图片[6] - 【Web前端】怎样用记事本写一个简单的网页-html - MaxSSL" decoding="async" class="lazyload aligncenter" src='data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%20210%20140%22%3E%3C/svg%3E' data-src="https://www.maxssl.com/uploads/?url=https://img-blog.csdnimg.cn/2f640a5b604e4a83a89d5be9f044b530.png" /></p><hr><h1>总结</h1><p>我们的第一个网页讲到这里就讲完啦。<br /> 那博主在这里求个<mark>三连</mark>不过分吧?</p></div><div class="em09 muted-3-color"><div><span>©</span> 版权声明</div><div class="posts-copyright">文章版权归作者所有,未经允许请勿转载。</div></div><div class="text-center theme-box muted-3-color box-body separator em09">THE END</div><div class="theme-box article-tags"><a class="but ml6 radius c-blue" title="查看更多分类文章" href="https://www.maxssl.com/article/"><i class="fa fa-folder-open-o" aria-hidden="true"></i>文章</a><br><a href="https://www.maxssl.com/tag/6" title="查看此标签更多文章" class="but ml6 radius"># 前端</a><a href="https://www.maxssl.com/tag/39" title="查看此标签更多文章" class="but ml6 radius"># html</a><a href="https://www.maxssl.com/tag/150" title="查看此标签更多文章" class="but ml6 radius"># web</a></div></div><div class="text-center muted-3-color box-body em09">喜欢就支持一下吧</div><div class="text-center post-actions"><a href="javascript:;" data-action="like" class="action action-like" data-pid="779"><svg class="icon" aria-hidden="true"><use xlink:href="#icon-like"></use></svg><text>点赞</text><count>0</count></a><span class="hover-show dropup action action-share"> <svg class="icon" aria-hidden="true"><use xlink:href="#icon-share"></use></svg><text>分享</text><div class="zib-widget hover-show-con share-button dropdown-menu"><div><a rel="nofollow" class="share-btn qzone" target="_blank" title="QQ空间" href="https://sns.qzone.qq.com/cgi-bin/qzshare/cgi_qzshare_onekey?url=https://www.maxssl.com/article/779/&title=【Web前端】怎样用记事本写一个简单的网页-html - MaxSSL&pics=https://www.maxssl.com/uploads/?url=https://img-blog.csdnimg.cn/08c1b485f177493eabe8ab2ac99eb0c1.png&summary=前言出于对网站的一些突然的兴趣,我开始了解网页是如何被设计出来的。作者水平有限,如有问题,欢迎指出。文章目录前言一.对网页设计的基本了解1.网站2.网页编辑工具1)语言2)软件二.第一个网页1.实操——用记事本写个朴素的网页2.代码讲解3.…"><icon><svg class="icon" aria-hidden="true"><use xlink:href="#icon-qzone-color"></use></svg></icon><text>QQ空间<text></a><a rel="nofollow" class="share-btn weibo" target="_blank" title="微博" href="https://service.weibo.com/share/share.php?url=https://www.maxssl.com/article/779/&title=【Web前端】怎样用记事本写一个简单的网页-html - MaxSSL&pic=https://www.maxssl.com/uploads/?url=https://img-blog.csdnimg.cn/08c1b485f177493eabe8ab2ac99eb0c1.png&searchPic=false"><icon><svg class="icon" aria-hidden="true"><use xlink:href="#icon-weibo-color"></use></svg></icon><text>微博<text></a><a rel="nofollow" class="share-btn qq" target="_blank" title="QQ好友" href="https://connect.qq.com/widget/shareqq/index.html?url=https://www.maxssl.com/article/779/&title=【Web前端】怎样用记事本写一个简单的网页-html - MaxSSL&pics=https://www.maxssl.com/uploads/?url=https://img-blog.csdnimg.cn/08c1b485f177493eabe8ab2ac99eb0c1.png&desc=前言出于对网站的一些突然的兴趣,我开始了解网页是如何被设计出来的。作者水平有限,如有问题,欢迎指出。文章目录前言一.对网页设计的基本了解1.网站2.网页编辑工具1)语言2)软件二.第一个网页1.实操——用记事本写个朴素的网页2.代码讲解3.…"><icon><svg class="icon" aria-hidden="true"><use xlink:href="#icon-qq-color"></use></svg></icon><text>QQ好友<text></a><a rel="nofollow" class="share-btn poster" poster-share="779" title="海报分享" href="javascript:;"><icon><svg class="icon" aria-hidden="true"><use xlink:href="#icon-poster-color"></use></svg></icon><text>海报分享<text></a><a rel="nofollow" class="share-btn copy" data-clipboard-text="https://www.maxssl.com/article/779/" data-clipboard-tag="链接" title="复制链接" href="javascript:;"><icon><svg class="icon" aria-hidden="true"><use xlink:href="#icon-copy-color"></use></svg></icon><text>复制链接<text></a></div></div></span></div></article><div class="user-card zib-widget author"><div class="card-content mt10 relative"><div class="user-content"><div class="user-avatar"><a href="https://www.maxssl.com/author/1/"><span class="avatar-img avatar-lg"><img alt="MaxSSL的头像 - MaxSSL" src="https://www.maxssl.com/wp-content/themes/zibll/img/avatar-default.png" data-src="//www.maxssl.com/wp-content/themes/zibll/img/avatar-default.png" class="lazyload avatar avatar-id-1"></span></a></div><div class="user-info mt20 mb10"><div class="user-name flex jc"><name class="flex1 flex ac"><a class="display-name text-ellipsis " href="https://www.maxssl.com/author/1/">MaxSSL</a></name></div><div class="author-tag mt10 mini-scrollbar"><a class="but c-blue tag-posts" data-toggle="tooltip" title="共5.8W+篇文章" href="https://www.maxssl.com/author/1/"><svg class="icon" aria-hidden="true"><use xlink:href="#icon-post"></use></svg>5.8W+</a><a class="but c-green tag-comment" data-toggle="tooltip" title="共0条评论" href="https://www.maxssl.com/author/1/?tab=comment"><svg class="icon" aria-hidden="true"><use xlink:href="#icon-comment"></use></svg>0</a><span class="badg c-yellow tag-like" data-toggle="tooltip" title="获得3个点赞"><svg class="icon" aria-hidden="true"><use xlink:href="#icon-like"></use></svg>3</span><span class="badg c-red tag-view" data-toggle="tooltip" title="人气值 38W+"><svg class="icon" aria-hidden="true"><use xlink:href="#icon-hot"></use></svg>38W+</span></div><div class="user-desc mt10 muted-2-color em09">这家伙很懒,什么都没有写...</div></div></div><div class="swiper-container more-posts swiper-scroll"><div class="swiper-wrapper"><div class="swiper-slide mr10"><a href="https://www.maxssl.com/article/8731/"><div class="graphic hover-zoom-img em09 style-3" style="padding-bottom: 70%!important;"><img class="fit-cover lazyload" data-src="https://www.maxssl.com/wp-content/themes/zibll/img/thumbnail.svg" src="https://www.maxssl.com/wp-content/themes/zibll/img/thumbnail.svg" alt="7-4 藏头诗c语言 - MaxSSL"><div class="abs-center left-bottom graphic-text text-ellipsis">7-4 藏头诗c语言</div><div class="abs-center left-bottom graphic-text"><div class="em09 opacity8">7-4 藏头诗c语言</div><div class="px12 opacity8 mt6"><item>2年前</item><item class="pull-right"><svg class="icon" aria-hidden="true"><use xlink:href="#icon-view"></use></svg> 354</item></div></div></div></a></div><div class="swiper-slide mr10"><a href="https://www.maxssl.com/article/296/"><div class="graphic hover-zoom-img em09 style-3" style="padding-bottom: 70%!important;"><img class="fit-cover lazyload" data-src="https://www.maxssl.com/uploads/?url=https://img-blog.csdnimg.cn/539aef8ddc064c08a24865ed2b7e65d3.png" src="https://www.maxssl.com/wp-content/themes/zibll/img/thumbnail.svg" alt="第十三届蓝桥杯c++b组2022年国赛决赛题解 - MaxSSL"><div class="abs-center left-bottom graphic-text text-ellipsis">第十三届蓝桥杯c++b组2022年国赛决赛题解</div><div class="abs-center left-bottom graphic-text"><div class="em09 opacity8">第十三届蓝桥杯c++b组2022年国赛决赛题解</div><div class="px12 opacity8 mt6"><item>3年前</item><item class="pull-right"><svg class="icon" aria-hidden="true"><use xlink:href="#icon-view"></use></svg> 349</item></div></div></div></a></div><div class="swiper-slide mr10"><a href="https://www.maxssl.com/article/6585/"><div class="graphic hover-zoom-img em09 style-3" style="padding-bottom: 70%!important;"><img class="fit-cover lazyload" data-src="https://www.maxssl.com/wp-content/themes/zibll/img/thumbnail.svg" src="https://www.maxssl.com/wp-content/themes/zibll/img/thumbnail.svg" alt="什么是整体设备效率(OEE)? - MaxSSL"><div class="abs-center left-bottom graphic-text text-ellipsis">什么是整体设备效率(OEE)?</div><div class="abs-center left-bottom graphic-text"><div class="em09 opacity8">什么是整体设备效率(OEE)?</div><div class="px12 opacity8 mt6"><item>2年前</item><item class="pull-right"><svg class="icon" aria-hidden="true"><use xlink:href="#icon-view"></use></svg> 327</item></div></div></div></a></div><div class="swiper-slide mr10"><a href="https://www.maxssl.com/article/16800/"><div class="graphic hover-zoom-img em09 style-3" style="padding-bottom: 70%!important;"><img class="fit-cover lazyload" data-src="https://www.maxssl.com/uploads/?url=https://www.maxssl.com/uploads/?url=https://img-blog.csdnimg.cn/be6b286a96ef4d5b8f0d5ca48bccff1c.png" src="https://www.maxssl.com/wp-content/themes/zibll/img/thumbnail.svg" alt="【郑州大学C语言实验报告册答案2023】 - MaxSSL"><div class="abs-center left-bottom graphic-text text-ellipsis">【郑州大学C语言实验报告册答案2023】</div><div class="abs-center left-bottom graphic-text"><div class="em09 opacity8">【郑州大学C语言实验报告册答案2023】</div><div class="px12 opacity8 mt6"><item>2年前</item><item class="pull-right"><svg class="icon" aria-hidden="true"><use xlink:href="#icon-view"></use></svg> 278</item></div></div></div></a></div><div class="swiper-slide mr10"><a href="https://www.maxssl.com/article/6201/"><div class="graphic hover-zoom-img em09 style-3" style="padding-bottom: 70%!important;"><img class="fit-cover lazyload" data-src="https://www.maxssl.com/uploads/?url=https://media.baby7blog.com/StableDiffusion/ai_cat.png" src="https://www.maxssl.com/wp-content/themes/zibll/img/thumbnail.svg" alt="基于Docker安装的Stable Diffusion使用CPU进行AI绘画 - MaxSSL"><div class="abs-center left-bottom graphic-text text-ellipsis">基于Docker安装的Stable Diffusion使用CPU进行AI绘画</div><div class="abs-center left-bottom graphic-text"><div class="em09 opacity8">基于Docker安装的Stable Diffusion使用CPU进行AI绘画</div><div class="px12 opacity8 mt6"><item>2年前</item><item class="pull-right"><svg class="icon" aria-hidden="true"><use xlink:href="#icon-view"></use></svg> 269</item></div></div></div></a></div><div class="swiper-slide mr10"><a href="https://www.maxssl.com/article/6249/"><div class="graphic hover-zoom-img em09 style-3" style="padding-bottom: 70%!important;"><img class="fit-cover lazyload" data-src="https://www.maxssl.com/uploads/?url=https://img2022.cnblogs.com/blog/2484178/202211/2484178-20221118074459557-1151070900.png" src="https://www.maxssl.com/wp-content/themes/zibll/img/thumbnail.svg" alt="小米MIUI系统组件监听用户隐私 - MaxSSL"><div class="abs-center left-bottom graphic-text text-ellipsis">小米MIUI系统组件监听用户隐私</div><div class="abs-center left-bottom graphic-text"><div class="em09 opacity8">小米MIUI系统组件监听用户隐私</div><div class="px12 opacity8 mt6"><item>2年前</item><item class="pull-right"><svg class="icon" aria-hidden="true"><use xlink:href="#icon-view"></use></svg> 242</item></div></div></div></a></div></div><div class="swiper-button-prev"></div><div class="swiper-button-next"></div></div></div></div><div class="theme-box" style="height:99px"><nav class="article-nav"><div class="main-bg box-body radius8 main-shadow"> <a href="https://www.maxssl.com/article/778/"><p class="muted-2-color"><i class="fa fa-angle-left em12"></i><i class="fa fa-angle-left em12 mr6"></i>上一篇</p><div class="text-ellipsis-2"> 【C语言】预处理的深入理解</div> </a></div><div class="main-bg box-body radius8 main-shadow"> <a href="https://www.maxssl.com/article/780/"><p class="muted-2-color">下一篇<i class="fa fa-angle-right em12 ml6"></i><i class="fa fa-angle-right em12"></i></p><div class="text-ellipsis-2"> Visual Studio调试方式详解</div> </a></div></nav></div><div class="theme-box relates relates-thumb"><div class="box-body notop"><div class="title-theme">相关推荐</div></div><div class="zib-widget"><div class="swiper-container swiper-scroll"><div class="swiper-wrapper"><div class="swiper-slide mr10"><a href="https://www.maxssl.com/article/8731/"><div class="graphic hover-zoom-img mb10 style-3" style="padding-bottom: 70%!important;"><img class="fit-cover lazyload" data-src="https://www.maxssl.com/wp-content/themes/zibll/img/thumbnail.svg" src="https://www.maxssl.com/wp-content/themes/zibll/img/thumbnail.svg" alt="7-4 藏头诗c语言 - MaxSSL"><div class="abs-center left-bottom graphic-text text-ellipsis">7-4 藏头诗c语言</div><div class="abs-center left-bottom graphic-text"><div class="em09 opacity8">7-4 藏头诗c语言</div><div class="px12 opacity8 mt6"><item>2年前</item><item class="pull-right"><svg class="icon" aria-hidden="true"><use xlink:href="#icon-view"></use></svg> 354</item></div></div></div></a></div><div class="swiper-slide mr10"><a href="https://www.maxssl.com/article/296/"><div class="graphic hover-zoom-img mb10 style-3" style="padding-bottom: 70%!important;"><img class="fit-cover lazyload" data-src="https://www.maxssl.com/uploads/?url=https://img-blog.csdnimg.cn/539aef8ddc064c08a24865ed2b7e65d3.png" src="https://www.maxssl.com/wp-content/themes/zibll/img/thumbnail.svg" alt="第十三届蓝桥杯c++b组2022年国赛决赛题解 - MaxSSL"><div class="abs-center left-bottom graphic-text text-ellipsis">第十三届蓝桥杯c++b组2022年国赛决赛题解</div><div class="abs-center left-bottom graphic-text"><div class="em09 opacity8">第十三届蓝桥杯c++b组2022年国赛决赛题解</div><div class="px12 opacity8 mt6"><item>3年前</item><item class="pull-right"><svg class="icon" aria-hidden="true"><use xlink:href="#icon-view"></use></svg> 349</item></div></div></div></a></div><div class="swiper-slide mr10"><a href="https://www.maxssl.com/article/6585/"><div class="graphic hover-zoom-img mb10 style-3" style="padding-bottom: 70%!important;"><img class="fit-cover lazyload" data-src="https://www.maxssl.com/wp-content/themes/zibll/img/thumbnail.svg" src="https://www.maxssl.com/wp-content/themes/zibll/img/thumbnail.svg" alt="什么是整体设备效率(OEE)? - MaxSSL"><div class="abs-center left-bottom graphic-text text-ellipsis">什么是整体设备效率(OEE)?</div><div class="abs-center left-bottom graphic-text"><div class="em09 opacity8">什么是整体设备效率(OEE)?</div><div class="px12 opacity8 mt6"><item>2年前</item><item class="pull-right"><svg class="icon" aria-hidden="true"><use xlink:href="#icon-view"></use></svg> 327</item></div></div></div></a></div><div class="swiper-slide mr10"><a href="https://www.maxssl.com/article/16800/"><div class="graphic hover-zoom-img mb10 style-3" style="padding-bottom: 70%!important;"><img class="fit-cover lazyload" data-src="https://www.maxssl.com/uploads/?url=https://www.maxssl.com/uploads/?url=https://img-blog.csdnimg.cn/be6b286a96ef4d5b8f0d5ca48bccff1c.png" src="https://www.maxssl.com/wp-content/themes/zibll/img/thumbnail.svg" alt="【郑州大学C语言实验报告册答案2023】 - MaxSSL"><div class="abs-center left-bottom graphic-text text-ellipsis">【郑州大学C语言实验报告册答案2023】</div><div class="abs-center left-bottom graphic-text"><div class="em09 opacity8">【郑州大学C语言实验报告册答案2023】</div><div class="px12 opacity8 mt6"><item>2年前</item><item class="pull-right"><svg class="icon" aria-hidden="true"><use xlink:href="#icon-view"></use></svg> 278</item></div></div></div></a></div><div class="swiper-slide mr10"><a href="https://www.maxssl.com/article/6201/"><div class="graphic hover-zoom-img mb10 style-3" style="padding-bottom: 70%!important;"><img class="fit-cover lazyload" data-src="https://www.maxssl.com/uploads/?url=https://media.baby7blog.com/StableDiffusion/ai_cat.png" src="https://www.maxssl.com/wp-content/themes/zibll/img/thumbnail.svg" alt="基于Docker安装的Stable Diffusion使用CPU进行AI绘画 - MaxSSL"><div class="abs-center left-bottom graphic-text text-ellipsis">基于Docker安装的Stable Diffusion使用CPU进行AI绘画</div><div class="abs-center left-bottom graphic-text"><div class="em09 opacity8">基于Docker安装的Stable Diffusion使用CPU进行AI绘画</div><div class="px12 opacity8 mt6"><item>2年前</item><item class="pull-right"><svg class="icon" aria-hidden="true"><use xlink:href="#icon-view"></use></svg> 269</item></div></div></div></a></div><div class="swiper-slide mr10"><a href="https://www.maxssl.com/article/6249/"><div class="graphic hover-zoom-img mb10 style-3" style="padding-bottom: 70%!important;"><img class="fit-cover lazyload" data-src="https://www.maxssl.com/uploads/?url=https://img2022.cnblogs.com/blog/2484178/202211/2484178-20221118074459557-1151070900.png" src="https://www.maxssl.com/wp-content/themes/zibll/img/thumbnail.svg" alt="小米MIUI系统组件监听用户隐私 - MaxSSL"><div class="abs-center left-bottom graphic-text text-ellipsis">小米MIUI系统组件监听用户隐私</div><div class="abs-center left-bottom graphic-text"><div class="em09 opacity8">小米MIUI系统组件监听用户隐私</div><div class="px12 opacity8 mt6"><item>2年前</item><item class="pull-right"><svg class="icon" aria-hidden="true"><use xlink:href="#icon-view"></use></svg> 242</item></div></div></div></a></div></div><div class="swiper-button-prev"></div><div class="swiper-button-next"></div></div></div></div></div></div><div class="sidebar"><div class=" hidden-xs"><div class="box-body notop"><div class="title-theme">热文推荐</div></div><div class="zib-widget hot-posts"><div class="relative"><a href="https://www.maxssl.com/article/8731/"><div class="graphic hover-zoom-img" style="padding-bottom: 60%!important;"><img data-thumb="default" src="https://www.maxssl.com/wp-content/themes/zibll/img/thumbnail.svg" data-src="https://www.maxssl.com/wp-content/themes/zibll/img/thumbnail.svg" alt="7-4 藏头诗c语言 - MaxSSL" class="lazyload fit-cover radius8"><div class="absolute linear-mask"></div><div class="abs-center left-bottom box-body"><div class="mb6"><span class="badg b-theme badg-sm">354人已阅读</span></div>7-4 藏头诗c语言</div></div></a><badge class="img-badge left hot em12"><i>TOP1</i></badge></div><div class="flex mt15 relative hover-zoom-img"><a href="https://www.maxssl.com/article/296/"><div class="graphic"><img src="https://www.maxssl.com/wp-content/themes/zibll/img/thumbnail.svg" data-src="https://www.maxssl.com/uploads/?url=https://img-blog.csdnimg.cn/539aef8ddc064c08a24865ed2b7e65d3.png" alt="第十三届蓝桥杯c++b组2022年国赛决赛题解 - MaxSSL" class="lazyload fit-cover radius8"></div></a><div class="term-title ml10 flex xx flex1 jsb"><div class="text-ellipsis-2"><a class="" href="https://www.maxssl.com/article/296/">第十三届蓝桥杯c++b组2022年国赛决赛题解</a></div><div class="px12 muted-3-color text-ellipsis flex jsb"><span><i class="fa fa-clock-o mr3" aria-hidden="true"></i>3年前</span><span>349人已阅读</span></div></div><badge class="img-badge left hot jb-red"><i>TOP2</i></badge></div><div class="flex mt15 relative hover-zoom-img"><a href="https://www.maxssl.com/article/6585/"><div class="graphic"><img data-thumb="default" src="https://www.maxssl.com/wp-content/themes/zibll/img/thumbnail.svg" data-src="https://www.maxssl.com/wp-content/themes/zibll/img/thumbnail.svg" alt="什么是整体设备效率(OEE)? - MaxSSL" class="lazyload fit-cover radius8"></div></a><div class="term-title ml10 flex xx flex1 jsb"><div class="text-ellipsis-2"><a class="" href="https://www.maxssl.com/article/6585/">什么是整体设备效率(OEE)?</a></div><div class="px12 muted-3-color text-ellipsis flex jsb"><span><i class="fa fa-clock-o mr3" aria-hidden="true"></i>2年前</span><span>327人已阅读</span></div></div><badge class="img-badge left hot jb-yellow"><i>TOP3</i></badge></div><div class="flex mt15 relative hover-zoom-img"><a href="https://www.maxssl.com/article/16800/"><div class="graphic"><img src="https://www.maxssl.com/wp-content/themes/zibll/img/thumbnail.svg" data-src="https://www.maxssl.com/uploads/?url=https://www.maxssl.com/uploads/?url=https://img-blog.csdnimg.cn/be6b286a96ef4d5b8f0d5ca48bccff1c.png" alt="【郑州大学C语言实验报告册答案2023】 - MaxSSL" class="lazyload fit-cover radius8"></div></a><div class="term-title ml10 flex xx flex1 jsb"><div class="text-ellipsis-2"><a class="" href="https://www.maxssl.com/article/16800/">【郑州大学C语言实验报告册答案2023】</a></div><div class="px12 muted-3-color text-ellipsis flex jsb"><span><i class="fa fa-clock-o mr3" aria-hidden="true"></i>2年前</span><span>278人已阅读</span></div></div><badge class="img-badge left hot b-gray"><i>TOP4</i></badge></div><div class="flex mt15 relative hover-zoom-img"><a href="https://www.maxssl.com/article/6201/"><div class="graphic"><img src="https://www.maxssl.com/wp-content/themes/zibll/img/thumbnail.svg" data-src="https://www.maxssl.com/uploads/?url=https://media.baby7blog.com/StableDiffusion/ai_cat.png" alt="基于Docker安装的Stable Diffusion使用CPU进行AI绘画 - MaxSSL" class="lazyload fit-cover radius8"></div></a><div class="term-title ml10 flex xx flex1 jsb"><div class="text-ellipsis-2"><a class="" href="https://www.maxssl.com/article/6201/">基于Docker安装的Stable Diffusion使用CPU进行AI绘画</a></div><div class="px12 muted-3-color text-ellipsis flex jsb"><span><i class="fa fa-clock-o mr3" aria-hidden="true"></i>2年前</span><span>269人已阅读</span></div></div><badge class="img-badge left hot b-gray"><i>TOP5</i></badge></div><div class="flex mt15 relative hover-zoom-img"><a href="https://www.maxssl.com/article/6249/"><div class="graphic"><img src="https://www.maxssl.com/wp-content/themes/zibll/img/thumbnail.svg" data-src="https://www.maxssl.com/uploads/?url=https://img2022.cnblogs.com/blog/2484178/202211/2484178-20221118074459557-1151070900.png" alt="小米MIUI系统组件监听用户隐私 - MaxSSL" class="lazyload fit-cover radius8"></div></a><div class="term-title ml10 flex xx flex1 jsb"><div class="text-ellipsis-2"><a class="" href="https://www.maxssl.com/article/6249/">小米MIUI系统组件监听用户隐私</a></div><div class="px12 muted-3-color text-ellipsis flex jsb"><span><i class="fa fa-clock-o mr3" aria-hidden="true"></i>2年前</span><span>242人已阅读</span></div></div><badge class="img-badge left hot b-gray"><i>TOP6</i></badge></div></div></div><div data-affix="true" class="widget-main-post mb20 style-mini hidden-xs"><div class="box-body notop"><div class="title-theme">站长推荐</div></div><div class="zib-widget posts-mini-lists"><div class="widget-ajaxpager"><div class="posts-mini ajax-item"><div class="mr10"><div class="item-thumbnail"><a href="https://www.maxssl.com/article/954/"><img src="https://www.maxssl.com/wp-content/themes/zibll/img/thumbnail.svg" data-src="https://www.maxssl.com/uploads/?url=https://img-blog.csdnimg.cn/13b0efb5f9ef4a7a89f2057eab98c67a.png" alt="面试官:设计模式是什么? - MaxSSL" class="lazyload fit-cover radius8"></a></div></div><div class="posts-mini-con flex xx flex1 jsb"><h2 class="item-heading text-ellipsis-2"><a href="https://www.maxssl.com/article/954/">面试官:设计模式是什么?<span class="focus-color"></span></a></h2></div></div><div class="posts-mini ajax-item"><div class="mr10"><div class="item-thumbnail"><a href="https://www.maxssl.com/article/32106/"><img src="https://www.maxssl.com/wp-content/themes/zibll/img/thumbnail.svg" data-src="https://www.maxssl.com/uploads/?url=https://img-blog.csdnimg.cn/7910711d27cd4c3e874c8486654689b4.jpeg" alt="【sosp2023论文分享】Ditto:一个弹性自适应分离式内存缓存系统 - MaxSSL" class="lazyload fit-cover radius8"></a></div></div><div class="posts-mini-con flex xx flex1 jsb"><h2 class="item-heading text-ellipsis-2"><a href="https://www.maxssl.com/article/32106/">【sosp2023论文分享】Ditto:一个弹性自适应分离式内存缓存系统<span class="focus-color"></span></a></h2></div></div><div class="posts-mini ajax-item"><div class="mr10"><div class="item-thumbnail"><a href="https://www.maxssl.com/article/2062/"><img data-thumb="default" src="https://www.maxssl.com/wp-content/themes/zibll/img/thumbnail.svg" data-src="https://www.maxssl.com/wp-content/themes/zibll/img/thumbnail.svg" alt="一文详解PHP连接MySQL数据库的三种方式 - MaxSSL" class="lazyload fit-cover radius8"></a></div></div><div class="posts-mini-con flex xx flex1 jsb"><h2 class="item-heading text-ellipsis-2"><a href="https://www.maxssl.com/article/2062/">一文详解PHP连接MySQL数据库的三种方式<span class="focus-color"></span></a></h2></div></div><div class="posts-mini ajax-item"><div class="mr10"><div class="item-thumbnail"><a href="https://www.maxssl.com/article/39432/"><img src="https://www.maxssl.com/wp-content/themes/zibll/img/thumbnail.svg" data-src="https://www.maxssl.com/uploads/?url=https://www.maxssl.com/uploads/?url=https://img-blog.csdnimg.cn/img_convert/c7c318c0bf01c4f2062a0f30639c6f11.png" alt="【拓展】Loguru:更为优雅、简洁的Python 日志管理模块 - MaxSSL" class="lazyload fit-cover radius8"></a></div></div><div class="posts-mini-con flex xx flex1 jsb"><h2 class="item-heading text-ellipsis-2"><a href="https://www.maxssl.com/article/39432/">【拓展】Loguru:更为优雅、简洁的Python 日志管理模块<span class="focus-color"></span></a></h2></div></div><div class="posts-mini ajax-item"><div class="mr10"><div class="item-thumbnail"><a href="https://www.maxssl.com/article/56455/"><img src="https://www.maxssl.com/wp-content/themes/zibll/img/thumbnail.svg" data-src="https://www.maxssl.com/uploads/?url=https://www.maxssl.com/uploads/?url=https://img-blog.csdnimg.cn/e8680035e12e4ddab33af8139284784b.png" alt="【Java探索之旅】数据类型与变量,字面常量,整型变量 - MaxSSL" class="lazyload fit-cover radius8"></a></div></div><div class="posts-mini-con flex xx flex1 jsb"><h2 class="item-heading text-ellipsis-2"><a href="https://www.maxssl.com/article/56455/">【Java探索之旅】数据类型与变量,字面常量,整型变量<span class="focus-color"></span></a></h2></div></div><div class="posts-mini ajax-item"><div class="mr10"><div class="item-thumbnail"><a href="https://www.maxssl.com/article/46757/"><img src="https://www.maxssl.com/wp-content/themes/zibll/img/thumbnail.svg" data-src="https://www.maxssl.com/uploads/?url=https://www.maxssl.com/uploads/?url=https://img-blog.csdnimg.cn/direct/8af9110505b74f19aca4e0c838a0f0aa.png" alt="基于Java+SpringBoot+Vue前后端分离手工艺品销售系统设计和实现 - MaxSSL" class="lazyload fit-cover radius8"></a></div></div><div class="posts-mini-con flex xx flex1 jsb"><h2 class="item-heading text-ellipsis-2"><a href="https://www.maxssl.com/article/46757/">基于Java+SpringBoot+Vue前后端分离手工艺品销售系统设计和实现<span class="focus-color"></span></a></h2></div></div><div class="ajax-pag hide"><div class="next-page ajax-next"><a href="#"></a></div></div></div></div></div></div></main><div class="container fluid-widget"></div><footer class="footer"><div class="container-fluid container-footer"><ul class="list-inline"><li class="hidden-xs" style="max-width: 300px;"></li><li style="max-width: 550px;"><div class="footer-muted em09">Copyright © 2025 · <a href="https://www.maxssl.com">MaxSSL</a> · <a target="_blank" href="http://beian.miit.gov.cn">浙ICP备2022011180号</a></div><div class="footer-contact mt10 hidden-xs"></div></li><li class="hidden-xs"></li></ul></div></footer> <script></script> <script type="text/javascript">window._win={views:'779',www:'https://www.maxssl.com',uri:'https://www.maxssl.com/wp-content/themes/zibll',ver:'8.1',imgbox:'1',imgbox_type:'group',imgbox_thumbs:'1',imgbox_zoom:'1',imgbox_full:'1',imgbox_play:'1',imgbox_down:'1',sign_type:'modal',signin_url:'https://www.maxssl.com/user-sign/?tab=signin&redirect_to=https%3A%2F%2Fwww.maxssl.com%2Farticle%2F779%2F',signup_url:'https://www.maxssl.com/user-sign/?tab=signup&redirect_to=https%3A%2F%2Fwww.maxssl.com%2Farticle%2F779%2F',ajax_url:'https://www.maxssl.com/wp-admin/admin-ajax.php',ajaxpager:'',ajax_trigger:'<i class="fa fa-angle-right"></i>加载更多',ajax_nomore:'没有更多内容了',qj_loading:'',highlight_kg:'1',highlight_hh:'',highlight_btn:'1',highlight_zt:'enlighter',highlight_white_zt:'enlighter',highlight_dark_zt:'dracula',upload_img_size:'3',img_upload_multiple:'6',upload_video_size:'30',upload_file_size:'30',upload_ext:'jpg|jpeg|jpe|gif|png|bmp|tiff|tif|webp|avif|ico|heic|heif|heics|heifs|asf|asx|wmv|wmx|wm|avi|divx|flv|mov|qt|mpeg|mpg|mpe|mp4|m4v|ogv|webm|mkv|3gp|3gpp|3g2|3gp2|txt|asc|c|cc|h|srt|csv|tsv|ics|rtx|css|vtt|dfxp|mp3|m4a|m4b|aac|ra|ram|wav|ogg|oga|flac|mid|midi|wma|wax|mka|rtf|pdf|class|tar|zip|gz|gzip|rar|7z|psd|xcf|doc|pot|pps|ppt|wri|xla|xls|xlt|xlw|mdb|mpp|docx|docm|dotx|dotm|xlsx|xlsm|xlsb|xltx|xltm|xlam|pptx|pptm|ppsx|ppsm|potx|potm|ppam|sldx|sldm|onetoc|onetoc2|onetmp|onepkg|oxps|xps|odt|odp|ods|odg|odc|odb|odf|wp|wpd|key|numbers|pages',user_upload_nonce:'4d101d3a42',is_split_upload:'1',split_minimum_size:'20',comment_upload_img:''}</script> <div class="float-right round position-bottom"><a class="float-btn toggle-theme hover-show" data-toggle="tooltip" data-placement="left" title="切换主题" href="javascript:;"><i class="fa fa-toggle-theme"></i> </a><span class="float-btn qrcode-btn hover-show service-wechat"><i class="fa fa-qrcode"></i><div class="hover-show-con dropdown-menu"><div class="qrcode" data-size="100"></div><div class="mt6 px12 muted-color">在手机上浏览此页面</div></div></span><a class="float-btn ontop fade" data-toggle="tooltip" data-placement="left" title="返回顶部" href="javascript:(scrollTopTo());"><i class="fa fa-angle-up em12"></i></a></div><div mini-touch="nav_search" touch-direction="top" class="main-search fixed-body main-bg box-body navbar-search nopw-sm"><div class="container"><div class="mb20"><button class="close" data-toggle-class data-target=".navbar-search" ><svg class="ic-close" aria-hidden="true"><use xlink:href="#icon-close"></use></svg></button></div><div remote-box="https://www.maxssl.com/wp-admin/admin-ajax.php?action=search_box" load-click><div class="search-input"><p><i class="placeholder s1 mr6"></i><i class="placeholder s1 mr6"></i><i class="placeholder s1 mr6"></i></p><p class="placeholder k2"></p><p class="placeholder t1"></p><p><i class="placeholder s1 mr6"></i><i class="placeholder s1 mr6"></i><i class="placeholder s1 mr6"></i><i class="placeholder s1 mr6"></i></p><p class="placeholder k1"></p><p class="placeholder t1"></p><p></p><p class="placeholder k1" style="height: 80px;"></p></div></div></div></div><noscript><style>.lazyload{display:none}</style></noscript><script data-noptimize="1">window.lazySizesConfig=window.lazySizesConfig||{};window.lazySizesConfig.loadMode=1;</script><script async data-noptimize="1" src='https://www.maxssl.com/wp-content/plugins/autoptimize/classes/external/js/lazysizes.min.js'></script><script type="text/javascript" src="https://www.maxssl.com/wp-content/themes/zibll/js/libs/jquery.min.js" id="jquery-js"></script> <script type="text/javascript" src="https://www.maxssl.com/wp-content/themes/zibll/js/libs/bootstrap.min.js" id="bootstrap-js"></script> <script type="text/javascript" src="https://www.maxssl.com/wp-content/cache/autoptimize/js/autoptimize_single_19c400de3036bd5e684cc1f7e4d8bcbc.js" id="_loader-js"></script> <script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-7656930379472324" crossorigin="anonymous"></script> <script type="text/javascript">console.log("数据库查询:76次 | 页面生成耗时:2551.951ms");</script> </body></html>