Не получается выровнять заголовки по центру - HTML, CSS - Ответ 14101312

@What_is_Vladik · Регистрация: 28.09.2019

Author24 — интернет-сервис помощи студентам

Добрый день. Делаю сайт, курсовая работа. Не могу выровнять в блоке nav блоки li по центру. text-align по центру не помогает. Спасите.

HTML5

body{ background-color: #666666;}
 
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <link rel="stylesheet" href="assets/css/style.css" type="text/css">
    <title>Главная</title>
</head>
   
   <body>
        
         <div class="logo">
             <a href="index.html"><img class="graficlogo" src="assets/images/3d-logo.jpg" alt="logo id="anc></a>
         </div>
         
       <header>
                  <nav>
                      <ul>
                          <li><a href="#">Главная</a></li>
                          <li><a href="#">Основные понятия</a>
                          <li><a href="#">Карта сайта</a></li>
                          <li><a href="#">Об авторе</a></li>
                      </ul>
                  </nav>
       </header>
           
           <div class="content">
                <h2>Технологии реализации 3D графики при разработке компьютерных игр - обзор.</h2>
                    <p>
                     В своем обзоре «Технологии реализации 3D графики при разработке компьютерных игр», я постараюсь объяснить на простых примерах из игровой индустрии, к каким решениям приходят игровые разработчики, чтобы внедрить в свои проекты передовые технологии реализации трехмерной графики. Что представляют из себя данные технологии и каких усилий стоит внедрение последних самых передовых технологий 3D графики в свои проекты разработчикам. 
                    </p>    
           </div>
           
           <footer>
               <div>
                   <h3>О сайте</h3>
                   <p>
                       Сайт создавался как справочный материал, по заказу Федерального Государственного Бюджетного Образовательного Учреждения Высшего Образования <a href="http://www.istu.edu/">«Пупкинский национальный исследовательский технический университет» </a> для обзора технологий реализации 3d графики при разработке компьютерных игр.
                   </p>
                              
                   <div class="copyright">
                         &copy; 2019г. Пупкин Владислав Викторович <a href="пупкин@gmail.com">пупкин@gmail.com</a>
                   </div>
               </div>
           </footer>
   </body>
</html>

CSS

img {
    display:block;
    margin:auto;
}
 
.content {
    margin-left: 15%;
    margin-right: 15%;
    padding: 28px;
    background: #ffffff;
    border-bottom: solid 1px #ffffff;
    box-shadow: 0 0 10px;
}
 
footer {
    margin-left: 15%;
    margin-right: 15%;
    padding-top: 25px;
    text-align: center;
    color: #d3d3d3;
}
 
footer a{
    color: #eee;
    text-decoration: none;
}
 
footer a:hover{
    color: white;
    text-decoration: underline;
}
 
nav{
    font-size: 1.2em;
    margin-right: 15%;
    margin-left: 15%; 
    margin-top: 20px;
    margin-bottom: 25px;
    height: 77px;
    background-color: #373737;
}
 
 
nav ul {
  list-style: none;
}
 
nav li {
    float:left;
    text-align: center;
    width: 20%;
}
 
nav a {
    display: block;
    color: white;
    padding: 1.5em;
    text-decoration: none;
    border-radius:4px; закругление блоков
    border-right: 1px solid #BAD78B; Могут пригодиться
    -moz-transition: all 0.3s 0.01s ease;
    -o-transition: all 0.3s 0.01s ease;
    -webkit-transition: all 0.3s 0.01s ease;
}
 
nav a:hover {
    color: white;
    background: #504949;
}

Вернуться к обсуждению:
Не получается выровнять заголовки по центру HTML, CSS

Следующий ответ

Другие темы раздела
HTML, CSS Нахождение блока при перетаскивании Есть сортировка списка перетаскиванием. Взято тут.Стилизовано и выглядит как на первом скрине. В исходниках стилизовано общими ul и li. Но естественно эти стили будут влиять на всю страницу. Я попытался изолировать стили добавлением контейнера, примерно так #menu_out ul, #menu_out li { ...... border: 1px solid #3f3f3f; } Статичные списки подчинились, а перетаскиваемый нет. скрин 2.... https://www.cyberforum.ru/ html/ thread2555074.html	циферблат часов HTML, CSS Добрый день! подскажите пожалуйста, каким образом можно сверстать циферблат аналоговых часов используя только html и сss, где вместо черточек - цифры (от 1 до 12)? Только цифры, без стрелок!
HTML, CSS Grid, ограничить количество строчек, остальное скрыть https://www.cyberforum.ru/ html/ thread2555023.html Возможно ограничить количество строк через grid-template-rows, к примеру максимум две строчки, третья и последующую скрыть. Примечание, высота строчек адаптивная, неизвестна высота контента...	HTML, CSS Как поставить собственное изображение в качестве маркера https://www.cyberforum.ru/ html/ thread2555019.html Почему не ставится мое изображение? ошибка в коде? Изображение находится в папке img <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Cписки</title> <link rel="stylesheet" type="text/css" href="css/style.css"> </head>
Списки. Сложные селекторы HTML, CSS Как сделать такое в браузере?	HTML, CSS Как настроить, чтобы в iframe все ссылки открывались внутри окна? https://www.cyberforum.ru/ html/ thread2554935.html Возникла трудность, нужно, чтобы google талица открывалась в iframe с возможностью переключаться между листами таблицы через гиперссылки внутри окна iframe. Саму таблицу настроил: <iframe width="1340" height="475" frameborder="0"...
HTML, CSS Проблемы с псевдоклассом hover Здравствуйте, такая проблема: при наведении на тест не выполняется команда. Как исправить? <!DOCTYPE html> <html> <head> <meta charset="UTF-8"/> <title>NAME</title> <link href="1.css" rel="stylesheet" type="text/css"/> </head> <body> https://www.cyberforum.ru/ html/ thread2554916.html	HTML, CSS Переопределение свойства width Есть контейнер в body, 600px, можно ли сделать так чтобы один блок внутри него, брал ширину от body?
HTML, CSS Не работает form action https://www.cyberforum.ru/ html/ thread2554561.html Здравтвуйте. Имеется страничка и на ней есть виджет, с которого нужно отправить данные по запросу в теге form. Но проблема в том, что при отправке часть после знака вопроса обрезается и ошибка в студию. Как это исправить? <!doctype html> <html lang="ru"> <head> <meta charset="utf-8" /> <title></title> <link rel="stylesheet" href="style.css" /> </head> <body bgcolor="#000000">...	HTML, CSS Реализация прототипа интерфейса на Bootstrap 4 Привет. Не знаю, по адресу ли я (просьба перенаправить тему в соответствующий раздел, если это так). Подают нам в универе какую-то кривую вёрстку. Рисовали use-case, диаграммы баз данных, прототипы в ninjamock. Сейчас вот мне дали два прототипа также рисованных в ninjamock (см. картинки ниже) и дали задачу реализовать эти два интерфейса при помощи Bootstrap 4. ... https://www.cyberforum.ru/ html/ thread2553868.html
HTML, CSS Flex, выравнивание без медиа Здраствуйте, подскажите пожалуйста, задали задание на лабораторной: Создать выровненную по правому краю навигацию в самом верху сайта. Для экранов среднего размера нужно, чтобы она выравнивалась по центру. Для экранов маленьких нужно, чтобы она превращалась в один столбец. Без использования @ media-запросов используя flexbox! Находил в интернете точно такое, но с медиа-запроами. Можно...	HTML, CSS Картинки во фрейме Помогите пожалуйста. Я делаю простой сайт. У меня не работают картинки вставленные в строковый фрейм. Причем на домашнем компе все нормально, а вот когда залил на сайт тогда всё.., облом. Может кто-то знает в чем тут дело? сайт хостинга ucoz.ru https://www.cyberforum.ru/ html/ thread2553594.html

	16.12.2019, 21:04