Docsify README页面无法滚动

问题描述

我正在使用Docsify显示某些降价页面,但遇到一个问题:主页index.html不能滚动浏览README.md中的所有文本。 / p>

这是我的index.html页:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>My Documentation</title>
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
  <meta name="description" content="My Documentation Description">
  <meta name="viewport" content="width=device-width,user-scalable=no,initial-scale=1.0,maximum-scale=1.0,minimum-scale=1.0">
  <link rel="stylesheet" href="//cdn.jsdelivr.net/npm/docsify/lib/themes/vue.css">
  <script type="text/javascript">
    document.querySelector('link[title=theme]').href="//unpkg.com/docsify/lib/themes/dark.css";
  </script>
  <style type="text/css">
    .sidebar li {
      margin: 0;
      line-height: 1.7em;
    }
    .sidebar ul li ul {
      padding-bottom: 10px;
    }
    .sidebar-nav>ul>li>p {
      font-size: 17px;
      text-transform: uppercase;
    }
  </style>
</head>
<body>
  <div id="app">Loading....</div>
  <script src="//unpkg.com/docsify-edit-on-github/index.js"></script>
  <script>
    window.$docsify = {
      name: 'My Docs',repo: '',auto2top: true,executeScript: true,loadSidebar: true,maxLevel: 4,subMaxLevel: 1,search: {
        paths: 'auto',},}
  </script>
  <script src="//cdn.jsdelivr.net/npm/docsify/lib/docsify.min.js"></script>
  <script src="//unpkg.com/docsify/lib/docsify.min.js"></script>
  <script src="//unpkg.com/docsify/lib/plugins/search.min.js"></script>
  <script src="//unpkg.com/docsify/lib/plugins/emoji.min.js"></script>
  <script src="//unpkg.com/docsify-copy-code"></script>
  <script src="//unpkg.com/prismjs/components/prism-php.min.js"></script>
  <script src="//unpkg.com/prismjs/components/prism-sql.min.js"></script>
  <script src="//unpkg.com/prismjs/components/prism-json.min.js"></script>
</body>
</html>

这是我的README.md页面:

# My Personal Documentation

Some documentation

angularStuff: 

asanaStuff: 

assemblyStuff: 

&nbsp;  
&nbsp;  

bashStuff: 

batchStuff: 

bootstrapStuff: 

my repo
- **this is my docs repo for these docs**
&nbsp;  
&nbsp;  

cards: 
- **repository to keep track of**
&nbsp;  
&nbsp;  

cSharpStuff:
&nbsp;  
&nbsp;  

excelStuff: 

javaStuff:

javaScriptStuff: 

&nbsp;  
&nbsp;  

luaStuff: 

&nbsp;  
&nbsp;  

miscStuff: 
- **miscellaneous stuff I couldn't think of where to put**
&nbsp;  
&nbsp;  

mySQLStuff: 

&nbsp;  
&nbsp;  

oracleStuff: 

&nbsp;  
&nbsp;  

phpStuff: 

prs: 
- **repository to keep track of PRs I reviewed from Lendio**
&nbsp;  
&nbsp;  

pythonStuff: 

&nbsp;  
&nbsp;  

rubyStuff: yStuff

&nbsp;  
&nbsp;  

sqlServerStuff: ServerStuff

&nbsp;  
&nbsp;  

typeScriptStuff: eScriptStuff

&nbsp;  
&nbsp;  

vueStuff: 

&nbsp;  
&nbsp;  

writing: 

这是它对我显示的屏幕截图:

enter image description here

在我的屏幕快照中,显示的最后一个内容是javaScriptStuff:,但是如果您查看我的README.md,之后会有很多东西可以滚动到,但我不能滚动。

在此屏幕截图中并没有真正看到它,但是右侧没有滚动条,可以让我向下滚动以查看其余内容。

一如既往,正确且明确解释的答案将被标记为已接受答案并被赞成。

谢谢。

解决方法

发布此问题后,我问了几个同事,并直接回答了我的问题。我需要在overflow的css块中为index.html指定一个值。

我要做的就是添加以下内容:

.content {
  overflow: auto;
}

到以<style type="text/css">开头的块,现在可以看到垂直滚动条。

相关问答

依赖报错 idea导入项目后依赖报错,解决方案:https://blog....
错误1:代码生成器依赖和mybatis依赖冲突 启动项目时报错如下...
错误1:gradle项目控制台输出为乱码 # 解决方案:https://bl...
错误还原:在查询的过程中,传入的workType为0时,该条件不起...
报错如下,gcc版本太低 ^ server.c:5346:31: 错误:‘struct...