Как сделать такой заголовок?

Question

[pavel010101]

Всем добрый вечер! не подскажите как можно реализовать такую идею заголовка? Спасибо за помощь

Comments

[Rustam Bainazarov]

Где здесь заголовок и что не выходит?

[Модератор]

Конкретизируйте вопрос пожалуйста.

[Анастасия]

Модератор, Рустам Байназаров, у ребят выше монитор плохой)

[Rustam Bainazarov]

Анастасия, когда мой комментарий был написан, в вопросе было совершенно иное фото, близко не связанное с вопросом.

[Анастасия]

Рустам Байназаров, а в истории изменений - изменения не сохраняются?

[Rustam Bainazarov]

Анастасия, такие изменения — нет. Отредактируйте любой собственный вопрос в подобном русле, чтобы в этом убедиться. Почему так — я без понятия, но вы можете спросить у официального модератора данного ресурса, который оставил комментарий выше.

[Анастасия]

Рустам Байназаров, в каком русле? изменить картинку?

[Анастасия]

Рустам Байназаров, сохраняются изменения
https://qna.habr.com/questionversion?question_id=942099
просто вопрос времени

[Rustam Bainazarov]

Анастасия, интересно. Возможно, они это сделали наконец. Я свои вопросы некоторые раз по 6 редактировал, видел, как вопросы редактируются,но не видел ни одной версии, кроме изначальной. Либо же есть какой-то лимит по времени до следующей правки, по истечении которого оная будет считаться версией и будет показана.

По открытию вопроса лично я увидел фотографию из прошлого вопроса автора.

[pavel010101]

Рустам Байназаров, заголовок на заднем фоне , просто это для примера оригинал еще темнее.

[pavel010101]

Модератор, ок!

[pavel010101]

Рустам Байназаров, это я загрузил в первую версию не то фото. потом поменял и думал что новая версия сохраняется сразу. Оказывается есть какой-то лимит , когда видно еще старую версию вопроса

Answer 1

[Виталий Першин]

К примеру так:

Comments

[pavel010101]

Спасибо большое, помогло!

Answer 2

[Антон Литвиненко]

дать заголовку data-title="Портфолио"
передать data-title в content псевдоэлемента, привязанного к заголовку content: attr(data-title)
оформить псевдоэлемент как на картинке

Comments

[pavel010101]

Спасибо за помощь, так и сделал

Answer 3

[Анастасия]

Я бы воспользовалась SVG (если в photoshop: преобразовала бы текст в кривые, затем экспорт в svg) и просто кинула бы его отдельным слоем с параметрами

position: absolute;
opacity: 0.3;
margin: auto;
left:0;
right:0;
top: 100px;

И да, лучше сделать чуть ярче, потому что вон некоторые пользователи вообще не поняли о чём речь

Comments

[pavel010101]

Анастасия, спасибо за подсказку!