1 / 1 / 1
Регистрация: 23.11.2015
Сообщений: 90
1

Нужен совет

10.08.2017, 13:34. Показов 640. Ответов 1
Метки нет (Все метки)

Author24 — интернет-сервис помощи студентам
Всем привет. Необходимо сделать сайт с кривыми блоками. Фон заливается картинками. Кто нибудь знает как сделать такую верстку + она должна адаптироваться под мобилку.
Миниатюры
Нужен совет  
0
10.08.2017, 13:34
Programming
Эксперт
39485 / 9562 / 3019
Регистрация: 12.04.2006
Сообщений: 41,671
Блог
10.08.2017, 13:34
Ответы с готовыми решениями:

Нужен совет )
Здравствуйте . Что нужно учить после HTML и CSS для создания сайта? И в какой последовательности ? Дайте , пожалуйста , советы.

Нужен совет
Привет, как лучше украсить низ шаблона в моем случае? Просто как на меня то монотонный низ не очень хорошо смотрится.

Совет дизайнера нужен:)
Ребятки, дайте плиз совет небольшой) я вот решил сделать себе сайт, сделать своими руками Хотел бы узнать ваше мнение по поводу) ...

1
32 / 32 / 24
Регистрация: 16.04.2015
Сообщений: 219
12.08.2017, 19:50 2
Такую тему правильнее было бы разметить в разделе HTML\CSS, ну раз тема тут, то отвечу тоже здесь. Как пример, я бы наверное делал бы так https://jsfiddle.net/0v50aecf/... v5MJCs0MRC Насчет адаптации такого варианта под мобилку ничего сказать не могу, но если попробовать верстать на бутстраре, то может быть и получиться придти к нормальному варианту.
HTML5
1
2
3
4
5
6
7
8
9
10
<div class="container-blue">
<div class="top-gorka-blue"></div>
<div class="content-blue"></div>
<div class="bottom-gorka-blue"></div>
</div>
<div class="container-red">
<div class="top-gorka-red"></div>
<div class="content-red"></div>
<div class="bottom-gorka-red"></div>
</div>
CSS
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
.container-blue, .container-red {
  position: relative;
}
 
.container-red {
  top: -120px;
}
 
.top-gorka-blue {
  border-color: transparent transparent lightblue transparent ;
  border-style: solid;
  border-width: 0 0 70px 510px;
  display: block;
}
 
.content-blue {
  background-color: lightblue;
  padding: 80px;
}
 
.bottom-gorka-blue {
  border-color: transparent transparent transparent lightblue ;
  border-style: solid;
  border-width: 0 0 80px 510px;
  display: block;
}
 
.top-gorka-red {
  border-color: transparent transparent transparent red;
  border-style: solid;
  border-width: 40px 0 0px 510px;
  display: block;
}
 
.content-red {
  background-color: red;
  padding: 80px;
}
 
.bottom-gorka-red {
  border-color: transparent transparent transparent red;
  border-style: solid;
  border-width: 0 0 70px 510px;
  display: block;
}
0
Надоела реклама? Зарегистрируйтесь и она исчезнет полностью.
inter-admin
Эксперт
29715 / 6470 / 2152
Регистрация: 06.03.2009
Сообщений: 28,500
Блог
12.08.2017, 19:50
Помогаю со студенческими работами здесь

Нужен совет с шапкой
Есть сайт wolbro.uphero.com , вместо девушки и мужчины на шапке они хотят видеть свой коллектив, это нужно в фотостудии делать?

Нужен совет опытных!
Здравствуйте я начинающий веб-дизайнер (совсем начинающий) и не опытный хочу сделать главную страницу, для сайта на wordpress (но может...

Нужен совет професионалов!
Привет всем форумчанам! Прошу подскажите пожалуйста какие плюсы а какие минуса у этого сайта http://www.danki-models.com/ , что стоит...

Нужен совет по поводу дизайна
Вот сверстал дизайн.Вроде бы все что хотел сделал, но уже который день мучаюсь с цветовым оформлением. Сегодня более менее наладил дела с...

Нужен совет по дизайну и цветам :) >>>
Здравствуйте! Хочу попросить совет по оптимизации дизайна или просто цвета страницы, Тематика страницы: Игры/программирование ...


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
2
Ответ Создать тему

Редактор формул (кликните на картинку в правом углу, чтобы закрыть)
Опции темы

Новые блоги и статьи
Linux API: Полное руководство
hw_wired 08.02.2025
Linux API – это низкоуровневый программный интерфейс, обеспечивающий взаимодействие пользовательских приложений с ядром операционной системы. Он включает набор системных вызовов, библиотечных функций. . .
Асинхронное программировани­­­­­е и эмуляция async/await в C (СИ)
hw_wired 08.02.2025
Язык программирования C, несмотря на свой возраст, предоставляет неплохие средства для реализации асинхронных операций, позволяя создавать эффективные решения для обработки параллельных задач. В. . .
Как сгенерировать случайное число в указанном диапазоне в JavaScript
bytestream 08.02.2025
В JavaScript генерация случайных чисел основана на детерминированном алгоритме, который создает последовательность псевдослучайных значений. Встроенный метод Math. random() возвращает псевдослучайное. . .
Как получить список всех таблиц в PostgreSQL
bytestream 08.02.2025
PostgreSQL предлагает несколько методов для получения списка таблиц в базе данных. Наиболее распространенный способ - использование системного каталога pg_tables, который содержит информацию обо всех. . .
Java Spring для начинающих
bytestream 08.02.2025
Spring Framework - это универсальное решение для создания корпоративных Java-приложений. Он предоставляет комплексную программную и конфигурационную модель для современных приложений на Java. Spring. . .
Асинхронное программировани­­­­­­е и async/await в Visual Basic
bytestream 08.02.2025
В основе асинхронного программирования в Visual Basic лежит концепция неблокирующего выполнения операций. Когда программа встречает длительную операцию, например, чтение большого файла или запрос к. . .
Async/await и асинхронное программировани­­е в Delphi
bytestream 08.02.2025
Асинхронное программирование является неотъемлемой частью разработки современных приложений, позволяя создавать отзывчивые и эффективные программы. В Delphi реализация асинхронности опирается на. . .
Асинхронное программировани­­­­­е и async/await в C#
bytestream 08.02.2025
Асинхронное программирование - концепция, позволяющая приложениям эффективно выполнять длительные операции без блокировки основного потока выполнения. В контексте современной разработки на C# это. . .
Асинхронное программировани­­­­­е и горутины/каналы в Go
bytestream 08.02.2025
Язык Go изначально разрабатывался с учетом современных многоядерных процессоров и необходимости эффективного параллельного выполнения задач. В отличие от традиционных подходов к асинхронному. . .
Как восстановить stash в Git
hw_wired 08.02.2025
Git stash - это средство для временного сохранения изменений в рабочей директории. В процессе разработки часто возникают ситуации, когда нужно быстро переключиться на другую задачу, но текущие. . .
КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin
Copyright ©2000 - 2025, CyberForum.ru