Как уменьшить шрифт в этих дивах?

123
30 мая 2021, 12:10

шрифт категорически не хочет меняться, буду рад, если кто-то заодно сделает грид)

body{ 
  font-family: sans-serif; 
  margin: 0; 
  padding: 0; 
} 
header{ 
  height: 11vh; 
  font-weight: 100; 
}header :nth-child(1){ 
font-size: 30px; 
margin-left: 5%; 
 
}header :nth-child(2){ 
  margin-left: 60%; 
  margin-top: -6%; 
font-size: 33px; 
}header :nth-child(2) img{ 
  padding-right: 1%; 
} 
 
 
header a{ 
font-size: 18px !important; 
color: Peru; 
padding-bottom: 3px; 
text-decoration: none; 
border-bottom: 1px solid Peru; 
}header :nth-child(3){ 
  margin-left: 60%; 
margin-top: -2%; 
 
} 
 
 
 span{ 
font-weight: bold ; 
} 
#section0{ 
    width: 100%; 
  	height: 120vh; 
  	position: relative; 
  	background: url('bezimeni-27_E1v9oDX.png') no-repeat center/cover; 
color: white; 
background-attachment: fixed; 
}#section0 div{ 
  text-align: center; 
  font-size: 30px; 
  border: 2px solid white; 
  padding: 40px 40px 80px 40px; 
  width: 40%; 
  margin-left: 27%; 
position: relative; 
top: 250px; 
background: rgba(46, 46, 46, 0.8); 
}#section0 div h1, #section0 div h3{ 
margin: 0px 
 
}#section0 div h3{ 
  font-size: 38px ; 
}#section0 div a{ 
  border: 2px solid white; 
padding: 10px 16px; 
font-size: 20px; 
border-radius: 60px; 
cursor: pointer; 
color: white; 
position: relative; 
top: 30px; 
}#section0 div a:hover{ 
  background: black; 
} 
#section1{ 
  text-align: center; 
  }#section1 :nth-child(1){ 
    margin-top: 10%; 
    font-size: 40px; 
}#section1 .grid{ 
display: grid; 
grid-template-columns: repeat(3,1fr); 
font-size: 20px; 
}#section1 .grid [alt='0']{ 
 
}#section1 .grid [alt='1']{ 
 
}#section1 .grid [alt='2']{ 
 
}
<!DOCTYPE html> 
<html lang="en" dir="ltr"> 
  <head> 
    <meta charset="utf-8"> 
    <title></title> 
    <link rel="stylesheet" href="1.css"> 
  </head> 
  <body> 
<header> 
  <p><span class="span">DESIGN</span>STUDIO</p> 
  <p><img src="0.png" alt="">8 800 000-00-00</p> 
  <p><a href="#">Заказать звонок</a></p> 
</header> 
<section id="section0"> 
<div class=""> 
<h1>РАЗРАБОТКА</h1> 
<h1>ФИРМЕННОГО СТИЛЯ:</h1> 
<h3>от идеи до реализации</h3> 
<a href="#">↓</a> 
</div> 
</section> 
<section id="section1"> 
  <p>РАБОТАТЬ С НАМИ <span>ЛЕГКО И ПРИЯТНО</span></p> 
  <div class="grid"> 
<div class=""> 
<img src="https://media.lpgenerator.ru/images/245037/bezimeni-3_qwMWvjt.png#size_60x60" alt='0'> 
<p><span>СОБЛЮДАЕМ СРОКИ</span></p> 
<p>Разрабатываем лучшие 
креативные идеи 
и тщательно следим 
за соблюдением сроков</p> 
</div> 
<div class=""> 
<img src="https://media.lpgenerator.ru/images/245037/bezimeni-2_O1bIEFo.png#size_56x60" alt='1'> 
<p><span>ТАЛАНТЛИВЫЕ ДИЗАЙНЕРЫ</span></p> 
<p>Высококвалифицированные 
профессионалы, которые 
мыслят ярко и нестандартно</p> 
</div> 
<div class=""> 
<img src="https://media.lpgenerator.ru/images/245037/bezimeni-1_OmiiQCk.png#size_60x52" alt='2'> 
<p><span>ДОСТУПНАЯ ЦЕНА</span></p> 
<p>Гибкая система расценок 
позволяет сотрудничать как с крупными компаниями, 
так и с частными лицами</p> 
</div> 
  </div> 
</section> 
    <script type="text/javascript" src="1.js"></script> 
  </body> 
</html>

Answer 1

Нужно было просто заменить

  }#section1 :nth-child(1){

на

  }#section1 .p{

и добавить класс для того p

READ ALSO
Помогите сверстать loading circle

Помогите сверстать loading circle

Помогите сверстать такое: loading circle - ссылка на изображение

110
Как хранить иерархичные данные в списке

Как хранить иерархичные данные в списке

Есть классДанные я получаю из Excel файла, пробегаясь по разным листам

93
Как сложить два многочлена разной длины

Как сложить два многочлена разной длины

В общем, есть функция с перегруженным оператором сложенияЕсли степень многочленов одинаковая, то всё считает спокойно, но если степень многочленов...

96