0
我目前通过构建简单的投资组合来学习引导。但我对如何完全显示提交按钮一无所知，除非我将浏览器缩小到90％，并且提交按钮将完全显示。有没有办法在这些问题上取得更好的结果？Html Button Submit未完全显示
样本HTML：
<style>
\t \t section {
\t \t \t width: 100vw;
\t \t \t height: 100vh;
\t \t \t padding: 50px;
\t \t }
\t \t .cl_white {
\t \t \t color: white;
\t \t }
\t \t img {
\t \t \t width: 300px;
\t \t \t transition: opacity 1s ease-in-out;
\t \t }
\t \t img:hover{
\t \t \t opacity: .5;
\t \t }
\t \t .col-text{
\t \t \t -webkit-column-count: 3;
\t \t }
\t \t div.panel-body img {
\t \t \t transition: opacity .5s ease-in-out;
\t \t }
\t \t div.panel-body img:hover {
\t \t \t opacity: .5;
\t \t }
\t </style><script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<!DOCTYPE html>
<html>
<head>
\t <title></title>
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<!-- Optional theme -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous">
<!-- Latest compiled and minified JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
\t
</head>
<body data-spy="scroll" data-target=".navbar">
\t <nav class="navbar navbar-inverse navbar-fixed-bottom">
\t \t <ul class="nav navbar-nav">
\t \t \t <li><a href="#home">Home</a></li>
\t \t \t <li><a href="#work">My Work</a></li>
\t \t \t <li><a href="#about">About</a></li>
\t \t \t <li><a href="#contact">Contact</a></li>
\t \t </ul>
\t </nav>
\t <section id="home" style="background: url(images/header.jpg); background-size: 100% 100%;" class="cl_white text-center">
\t \t <h1>My Portfolio</h1>
\t \t <p class="lead"> Let Just read.</p>
\t \t <button class="btn btn-success">Contact Me</button>
\t </section>
\t <section id="work" class="container">
\t \t <div class="row">
\t \t \t <div class="page-header">
\t \t \t \t <h1 class="text-center">My Work</h1>
\t \t \t </div>
\t \t </div>
\t \t <div class="row">
\t \t \t <div class="col-md-12 text-center">
\t \t \t \t <img src="images/__portfolio-1.jpg" class="img-thumbnail">
\t \t \t \t <img src="images/__portfolio-1.jpg" class="img-thumbnail">
\t \t \t \t <img src="images/__portfolio-1.jpg" class="img-thumbnail">
\t \t \t </div>
\t \t </div>
\t \t <div class="row">
\t \t \t <div class="col-md-12 text-center">
\t \t \t \t <img src="images/__portfolio-1.jpg" class="img-thumbnail">
\t \t \t \t <img src="images/__portfolio-1.jpg" class="img-thumbnail">
\t \t \t \t <img src="images/__portfolio-1.jpg" class="img-thumbnail">
\t \t \t </div>
\t \t </div>
\t </section>
\t <section id="about" class="container">
\t \t <h2 class="text-center">About</h2>
\t \t <div class="col-text">Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt. Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit, sed quia non numquam eius modi tempora incidunt ut labore et dolore magnam aliquam quaerat voluptatem. Ut enim ad minima veniam, quis nostrum exercitationem ullam corporis suscipit laboriosam, nisi ut aliquid ex ea commodi consequatur? Quis autem vel eum iure reprehenderit qui in ea voluptate velit esse quam nihil molestiae consequatur, vel illum qui dolorem eum fugiat quo voluptas nulla pariatur?</div><br>
\t \t <div class="row">
\t \t \t <div class="col-md-6">
\t \t \t \t <div class="panel panel-primary">
\t \t \t \t \t <div class="panel-heading">
\t \t \t \t \t \t <h4>Web Designing</h4>
\t \t \t \t \t </div>
\t \t \t \t \t <div class="panel-body">
\t \t \t \t \t \t <img src="images/_www.jpg" class="img-circle center-block">
\t \t \t \t \t \t <p class="lead text-center">I Do Web Designing.</p>
\t \t \t \t \t </div>
\t \t \t \t \t <div class="panel-footer"></div>
\t \t \t \t </div>
\t \t \t </div>
\t \t \t <div class="col-md-6">
\t \t \t \t <div class="panel panel-primary">
\t \t \t \t \t <div class="panel-heading">
\t \t \t \t \t \t <h4>Web Designing</h4>
\t \t \t \t \t </div>
\t \t \t \t \t <div class="panel-body">
\t \t \t \t \t \t <img src="images/_www.jpg" class="img-circle center-block">
\t \t \t \t \t \t <p class="lead text-center">I Do Web Designing.</p>
\t \t \t \t \t </div>
\t \t \t \t \t <div class="panel-footer"></div>
\t \t \t \t </div>
\t \t \t </div>
\t \t </div>
\t </section>
\t
\t <section id="contact" style="background: silver;">
\t \t <div class="page-header">
\t \t \t <h2 class="text-center">Contact Me!</h>
\t \t </div>
\t \t <form class="col-md-5 col-md-offset-4">
\t \t \t <div class="form-group">
\t \t \t \t <input class="form-control" placeholder="Insert your Name" type="text">
\t \t \t </div>
\t \t \t <div class="form-group">
\t \t \t \t <input class="form-control" placeholder="Insert your Email" type="email">
\t \t \t </div>
\t \t \t <div class="form-group">
\t \t \t \t <input class="form-control" placeholder="Subject" type="text">
\t \t \t </div>
\t \t \t <div class="form-group">
\t \t \t \t <textarea class="form-control" rows="10">Comments</textarea>
\t \t \t </div>
\t \t \t <div class="form-group">
\t \t \t \t <input class="btn btn-success btn-block" type="submit">
\t \t \t </div>
\t \t </form>
\t </section>
</body>
</html>
请创建[MVCE]（https://stackoverflow.com/help/mcve），而不是在问题中粘贴整个网站。你会得到更好的答案，因为人们将有时间阅读一小段代码来隔离问题，而不是经历与您的问题无关的不必要的混乱。 –