Как закрепить фон на WordPress

E
На сайте с 12.01.2011
Offline
19
2126

Всем привет! Ребят подскажите пожалуйста как закрепить картинку-фон на блоге, чтобы при масштабировании она не изменяла свой масштаб, а оставалась на своем месте!

Достоинство речи - быть ясной и не быть низкой (Аристотель) Достоинство текста - быть ясным и не быть скучным (Евгений Пенкин - expertic)
Mad_Man
На сайте с 10.11.2008
Offline
162
#1

Всем привет! Ребят подскажите пожалуйста, у меня сервак на Debian'e, как закрепить картинку-фон на блоге, чтобы при масштабировании она не изменяла свой масштаб, а оставалась на своем месте?

SeVlad
На сайте с 03.11.2008
Offline
1609
#2
expertic:
чтобы при масштабировании она не изменяла свой масштаб,

Написать свой браузер (для всех девайсов!) без этой функции и всех поголовно на него пересадить.

Делаю хорошие сайты хорошим людям. Предпочтение коммерческим направлениям. Связь со мной через http://wp.me/P3YHjQ-3.
eis
На сайте с 18.10.2008
Offline
473
eis
#3

expertic, что из себя фон представляет?

- Здесь я покупаю вечные ссылки на свои сайты! (https://backlinkator.com) - сотни ссылок за копейки
E
На сайте с 12.01.2011
Offline
19
#4
eis:
expertic, что из себя фон представляет?

картинка jpeg

CrePashOk
На сайте с 12.10.2011
Offline
21
#5

Предлагаю такое решение:

HTML

<!DOCTYPE html>
<html>
<head>
...
</head>
<body>
<img src="путь/к/картинке/картинка.jpg" id="bg" alt=''/>
<section class="wrapper">
....
</section>
</body>

CSS

#bg{position:fixed;width:100%;left:0;top:0}
section.wrapper{position:relative;width:1000px;margin:0px auto}
...

Главное чтобы страница была достаточно большого размера, для того чтобы на больших мониках не сильно искажалась ;)

Полный спектр услуг по WordPress (http://www.wpteam.net). icq: 55559939, skype: crepashok, portfolio: wpteam (http://www.wpteam.net/portfolio)
E
На сайте с 12.01.2011
Offline
19
#6

CrePashOk, спасибо за решение!

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

Code (CSS)

<style type="text/css">
/*StartStyle*/
html,body{background-color:transparent;}
html{background:transparent url(_st/fon_v0.jpg) no-repeat center center fixed;
-moz-background-size:cover; /* Gecko 1.9.2 (Firefox 3.6) */
-o-background-size:102% auto; /* Opera 9.5 */
-webkit-background-size:102% auto; /* Safari 3.0 */
-khtml-background-size:cover; /* Konqueror 3.5.4 */
background-size:cover; /* CSS3 */
}
/*EndStyle*/
</style>

Где:

html,body{background-color:transparent;} - задаём html и body фоновый цвет - прозрачный - дабы картинка просвечивала.

html{..... no-repeat center center fixed;...} - задаём фоновую картинку Html, фиксируем её по центру, запрещаем повторятся.

html{background-size:cover;} - назначаем CSS3-свойству background-size значение «cover» - масштабировать изображение с сохранением пропорций по max размерам (ширине или высоте - что больше) блока - в данном Html.

SeVlad
На сайте с 03.11.2008
Offline
1609
#7
CrePashOk:
Предлагаю такое решение:

И не будет масштабироваться? В любых браузерах?

Парни.. Или я чего-то не понимаю или.. одно из двух.

CrePashOk
На сайте с 12.10.2011
Offline
21
#8
SeVlad:
И не будет масштабироваться? В любых браузерах?

Парни.. Или я чего-то не понимаю или.. одно из двух.

Я предложил решение, аналогом которого есть реализация это :)

expertic - если я не правильно Вас понял, сори за флуд...

Авторизуйтесь или зарегистрируйтесь, чтобы оставить комментарий