基于SpringBoot个人博客项目源码附带截图和部署教程_基于springboot的个人博客资源-CSDN文库

共2000个文件

js：820个

html：444个

css：240个

版权申诉

springboot

毕业设计

mysql

博客系统

javaweb

5星 · 超过95%的资源 135 浏览量 2022-06-15 09:05:20 上传评论 3 收藏 36.88MB ZIP 举报

资源推荐

资源详情

资源评论

收起资源包目录

基于SpringBoot个人博客项目源码附带截图和部署教程（2000个子文件）

AUTHORS 6KB

BlogVO.class 11KB

Blog.class 9KB

Comment.class 8KB

Comment.class 6KB

User.class 6KB

BlogController.class 6KB

BlogServiceImpl.class 5KB

TypeController.class 5KB

TagController.class 5KB

BlogServiceImpl.class 4KB

CommentServiceImpl.class 4KB

IndexController.class 3KB

TagServiceImpl.class 3KB

TypeServiceImpl.class 3KB

LogAspect.class 3KB

BlogAndTag.class 3KB

TypeController.class 3KB

TypeVO.class 3KB

TagVO.class 3KB

BlogAndTag.class 3KB

MarkDownToHtmlUtils.class 3KB

CommentController.class 2KB

Type.class 2KB

Tag.class 2KB

LoginController.class 2KB

BlogQuery.class 2KB

TagsUtils.class 2KB

ControllerExceptionHandler.class 2KB

BlogMapper.class 2KB

BlogService.class 2KB

Message.class 2KB

WebConfig.class 1KB

UserServiceImpl.class 1KB

MarkDownToHtmlUtils$CustomAttributeProvider.class 1KB

LogAspect$RequestLog.class 1KB

TagServiceTest.class 1KB

BlogController.class 1KB

LoginInterceptor.class 1KB

MD5Utils.class 1KB

MyBatisPlusConfig.class 1KB

ArchiveController.class 1KB

BlogMapper.class 1KB

BlogService.class 1KB

MarkDownToHtmlUtils$1.class 949B

TypeService.class 903B

NotFoundException.class 860B

TagService.class 857B

AdminApplication.class 812B

WebApplication.class 806B

TypeServiceImpl.class 789B

TagServiceImpl.class 780B

AboutController.class 587B

TypeMapper.class 472B

TagMapper.class 467B

CommentService.class 426B

BlogAndTagsMapper.class 396B

CommentMapper.class 385B

TypeMapper.class 376B

UserMapper.class 376B

TagMapper.class 373B

UserService.class 263B

TypeService.class 231B

TagService.class 227B

semantic.min.css 614KB

animate.css 97KB

editormd.css 81KB

editormd.min.css 60KB

editormd.preview.css 59KB

共 2000 条

<!DOCTYPE html> <html lang="en" xmlns:th="http://www.thymeleaf.org"> <head th:replace="blogfragments :: head(~{::title})"> <meta charset="utf-8"> <meta name="viewport" content="width=device-width,initial-scale=1.0" /> <title>博客详情</title> <link rel="stylesheet" href="../static/css/semantic.min.css"> <link rel="stylesheet" type="text/css" href="../static/css/typo.css" /> <link rel="stylesheet" type="text/css" href="../static/css/animate.css" /> <link rel="stylesheet" type="text/css" href="../static/plugins/prism/prism.css" /> <link rel="stylesheet" type="text/css" href="../static/plugins/prism/prism-toolbar.css" /> <link rel="stylesheet" type="text/css" href="../static/plugins/tocbot/tocbot.css" /> <link rel="stylesheet" type="text/css" href="../static/css/manster.css" /> </head> <body>  <nav th:replace="blogfragments :: menu(0)" class="ui inverted attached segment m-padded-tb-mini"> <div class="ui container"> <div class="ui inverted secondary stackable menu"> <h2 class="ui teal header item">MansterBlog</h2> <a href="#" class="m-item item m-mobile-hide"><i class="small home icon"></i>首页</a> <a href="#" class="m-item item m-mobile-hide"><i class="small idea icon"></i>分类</a> <a href="#" class="m-item item m-mobile-hide"><i class="small tags icon"></i>标签</a> <a href="#" class="m-item item m-mobile-hide"><i class="small clone icon"></i>归档</a> <a href="#" class="m-item item m-mobile-hide"><i class="small info icon"></i>关于我</a> <div class="right m-item item m-mobile-hide"> <div class="ui icon inverted transparent input"> <input type="text" placeholder="搜索"> <i class="search link icon"></i> </div> </div> </div> </div> <a href="#" class="ui menu toggle black icon button m-right-top m-mobile-show"> <i class="sidebar icon"></i> </a> </nav>  <div class="m-bg-type_outer" style="width: 100%;height: 50%"> <img src="https://picsum.photos/id/1016/800/450" th:src="@{${blog.firstPicture}}" alt="" class="ui m-bg image" style="width: 100%;height: 100%"> <div class="m-bg-class_cover"> <div class="ui container" style="position: relative ;bottom: -540px;"> <h2 class="m-font-size-title-large" align="center" th:text="${blog.title}">中文网页重设与排版</h2> <div class="ui container" align="center"> <div class="ui horizontal link list" align="center"> <div class="item"> <div class="ui orange inverted button" style="font-size: 7px" th:text="${blog.flag}">原创</div> </div> <div class="item"> <img src="https://picsum.photos/id/103/100/100" th:src="@{${blog.user.avatar}}" alt="" class="ui avatar image"> <a href="#" style="color: #ffffff;font-size: 15px" th:text="${blog.user.nickname}">manster</a> </div> <div class="item"> <i class="calendar icon m-font-size-text-mini"></i> <span class="m-font-size-text-mini" th:text="${#temporals.format(blog.updateTime, 'yyyy-MM-dd HH:mm')}" >2021-03-25</span> </div> <div class="item"> <i class="clone icon m-font-size-text-mini"></i> <a href="#" target="_blank" style="color: #ffffff;font-size: 16px" th:text="${blog.type.name}">个人总结</a> </div> <div class="item"> <i class="eye icon m-font-size-text-mini"></i> <span class="m-font-size-text-mini" th:text="${blog.views}">375</span> </div> <div class="item"> <i class="comment outline icon m-font-size-text-mini"></i> <span class="m-font-size-text-mini">3</span> </div> </div> </div> </div> </div> </div>  <div id="waypoint" class="m-container animate__animated animate__fadeIn m-opacity"> <div class="ui container"> <div class="ui attached padded segment">  <div id="content" class="typo typo-selection js-toc-content m-padded-lr-responsive m-padded-tb-large" th:utext="${blog.content}"> <h2 id="section1">一、关于 <i class="serif">Typo.css</i></h2> <p><i class="serif">Typo.css</i> 的目的是，在一致化浏览器排版效果的同时，构建最适合中文阅读的网页排版。</p> <h4>现状和如何去做：</h4> <p class="typo-first">排版是一个麻烦的问题 <sup><a href="#appendix1"># 附录一</a></sup>，需要精心设计，而这个设计却是常被视觉设计师所忽略的。前端工程师更常看到这样的问题，但不便变更。因为在多个 OS 中的不同浏览器渲染不同，改动需要多的时间做回归测试，所以改变变得更困难。而像我们一般使用的 Yahoo、Eric Meyer 和 Alice base.css 中采用的 Reset 都没有很好地考虑中文排版。<i class="serif">Typo.css</i> 要做的就是解决中文排版的问题。</p> <p><strong><i class="serif">Typo.css</i> 测试于如下平台：</strong></p> <table class="ui table" summary="Typo.css 的测试平台列表"> <thead> <tr> <th>OS/浏览器</th> <th>Firefox</th> <th>Chrome</th> <th>Safari</th> <th>Opera</th> <th>IE9</th> <th>IE8</th> <th>IE7</th> <th>IE6</th> </tr> </thead> <tbody> <tr> <td>OS X</td> <td>✔</td> <td>✔</td> <td>✔</td> <td>✔</td> <td>-</td> <td>-</td> <td>-</td> <td>-</td> </tr> <tr> <td>Win 7</td> <td>✔</td> <td>✔</td> <td>✔</td> <td>✔</td> <td>✔</td> <td>✔</td> <td>✔</td> <td>-</td> </tr> <tr> <td>Win XP</td> <td>✔</td> <td>✔</td> <td>✔</td> <td>✔</td> <td>-</td> <td>✔</td> <td>✔</td> <td>✔</td> </tr> <tr> <td>Ubuntu</td> <td>✔</td> <td>✔</td> <td>-</td> <td>✔</td> <td>-</td> <td>-</td> <td>-</td> <td>-</td> </tr> </tbody> </table> <h4>中文排版的重点和难点</h4> <p>在中文排版中，HTML4 的很多标准在语义在都有照顾到。但从视觉效果上，却很难利用单独的 CSS 来实现，像<abbr title="在文字下多加一个点">着重号</abbr>（例：这里<em class="typo-em">强调一下</em>）。在 HTML4 中，专名号标签（<code><u></code>）已经被放弃，而 HTML5 被<a href="//html5doctor.com/u-element/">重新提起</a>。<i class="serif">Typo.css</i> 也根据实际情况提供相应的方案。我们重要要注意的两点是：</p> <ol> <li>语义：语义对应的用法和样式是否与中文排版一致</li> <li>表现：在各浏览器中的字体、大小和缩放是否如排版预期</li> </ol> <p>对于这些，<i class="serif">Typo.css</i> 排版项目的中文偏重注意点，都添加在附录中，详见：</p> <blockquote> <b>附录一</b>：<a href="#appendix1"><i class="serif">Typo.css</i> 排版偏重点</a> </blockquote> <p>目前已有像百姓网等全面使用 <i class="serif">Typo.css</i> 的项目，测试平台的覆盖，特别是在<abbr title="手机、平板电脑等移动平台">移动端</abbr>上还没有覆盖完主流平台，希望有能力的同学能加入测试行列，或者加入到 <i class="serif">Typo.css</i> 的开发。加入方法：<a href="https://github.com/sofish/Typo.css">参与 <i class="serif">Typo.css</i> 开发</a>。如有批评、

评论收藏

内容反馈

版权申诉