| |
 425.3 Кб |
|
| | Доброго времени суток.
Подскажите пожалуйста, как можно решить след. задачу:
Есть <div> в нем выводится фотография - может быть как вертикальной, так и горизантальной. div должен быть оформлен след. образом - сверху - шапка из gif-a (имитация рваной карты), bg - фон определенного цвета и border-ы толшиной в один px - все, кроме верхнего, см. аттач. Вопрос - как можно сделать, чтобы из под шапки не видно было фона и border-ы заканчивались у начала шапки? Я мог бы сделать background-ом все изображение - но фотография может быть и вертикальной, а html трогать нельзя (только с помощью css). | |
| |
|
|
| |
|
|
| |
для: name
(27.01.2007 в 15:32)
| | | ложи фоновым рисунком шапку дива.
<style>
div#mydiv
{
background: #ffffff url(рисунок для шапки) left top no-repeat(или repeat-x \ -y);
border-left:1px solid red;
border-right:1px solid red;
border-bottom:1px solid red;
}
</style>
<div id="mydiv">
</div>
|
| |
| |
|
|
| |
|
|
| |
для: Lelik
(27.01.2007 в 15:36)
| | | не, Lelik, не то. ты бы аттач глянул. дайте код html, посмотрим чего там нельзя трогать. | |
| |
|
|
| |
|
|
| |
для: AlexSol
(27.01.2007 в 15:47)
| | | Трогать нельзя ничего (в смысле HTML). Попросили - сверстать страничку (очередную шкуру), дали шаблон и посредством изменения CSS треб. получить то, что в аттаче. Прикрепляю др. рисунок - что получается у меня (шапка). | |
| |
|
|
| |
|
|
| |
для: name
(27.01.2007 в 21:36)
| | | эща раз и медленно: дайте код html, тока не <img src=....> а весь контейнер с фотографией.
кстати что будет с блоком если фото вертикальное? если блок будет сужатся, то шапке будет крышка.... | |
| |
|
|
| |
|
|
| |
для: AlexSol
(27.01.2007 в 21:39)
| | | Блок имеет фиксированную ширину
CSS
#pImage_L2_lcol DIV.imgFrame {
WIDTH: 523px; POSITION: relative; BACKGROUND: url(../img/header_bg_foto.gif) no-repeat top #fdf2ba; BORDER-LEFT: #cfcfcf 1px solid; BORDER-RIGHT: #cfcfcf 1px solid; BORDER-BOTTOM: #cfcfcf 1px solid;
}
#pImage_L2_lcol DIV#imgContainer {
PADDING-LEFT: 10px; PADDING-TOP: 35px
}
#pImage_L2_lcol #cImg {
BORDER-RIGHT: #efefef 1px solid; BORDER-TOP: #efefef 1px solid; BACKGROUND: url(../img/loader.gif) no-repeat center 50%; BORDER-LEFT: #efefef 1px solid; BORDER-BOTTOM: #efefef 1px solid
}
|
HTML
<DIV class=imgFrame>
<DIV id=imgContainer style="WIDTH: 375px; POSITION: relative">
<DIV class=imgToolbar id=imgToolbar>
<A class=thickbox title=dog.JPG href="lg_144761_DSC00012.JPG" rel=albArray><IMG
id=cImg height=500 src="./img/pw_144761_DSC00012.jpg" width=375 border=0></A>
...
</DIV>
</DIV>
</DIV>
|
| |
| |
|
|
| |
|
|
| |
для: name
(27.01.2007 в 21:46)
| | | . | |
| |
|
|
| |
|
|
| |
для: name
(27.01.2007 в 21:46)
| | | нужно больще html.
просто не стыкуется:
DIV.imgFrame WIDTH: 523px
...
<DIV id=imgContainer style="WIDTH: 375px;
...
|
а на эскизе ширина 451 | |
| |
|
|
| |
|
|
| |
для: AlexSol
(28.01.2007 в 10:51)
| | | Остальной html не относится к выводу фотографии. На ширину можно не обращать особого внимания. Мне не понятно - это можно реализовать как-нибудь - чтобы бордеры не залазили на шапку | |
| |
|
|
| |
|
|
| |
для: name
(28.01.2007 в 11:01)
| | | толька если есть вложенный див. | |
| |
|
|
| |
|
|
| |
для: AlexSol
(28.01.2007 в 11:08)
| | | Спасибо | |
| |
|
|
