Все для создания и продвижения сайтов

Верстка, программирование, SEO

Текст поверх картинки на CSS

6470
Текст поверх картинки на CSS

Самый простой способ добавления текста на картинку, также вместо текста можно добавить другую картинку.

HTML:

Любой текст
Абсолютно любой.

CSS:

.image {
	position: relative;
	width: 100%; /* для IE 6 */
	}

h2 {
	position: absolute;
	top: 250px;
	left: 0;
	width: 100%;
	}
h2 span {
	color: #fff;
	font-size: 30px;
	line-height: 55px;
	background: rgba(0, 0, 0, 0.7);
	background: #000;
	padding: 10px;
	}

Демонстрация

Выделите опечатку и нажмите Ctrl + Enter, чтобы отправить сообщение об ошибке.