首先，我对用HTML和CSS编码是非常非常陌生的.我已经学习了整整一周，我想我应该练习一下，试着帮助我记住一些元素、属性和属性.因此，您将要见证的代码可能会伤害您的眼睛，但在这件事上的任何帮助都将受到极大的欢迎.
我正在设计一个网站(它很可能永远不会上线，即使是它的最终形式)，我开始摆弄页脚元素.过了一会儿，我发现可以用div元素作为页脚.然而，无论我使用哪种方法，它最终都会覆盖屏幕上的文本.它确实粘在页面的底部，直到我向下滚动，它一直覆盖着正文内容.我知道这很可能是因为设计了正文的css代码，但我无论如何也搞不清楚.
我现在把它保存为div，但如果页脚会用得更好的话，请一定要让我知道.无论我犯了什么错误，只要我一遇到，我绝对想要把它们补上.
nav a {
color: black;
font-family: 'DM Sans', sans-serif;
font-size: 1.2em;
padding: 12px;
text-decoration: none;
width: 80%;
text-align: center;
padding-left: 5em;
padding-right: 2em;
}
.row {
display: flex;
}
.left-column {
height: 40vh;
flex: 50%;
}
.right-column {
height: 35vh;
flex: 50%;
background-position: center;
background-size: contain;
background-repeat: no-repeat;
}
#right-col-home {
background-image: url(https://s3.amazonaws.com/bprblogassets/blog/wp-content/uploads/2017/06/11165212/Power-Washing-Beginner.png);
margin-top: 12em;
}
.nav-bar {
border-width: 0em;
border-color: ghostwhite;
border-bottom: 0.15em solid gray;
font-family: 'Poppins', sans-serif;
background-color: ghostwhite;
overflow: auto;
padding: 0.8em;
margin-bottom: 2em;
}
.second-body {
font-family: 'Poppins', sans-serif;
padding-left: 10em;
padding-right: 10em;
color: slategray;
}
.main-heading {
font-size: 3em;
color: slategrey;
}
.body-text {
font-size: 1.0em;
}
.job-list {
font-size: 1.0em;
}
.main-body {
background-color: ivory;
min-height: 400px;
margin-bottom: 100px;
clear: both;
}
.question {
font-size: 1.7em;
font-weight: bolder;
}
.answer {
font-size: 1em;
}
.footer-bottom {
background: #343a40;
color: #686868;
height: 50px;
text-align: center;
position: absolute;
bottom: 0px;
left: 0px;
padding-top: 20px;
}<head>
<title>Cleaning by Mark</title>
<meta name="viewport" content="width=device-width, initial scale=1">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Poppins&display=swap" rel="stylesheet">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=DM+Sans&display=swap" rel="stylesheet">
<link href="styles.css" rel="stylesheet">
</head>
<body class="main-body">
<nav class=nav-bar>
<span style="font-size: 1.5em; font-weight: bold; color: slategray;">Commercial Cleaning</span>
<a href="index.html">HOME</a>
<a href="faq.html">FAQ</a>
<a href="contact.html">CONTACT</a>
<a href="gallery.html">GALLERY</a>
</nav>
<div class="second-body">
<div class="row">
<div class="left-column">
<h1 class="main-heading">FAQ</h1>
<h2>Some frequently asked questions with answers:</h2>
<br>
<br>
<h2 class="question">What services do you provide?</h2>
<h3 class="answer">A whole range of services is on offer, from patio and driveway cleaning to roof and conservatory cleaning! Feel free to check out the services offered on the 'Home' page. If you still have a question, or would like to enquire about another service,
feel free to access the 'Contact' page and get in touch any time.</h3>
<h2 class="question">What are your prices?</h2>
<h3 class="answer">It's always difficult to provide an accurate quote without first assessing the job. However, Mark will happily provide a free no obligation quote - you may be surprised!</h5>
<br>
<h2 class="question">Are you able to clean rooves on houses?</h2>
<h3 class="answer">Yes! Mark's reach isn't limited to bungalows, conservatories and annexes. With his state-of-the-art equipment, he will be able to clean all the moss and dirt from house rooves too!</h5>
<h2 class="question">Do I need to provide anything?</h2>
<h3 class="answer">Here at Commercial Cleaning, we will provide all tools and chemicals required to clean the job. However, there may need to be an access for water - this is more possible with larger jobs. But rest assured, there will be no cost to you - the
cost of water will be deducted from your final invoice!</h3>
</div>
<div class="right-column" id="right-col-home">
</div>
</div>
</div>
<!-- Footer -->
<div class="footer-bottom">
© 2022 | commercialcleaning.com | Designed by Kieran|
</div>
</body>先谢谢你.