отбрасывать тень только снизу css3
Краткая информация C Плюс, 5-й Выпуск - C заказывают, чтобы добраться, если Вы изучаете C без предшествующего опыта программирования. Это - мой любимый, поскольку я учился программировать из этой книги. Это имеет все качества новичок, которого должна иметь дружественная книга:
- не принимает предшествующего воздействия программированию
- , Приятному читать (не становясь раздражающим как Для Макетов /
- , не упрощает
2 ответа
Вы могли также использовать clip-path для отсечения (скрывают) все края переполнения, но тот Вы хотите показать:
.shadow {
box-shadow: 0 4px 4px black;
clip-path: polygon(0 0, 100% 0, 100% 200%, 0 200%);
}
См. путь клипа (MDN) . Аргументы polygon верхние левые точка, верхний правый точка, нижняя правая часть точка, и нижняя левая часть точка. Путем установки базового края на 200% (или безотносительно числа, больше, чем 100%), Вы ограничиваете свое переполнение только к базовому краю.
Вы могли также просто сделать градиент в нижней части - это было полезно для меня, потому что тень, которую я хотел, была на элементе, который был уже полупрозрачным, таким образом, я не должен был волноваться ни о каком отсечении:
&:after {
content:"";
width:100%;
height: 8px;
position: absolute;
bottom: -8px;
left: 0;
background: linear-gradient(to bottom, rgba(0,0,0,0.65) 0%,rgba(0,0,0,0) 100%);
}
Просто делают соответствие свойств "нижней части" и "высоты" и устанавливают Ваши rgba значения к тому, чем Вы хотите, чтобы они были наверху / нижняя часть тени