С Новым годом! Форум программистов, компьютерный форум, киберфорум
HTML, CSS
Войти
Регистрация
Восстановить пароль
Карта форума Темы раздела Блоги Сообщество Поиск Заказать работу  
 
Рейтинг 4.56/9: Рейтинг темы: голосов - 9, средняя оценка - 4.56
0 / 0 / 0
Регистрация: 11.11.2016
Сообщений: 2
1

Как сверстать выпуклую тень?

20.11.2016, 10:27. Показов 1820. Ответов 2
Метки нет (Все метки)

Author24 — интернет-сервис помощи студентам
Всем привет возможно ли сверстать выпуклую тень снизу и сверху блока?. Спасибо за внимание!
Миниатюры
Как сверстать выпуклую тень?  
0
Лучшие ответы (1)
Programming
Эксперт
39485 / 9562 / 3019
Регистрация: 12.04.2006
Сообщений: 41,671
Блог
20.11.2016, 10:27
Ответы с готовыми решениями:

Как сверстать такую тень?
Подскажите пожалуйста...

Как сверстать элемент с углами и дать ему тень
Друзья, всем привет. Я учусь верстать, и вот не могу разобраться, как сверстать такой элемент ...

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

Дано n точек на плоскости. Построить их выпуклую оболочку - минимальную выпуклую фигуру, их содержащую
Дано n точек на плоскости. Построить их выпуклую оболочку - минимальную выпуклую фигуру, их...

2
Эксперт JSЭксперт HTML/CSS
3826 / 2676 / 1521
Регистрация: 12.07.2015
Сообщений: 6,672
Записей в блоге: 4
20.11.2016, 10:55 2
Лучший ответ Сообщение было отмечено Nekri как решение

Решение

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
body {
  padding: 30px;
}
.block {
  width: 200px;
  height: 200px;
  background-color: #eee;
  margin: 0 auto;
  position: relative;
}
.block:before {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  margin: 0 auto;
  width: 90%;
  height: 10%;
  border-radius: 50%;
  z-index: -1;
  box-shadow: 0px -5px 5px 0px rgba(0, 0, 0, 0.25);
}
.block:after {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  margin: 0 auto;
  width: 90%;
  height: 10%;
  border-radius: 50%;
  z-index: -1;
  box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, 0.25);
}
HTML5
1
<div class="block"></div>
1
0 / 0 / 0
Регистрация: 11.11.2016
Сообщений: 2
20.11.2016, 18:51  [ТС] 3
Огромное спасибо )))))))))))))))
просто и понятно )))))))))))))))
0
20.11.2016, 18:51
inter-admin
Эксперт
29715 / 6470 / 2152
Регистрация: 06.03.2009
Сообщений: 28,500
Блог
20.11.2016, 18:51
Помогаю со студенческими работами здесь

Решение ребуса ТЕНЬ + ТЕНЬ = МРАК
Помогите решить ребус: ТЕНЬ + ТЕНЬ = МРАК

Как сделать тень
Как сделать тень внизу рамки, как на картинке.

Как сделать красивую тень?
Такой вопрос Как сделать тень от слоя? &lt;div id='sloy'...

Как сделать тень и фонарик
Если нужно что б вся комната была в тени, а персонаж с фонариком. Куда повернет фонарик там сразу...


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

Или воспользуйтесь поиском по форуму:
3
Ответ Создать тему
Новые блоги и статьи
Использование GraphQL в Go (Golang)
InfoMaster 08.01.2025
Go (Golang) является одним из наиболее популярных языков программирования, используемых для создания высокопроизводительных серверных приложений. Его архитектурные особенности и встроенные. . .
Что лучше использовать при создании класса в Java: сеттеры или конструктор?
Alexander-7 08.01.2025
Вопрос подробнее: На вопрос: «Когда одновременно создаются конструктор и сеттеры в классе – это нормально?» куратор уточнил: «Ваш класс может вообще не иметь сеттеров, а только конструктор и геттеры. . .
Как работать с GraphQL на TypeScript
InfoMaster 08.01.2025
Введение в GraphQL и TypeScript В современной разработке веб-приложений GraphQL стал мощным инструментом для создания гибких и эффективных API. В сочетании с TypeScript, эта технология. . .
Счётчик на базе сумматоров + регистров и генератора сигналов согласования.
Hrethgir 07.01.2025
Создан с целью проверки скорости асинхронной логики: ранее описанного сумматора и предополагаемых fast регистров. Регистры созданы на базе ранее описанного, предполагаемого fast триггера. То-есть. . .
Как перейти с Options API на Composition API в Vue.js
BasicMan 06.01.2025
Почему переход на Composition API актуален В мире современной веб-разработки фреймворк Vue. js продолжает эволюционировать, предлагая разработчикам все более совершенные инструменты для создания. . .
Архитектура современных процессоров
inter-admin 06.01.2025
Процессор (центральный процессор, ЦП) является основным вычислительным устройством компьютера, которое выполняет обработку данных и управляет работой всех остальных компонентов системы. Архитектура. . .
История создания реляционной модели баз данных, правила Кодда
Programming 06.01.2025
Предпосылки создания реляционной модели В конце 1960-х годов компьютерная индустрия столкнулась с серьезными проблемами в области управления данными. Существовавшие на тот момент модели данных -. . .
Полезные поделки на Arduino, которые можно сделать самому
raxper 06.01.2025
Arduino как платформа для творчества Arduino представляет собой удивительную платформу для технического творчества, которая открывает безграничные возможности для создания уникальных проектов. Эта. . .
Подборка решений задач на Python
IT_Exp 06.01.2025
Целью данной подборки является предоставление возможности ознакомиться с различными задачами и их решениями на Python, что может быть полезно как для начинающих, так и для опытных программистов. . . .
С чего начать программировать микроконтроллер­­ы
raxper 06.01.2025
Введение в мир микроконтроллеров Микроконтроллеры стали неотъемлемой частью современного мира, окружая нас повсюду: от простых бытовых приборов до сложных промышленных систем. Эти маленькие. . .
Из чего собрать игровой компьютер
inter-admin 06.01.2025
Сборка игрового компьютера требует особого внимания к выбору комплектующих и их совместимости. Правильно собранный игровой ПК не только обеспечивает комфортный геймплей в современных играх, но и. . .
Обновление сайта www.historian.b­y
Reglage 05.01.2025
Обещал подвести итоги 2024 года для сайта. Однако начну с того, что изменилось за неделю. Добавил краткий урок по последовательности действий при анализе вредоносных файлов и значительно улучшил урок. . .
КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin
Copyright ©2000 - 2025, CyberForum.ru