Для совместимости с большим количеством браузеров вам может потребоваться смоделировать элементы inset / outset, просто добавив обычную рамку снизу и справа или сверху и слева, которая темнее, чем цвет div, фактически это то, что в настоящее время использует Stackoverflow для тегов. в моем браузере.

ть левая и нижняя границы элемента должны придавать эффект трехмерности. Есть ли хороший, чисто CSS-способ для достижения этого эффекта?

Ответы на вопрос(5)

border-bottom-style а такжеborder-right-styleтак же, как StackOverFlow делает с тегами.

Используйте стилиinset а такжеoutset.

 Marnix04 окт. 2017 г., 07:27
@thesowismine Старые теги (темы вопроса) имели кнопку, похожую на рамку, но они изменили стиль, и теперь у них плоский макет. Так что это больше не применимо. Я должен был сделать снимок в то время.
 thesowismine03 окт. 2017 г., 07:08
@Marnix <- это то, что вы подразумеваете под тегом?
 Hamster07 янв. 2011 г., 00:27
Кажется, близко к тому, что я хочу, но углы неправильны в верхнем левом и нижнем правом.
#foo {
    /* ... */
    border:8px outset #999;
    -webkit-box-shadow: 5px 5px 15px rgba(0,0,0,0.4);
    -moz-box-shadow: 5px 5px 15px rgba(0,0,0,0.4);
}

http://jsfiddle.net/sjkXS/1/
Да, эффект здесь очень дурацкий, подчеркнутый, чтобы продемонстрировать, что возможно.

Решение Вопроса

пытаясь выяснить это, и я думаю, что вы ищете что-то вроде этогоhttp://jsfiddle.net/9Lt2477w/.

.raisedbox { 
    padding: 10px;
    border: 1px solid #77aaff;
    box-shadow:  -1px 1px #77aaff,
         -2px 2px #77aaff,
         -3px 3px #77aaff,
         -4px 4px #77aaff,
         -5px 5px #77aaff;
}

Благодаряhttp://sam-morrow.com/playground/css-cubes.py за помощь здесь. Я не знал, что вы можете просто добавить дополнительные строки в свойство box-shadow.

-webkit-box-shadow: 0 0 10px rgb(0,0,0);
-moz-box-shadow: 0 0 10px rgb(0,0,0);

ься смоделировать элементы inset / outset, просто добавив обычную рамку снизу и справа или сверху и слева, которая темнее, чем цвет div, фактически это то, что в настоящее время использует Stackoverflow для тегов. в моем браузере.

Ваш ответ на вопрос