Возможно ли в CSS сделать такое!

возможно. каждая линия отдельный элемент (div, например), background можно прописать с градиентом. понятно, что работать будет не во всех браузерах

но графикой сделать проще, и может оказаться, что по итогу в байтах будет меньше

galaystra:
Начинаю осваивать верстку и в процессе появилась дилемма: Либо графика, либо можно все-таки сделать это в CSS. Вопрос только как?

Задача в том, чтобы сделать вертикальные и горизонтальные линии с тенями для будущих пунктов меню с последующим исчезновением... Как на картинке. Заранее благодарю за помощь!

Ну судя по картинке, можно обойтись без графики для этих линий. Двухпиксельный див, внутрь него два однопиксельных друг под другом, им разные цвета на фон (пипеткой по картинке замерить). Если же зрение меня подводит, и тень там прозрачная, то можно нижнему диву сделать opacity. Обычно надо все же картинку попиксельно изучить, чтоб найти оптимальное решение. Но зачем такие извращения, если можно просто положить на фон гифку/пнгшку 1x2 пикселя (срез линии) с repeat-x, и не придется запоминать эти цвета, если макет поменяется. Левую часть линий с переходом в полупрозрачность без графики не сделать.

Как правило, всякие тонкие линии, орнаменты, обводки-подводки-подсветки-тени выгодней и красивей сделать картинками, не стоит так их бояться, и не надо пренебрегать форматом гиф. Они все получаются по несколько сотен байт, а если их слишком много (ну за 20 скажем) - можно уже заморочиться и засунуть их в один спрайт, чтоб страница быстрее грузилась.