Написать код на CSS и HTML

Question

Написать код на CSS и HTML

Артём Крекер Ученик (187), на голосовании 11 месяцев назад

Answer 1

cenya Знаток (459) 1 год назад

что? кс соурс? конечно го

Артём КрекерУченик (187) 1 год назад

ура! жду ответа!

Answer 2

Степа Салин Знаток (481) 1 год назад

Я знаю как

Артём КрекерУченик (187) 1 год назад

это круто! я очень нужнаюсь в вашем ответе :)

Answer 3

На <div>ах делай да и всё, подвал флексом придавишь

Answer 4

HTML (index.html):

  
 
 
     
     
    Document 
     
 
 
     
         
            Шапка сайта 
        
 
         
             
                Левая колонка 
            
 
             
                Область контента 
            
 
        
 
         
            Подвал сайта

CSS (styles.css):

 body, html { 
    height: 100%; /* Нужно для поддержания высоты окна */ 
} 
 
.container { 
    width: 100%; 
    height: 100%; 
    background-color: red; /* Подкраска */ 
    text-align: center; 
 
    /* Настройка шрифта на весь сайт */ 
    font-family: Arial, Helvetica, sans-serif; 
    font-size: 18px; 
    font-weight: 800; 
} 
 
.site_header { 
    width: 100%; 
    height: 100px; 
    background-color: cornflowerblue; /* Подкраска */ 
} 
 
.middle_info { 
    width: 100%; 
    height: calc(100% - 100px - 100px); 
    background-color: pink; /* Подкраска */ 
    display: flex; 
} 
 
.middle_info > .left_column { 
    width: 100px; 
    height: 100%; 
    background-color: skyblue; /* Подкраска */ 
} 
 
.middle_info > .content { 
    width: calc(100% - 100px); 
    height: 100%; 
    background-color: aquamarine; /* Подкраска */ 
} 
 
.lower_info { 
    width: 100%; 
    height: 100px; 
    background-color: cadetblue; /* Подкраска */ 
}

Пожалуйста

Answer 5

Я бы уже не стал делать как выше. Есть более современные средства. Внизу пример на гриде с адаптивным поведением.

  
 
 
     
     
    Grid Layout with Responsive Design 
     
 
 
     
        Шапка сайта
 
    
 
     
         
            Левая колонка
 
        
 
         
            Область контента
 
        
 
    
 
     
        Подвал сайта