изменить размер фонового изображения div - PullRequest
Новая
       10

изменить размер фонового изображения div

1 голос
/ 21 июля 2010

с использованием компонента joomla, который извлекает изображение из базы данных для слайд-шоу.

Он устанавливает изображение в качестве фона div - мне нужно изменить размер этого изображения, чтобы оно стало шириной (620 пикселей)слайд-шоу. 

<div style="background: url({image1url}) top center no-repeat;
 width:620px;
 height:350px">
<div style="width:620px;
     height:256px;">
<a href="{url}">
    <img src="modules/mod_jxtc_ezrealtywall/images/10x10spacer.gif" width="620" height="246" alt="10x10spacer.gif" /></a>
</div>
<div style="position:relative; width:620px;
     height:104px;">

    <div style="position:absolute; width:620px; height:95px; background:#000; opacity:0.7; filter:alpha(opacity=70); "></div>

    <div style="position:absolute;">
        <div style="float:left;
             width:250px;
             border-right: 1px dotted #cccccc;
             color:#ebebeb;
             padding-right:30px;
             padding-left:20px;
             text-align:right;
             font-size:28px;
             letter-spacing:-1px;
             line-height:28px !important;
             margin-top:16px;
             font-weight:500;">
            {unitnum} {streetnum} {address} {locality} {postcode}
        </div>
        <div style="float:right;
             width:250px;
             color:#ebebeb;
             margin:23px 40px 5px 0px;
             padding-left:15px;
             text-align:left;
             font-size:11px;
             line-height:11px !important;">
            {description}
        </div>
    </div>
</div>

Ответы [ 2 ]

3 голосов
/ 20 сентября 2010

Jeepstone прав, он поддерживается CSS 3 и поддерживается большинством браузеров, кроме IE (радость), но я не уверен насчет IE9? См. http://www.css3.info/preview/background-size/ для получения дополнительной информации, и ниже приведен пример - в этом случае, центрируя фоновое изображение, я получаю фоновое изображение с измененным размером, а пользователи IE получают обрезанное изображение, которое иногда достаточно хорошо ... возможно. .. 

.backgroundImage {
    -o-background-size: 100% 100%;
    -webkit-background-size: 100% 100%;
    -khtml-background-size : 100% 100%;
    -moz-background-size: 100% 100%;
    background-position: center center;
}
1 голос
/ 21 июля 2010

Вы не можете изменить размер фонового изображения с помощью CSS (если вы не используете CSS 3, который не полностью реализован).

...