Форум XHTML.ru <!-- по-русски -->

Сайты - по стандартам, но не стандартные сайты!


#1 19.01.2006 02:08

tapazukk
Опытный
Зарегистрирован: 16.01.2006
Сообщений: 349
Вебсайт

два бэкграунда посредством CSS

Возможно ли использовать несколько картинок в background’e?Допустим есть повторяющееся изображение repiat-y и хочется(правда хочется) добавить еще картинку с аргументом no-repeat.Или есть альтернативный способ?  
 
 

Отредактированно tapazukk (19.01.2006 02:24)

Нет на форуме

 

#2 19.01.2006 02:45

Admin
Administrator
Зарегистрирован: 21.11.2005
Сообщений: 32
Вебсайт

Re: два бэкграунда посредством CSS

первое что в голову пришло

<div style="background:url(image1.jpg) repeat-y"><div style="background:url(image2.jpg) right bottom no-repeat">text</div></div>


Идеального кода нет!

Нет на форуме

 

#3 19.01.2006 12:27

juuuk
Новичок
Зарегистрирован: 26.11.2005
Сообщений: 44

Re: два бэкграунда посредством CSS

в css3 возможно задать несколько бекграундов в одном блоке
будем ждать
когда ие начнет его понимать

а пока вроде другово выхода нет только несколькими блоками

Нет на форуме

 

#4 19.01.2006 16:09

AKS
Опытный
Зарегистрирован: 25.12.2005
Сообщений: 409

Re: два бэкграунда посредством CSS

Для tapazukk:
Написал бы код HTML, чтобы понятней было, где эти картинки должны находиться...

Нет на форуме

 

#5 20.01.2006 02:50

tapazukk
Опытный
Зарегистрирован: 16.01.2006
Сообщений: 349
Вебсайт

Re: два бэкграунда посредством CSS

Вообщем задумка была такой,чтоб блок (container в коде) плавал себе по центру
слева повторяется изображение,а допустим в нижнем правом углу окна браузера(!) находится еще одно(в качестве бэгграунда).Решил попробовать так(больше ничего придумать не смог)-

Код:

<!DOCTYPE html 
     PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
     "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<title>backwithbag</title>
<style type="text/css">


body
{
    background : black url("pic_1.gif") repeat-y;
    margin : 60px; 
    height:100%; 
}
#container
{
    width : 90%;
    margin : 10px auto;
    Padding-left : 20px;
    background :white;
}
#left
{
    float : left;
    width : 150px;
    margin : 0;
    padding : 10em;
}
#content
{
    color : gray;
    margin-left : 200px;
    border-left : 1px solid gray;
    padding : 30px;
    max-width : 36em;

}
#bgsecond
{
   background:url("pic_2.jpg") right bottom no-repeat
}
</style></head>
<body>
<div id="bgsecond">
<div id="container">
<div id="left">ffffffffffffff</div>

<div id="content">text
texttexttexttexttexttexttexttexttexttext

</div>
</div> </div>

 </body>
</html>

Если есть что добавить(или убрать), несказанно буду рад.

Нет на форуме

 

#6 20.01.2006 17:51

AKS
Опытный
Зарегистрирован: 25.12.2005
Сообщений: 409

Re: два бэкграунда посредством CSS

Если я правильно понял, то у тебя не получается разместить картинку в правом нижнем углу окна. Для этого блок #bgsecond надо вытянуть во всю высоту окна - и всего-то. О том, как написать кроссбраузерные стили читай на этом сайте статью Исследование высоты BODY. В ней автор доходчиво как раз этому нас и учит.

Нет на форуме

 

Board footer

Работает на PunBB
© 2002—2005 Rickard Andersson