Чтобы создать эффект выпуклой границы для div-элемента с помощью CSS, нужно использовать свойство border-style со значением ridge. 13 Оно создаёт объёмную рифлёную выпуклую рамку. 4

Пример кода: 3

<div id='elem'></div>#elem {  border-width: 3px;  border-style: ridge;  border-color: black;  width: 300px;  height: 100px;}

Для создания вогнутой границы можно использовать свойство border-style со значением inset. 14 Оно добавляет эффект к границе таким образом, чтобы весь блок выглядел вдавленным. 1

Также для достижения визуального эффекта вогнутой границы можно вставить второй div с требуемым радиусом границы, установить его так, чтобы он перекрывал соответствующий div по абсолютному позиционированию, и включить оба элемента в div-оболочку. 2