我正在设计一个网站根据我布局的设计。 但我的短信是从最右方开始的。 我想在正文后面没有太大的空格。 使用margin-inlin-start
和margin-inlin-end
似乎并不奏效。
我现在所掌握的:
我想实现的目标:
HTML css样式:
p .welcome-text1 .welcome-text2 {
font-family: 'Montserrat';
font-size: 10px;
text-align: center;
font-weight: bold;
margin-inline-start: 40px;
margin-inline-end: 40px;
}
给你,如果你需要做任何调整,请告诉我。 唯一的改变你应该做的是添加您的边框。
null
<!doctype html>
<html lang="en">
<head>
<title>Title</title>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<!-- Bootstrap CSS -->
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
<style>
p .welcome-text1 .welcome-text2 {
font-family: 'Montserrat';
font-size: 10px;
text-align: center;
font-weight: bold;
margin-inline-start: 40px;
margin-inline-end: 40px;
}
.your-bg {
background-color: #3e4fa2;
}
</style>
</head>
<body class="your-bg">
<div class="container text-center text-white">
<h1>Welcome To The Data Science</h1>
<h1>And Machine Learning Platform</h1>
<hr class="bg-white">
<h3>
That provides the tools that allow you to explore your data seemlessly and get insights into your data and allows
you to easily apply Machine learning to make predictions with your data.
</h3>
</div>
<!-- Optional JavaScript -->
<!-- jQuery first, then Popper.js, then Bootstrap JS -->
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>
</body>
</html>
您可以使用Bootstrap的容器类,首先获取从Bootstrap网站复制的CDN,并将其添加到html文件中的head标记之前。 现在使用以下方法将所有内容放入“container”类中:
<div class='container'>
your content
</div>
尝试添加以下内容:
p .welcome-text1 .welcome-text2 {
display: block;
margin: 0% 10%;
}
您可以更改边距中的第二个参数。 这是左右两边的边距。 首先是顶部和底部。
霍普,那是救命啊!