Добрый день, подскажите, как мне сделать для элемента <span> фон как у тела страницы:
h3 {line-height: 34px;border-bottom: 1px solid #CDCDCD; height: 14px;}
h3 > span {background-color: #FFF; padding-right: 10px; line-height: 30px;}
---
<h3><span>Привет мир!</span></h3>
При условии, что фон страницы у меня картинкой...
Заранее огромное спасибо!
Примечание:
EasyPlaton, да, изначально он прозрачный, но я к h3 добавляю полосочку, и позиционирую ее по центру (вертикально) вот она мне и показывается за span'ом (как-бы перечеркивает на заднем плане) =(
Изначально был белый фон, с ним проблем не было, теперь на фон поставили картинку, вот с ней и проблемы (с фоном)
Примечание:
Всем спасибо, помог мне JS:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<style>
body {background: url(fone.png)}
h3 {line-height: 34px;border-bottom: 1px solid #CDCDCD; height: 14px;}
h3 > span {background-color: #FFF; height: 100px; padding-right: 10px; line-height: 30px;}
.bg {background: url(fone.png)}
</style>
<script type="text/javascript">
$(document).ready(function () {
$('.bg').each(function() {
var top = 110 - Math.floor($(this).offset().top);
var left = 80 - Math.floor($(this).offset().left);
$(this).css('background-position', left + 'px ' + top + 'px');
})
$(window).resize(function(){
$('.bg').each(function() {
var top = 110 - Math.floor($(this).offset().top);
var left = 80 - Math.floor($(this).offset().left);
$(this).css('background-position', left + 'px ' + top + 'px');
})
});
});
</script>
</head>
<body>
<div style="width: 1000px; margin: 0 auto; margin-top: 200px;">
<h3><span class="bg">Привет мир!</span></h3>
</div>
</body>
</html>
Кто будет использовать - не забудьте обработчик изменения размера окна.
---
110 - Высота картинки
80 - Ширина
---
Код еще протестирую, возможно если какие-то баги (только написал).
Rp
RPI.su - самая большая русскоязычная база вопросов и ответов. Наш проект был реализован как продолжение популярного сервиса otvety.google.ru, который был закрыт и удален 30 апреля 2015 года. Мы решили воскресить полезный сервис Ответы Гугл, чтобы любой человек смог публично узнать ответ на свой вопрос у интернет сообщества.
Все вопросы, добавленные на сайт ответов Google, мы скопировали и сохранили здесь. Имена старых пользователей также отображены в том виде, в котором они существовали ранее. Только нужно заново пройти регистрацию, чтобы иметь возможность задавать вопросы, или отвечать другим.
Чтобы связаться с нами по любому вопросу О САЙТЕ (реклама, сотрудничество, отзыв о сервисе), пишите на почту [email protected]. Только все общие вопросы размещайте на сайте, на них ответ по почте не предоставляется.