weixin_53346076 2022-04-28 16:15 采纳率: 100%
浏览 134
已结题

hmtl中css样式设置过后页面没有滚动条且无法滚动怎么解决

无法显示滚动条且无法滚动
问题相关代码,请勿粘贴截图
运行结果及报错内容
overflow属性改为auto后依旧无效
我想要达到的结果
.a1{
    width: 100%;
    height: 78px;
    overflow: visible;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 11;
    background-color: black;
    position: fixed;
}
.a1-1{
    float: left;
    display: block;
    width: 100%;
    height: 100%;
    text-decoration: none;
}
.a2{
    float: left;
    width: 167px;
    height: 60px;
    text-decoration: none;
}
.a2-1{
    display: block;
    position: absolute;
    background-position: center center;
    background-repeat: no-repeat;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
}
.a2-2{
    display: block;
    width: 100%;
    height: 100%;
    text-decoration: none;
    list-style: none;
    list-style-position: outside;
    list-style-image: none;
    list-style-type: none;
    text-align: center;
}
.logo{
    float: left;
    width: 160px;
    height: 67px;
    margin-top: 10px;
    text-decoration: none;
}
a{
    text-decoration: none;
}
.ul-1{
    float: left;
    width: 55%;
    height: 78px;
    box-sizing: border-box;
    margin-left: 30px;
    padding-top: 16px;
    list-style: none;
    padding: 0px;
    margin: 0px;
}
li{
    float: left;
    list-style: none;
    list-style-position: outside;
    list-style-image: none;
    list-style-type: none;
    width: 20%;
    height: 78px;
    text-align: center;
}
.span-1{
    display: block;
    color: #fff;
    font-size: 18px;
    letter-spacing: 1px
}
.span-2{
    display: block;
    color: #aeaeae;
    font-size: 11px;
    margin-top: -1px;
    letter-spacing: 1px
}
.video-center{
    width: 1920px;
    height: 990px;
    display: block;
    position: absolute;
    top: 78px;
    left: 50%;
    margin-left: -960px;
    pointer-events: none;
    overflow: auto;
    overflow-x: auto;
    overflow-y: auto;
}
.video-top{
    pointer-events: none;
}


<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <title>期末</title>
        <link rel="stylesheet" href="css/QiMo.css">
    </head>
    <body>
        <div class="a1">
            <div class="a2">
                <a class="logo" href="#" title="英雄联盟官网">
                    <img src="img/logo.jpg" alt="英雄联盟" width="157px" height="60px">
                </a>
            </div>
            <div class="ul-1">
                <ul>
                    <li>
                        <a class="a1-1" href="#" title="游戏资料">
                            <span class="span-1">游戏资料</span>
                            <span class="span-2">GAME INFO</span>
                        </a>
                    </li>
                    <li>
                        <a class="a1-1" href="#" title="商城/合作">
                            <span class="span-1">商城/合作</span>
                            <span class="span-2">STORE</span>
                        </a>
                    </li>
                    <li>
                        <a class="a1-1" href="#" title="社区互动">
                            <span class="span-1">社区互动</span>
                            <span class="span-2">COMMUNITY</span>
                        </a>
                    </li>
                    <li>
                        <a class="a1-1" href="#" title="赛事官网">
                            <span class="span-1">赛事官网</span>
                            <span class="span-2">ESPORTS</span>
                        </a>
                    </li>
                    <li>
                        <a class="a1-1" href="#" title="自助系统">
                            <span class="span-1">自助系统</span>
                            <span class="span-2">SYSTEM</span>
                        </a>
                    </li>
                </ul>
            </div>
            <div class="video-center">
                <video class="video-top" autoplay="autopaly" loop="loop" muted="1">
                    <source src="img/video.webm" type="video/webm">
                    <source src="img/video.mp4" type="video/mp4">
                </video>
            </div>
        </div>
    </body>
</html>



  • 写回答

1条回答 默认 最新

  • 浪客 2022-04-29 22:07
    关注

    <div class="video-center"> 放到<div class="a1">外面。

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论 编辑记录

报告相同问题?

问题事件

  • 系统已结题 5月9日
  • 已采纳回答 5月1日
  • 创建了问题 4月28日

悬赏问题

  • ¥20 机器学习能否像多层线性模型一样处理嵌套数据
  • ¥20 西门子S7-Graph,S7-300,梯形图
  • ¥50 用易语言http 访问不了网页
  • ¥50 safari浏览器fetch提交数据后数据丢失问题
  • ¥15 matlab不知道怎么改,求解答!!
  • ¥15 永磁直线电机的电流环pi调不出来
  • ¥15 用stata实现聚类的代码
  • ¥15 请问paddlehub能支持移动端开发吗?在Android studio上该如何部署?
  • ¥20 docker里部署springboot项目,访问不到扬声器
  • ¥15 netty整合springboot之后自动重连失效