Выравнивание текста с помощью html - css - PullRequest
Новая
       0

Выравнивание текста с помощью html - css

0 голосов
/ 20 июня 2020

Я оформляю веб-сайт в соответствии с разработанным мною дизайном. Но мой текст начинается с крайней правой. Я хочу быть немного посередине без большого промежутка после текста. Использование margin-inline-start и margin-inline-end, похоже, не помогает.

То, что у меня есть:

enter image description here

Что я хотите достичь:

enter image description here

Стиль 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;
}

Ответы [ 3 ]

0 голосов
/ 20 июня 2020

Попробуйте добавить это: 

p .welcome-text1 .welcome-text2 {
    display: block;
    margin: 0% 10%;
}

Вы можете изменить второй параметр в поле. это поле слева и справа. Сначала сверху и снизу.

Надеюсь, это поможет!

0 голосов
/ 20 июня 2020

Здесь вы go, дайте мне знать, если вам нужны какие-либо изменения. Единственное изменение, которое вам нужно сделать, это добавить в рамку. 

<!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>
0 голосов
/ 20 июня 2020

вы можете использовать класс контейнера Bootstrap Сначала скопируйте CDN с веб-сайта bootstrap и добавьте его в свой html файл перед тегом head. Теперь поместите все свое содержимое в класс контейнера, используя: 

<div class='container'>
    your content
</div>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...