Jump to content
  • 0

2 изображения в фоне сайта

StasFetisov

Asked by StasFetisov,

 Share

Question

StasFetisov Explorer

StasFetisov

Posted
Posted (edited)

Здравствуйте!

http://stasfetisov.ru/praktika/index1.html

Если посмотрите эту страницу в Chrome - всё как надо: 2 картинки - слева внизу и справа вверху.

IE и Avant - вообще не отображают картинок.

Opera - некорректно отображает левую нижнюю. картинку - не в самом низу, а сильно приподнято.

Код CSS описания:

<style type = "text/css">
body
{
background: right top url("img/corner.png"), left bottom url("img/down-corner.png");
background-repeat: no-repeat;
background-color: rgb(255, 255, 255);
}
</style>

Почему только Chrome нормально меня понимает? ;)

Как заставить другие браузеры, в частности IE воспринимать нормально обе картинки?

Спасибо.

Edited by StasFetisov
Link to comment
Share on other sites

5 answers to this question

Recommended Posts

  • 0
psywalker Explorer

psywalker

Posted
Posted

background: right top url("img/corner.png"), left bottom url("img/down-corner.png"); вот эта запись означает, что ты пременяешь два фона к одному элементу, это не поддерживается никакими браузерами, кроме Сафари и Хрома.

Поэтому тебе советую один фон повесить на html, а другой на body или на кройняк сделать дополнительный контейнер для фона.

Link to comment
Share on other sites
  • 0
StasFetisov Explorer

StasFetisov

Posted
  • Author
Posted
это не поддерживается никакими браузерами, кроме Сафари и Хрома.

О, спасибо за объяснение! ;)

Поэтому тебе советую один фон повесить на html

А какой параметр за это отвечает? Полазил в справке, там только <html title="текст">...</html> нашёл...

Link to comment
Share on other sites
  • 0
StasFetisov Explorer

StasFetisov

Posted
  • Author
Posted

Спасибо, со всем разобрался.

Сделал так:

изображение, которое в правом верхнем углу в html:

html {
background: url("img/corner.jpg") no-repeat top right;
height:100%;
width:100%;
}

А изображение в левом нижнем углу, которое "двигается" (на некоторых страницах у меня выезжающий текст) - поставил в body:

body 
{
 background:url(img/down-corner.jpg) no-repeat bottom left;
}

Плюс ко всему вот эти две строчки крайне важны для IE, чтобы всё это отображалось:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Answer this question...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
 Share
Go to question listing
×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue. See more about our Guidelines and Privacy Policy

  I accept