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

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


#1 24.11.2009 13:29

argollab
Новичок
Зарегистрирован: 24.11.2009
Сообщений: 1

Как расположить текс по дуге?

Подскажите пожалуйста, как расположить текс так, как показано на картинке http://web-zamok.com.ua/1.jpg
Т.е. слева (черное) - это графический объект, а текст обтекает его по дуге.
Спасибо.

Нет на форуме

 

#2 24.11.2009 18:15

Octane
Опытный
Откуда: Волгоград
Зарегистрирован: 05.03.2008
Сообщений: 220
Вебсайт

Re: Как расположить текс по дуге?

Первое, что нужно сделать, оторвать руки веб-дизайнеру, незнакомому с версткой, да и вообще это идиотское форматирование,  такой текст читать очень неудобно. Ну а потом все таки сверстать макет, например, вот так:

Код:

<style type="text/css">
.text-wrapper {
    width: 300px;
}
.indent {
    display: block;
    float: left;
    clear: left;
    margin-right: 10px;
    background: #fc0;
}
.i1 {
    width: 135px;
}
.i2 {
    width: 110px;
}
.i3 {
    width: 90px;
}
.i4 {
    width: 75px;
}
.i5 {
    width: 65px;
}
.i6 {
    width: 60px;
}
.i7 {
    width: 65px;
}
.i8 {
    width: 75px;
}
.i9 {
    width: 90px;
}
.i10 {
    width: 110px;
}
.i11 {
    width: 135px;
}
</style>
<div class="text-wrapper">
    <span class="indent i1">&nbsp;</span>
    <span class="indent i2">&nbsp;</span>
    <span class="indent i3">&nbsp;</span>
    <span class="indent i4">&nbsp;</span>
    <span class="indent i5">&nbsp;</span>
    <span class="indent i6">&nbsp;</span>
    <span class="indent i7">&nbsp;</span>
    <span class="indent i8">&nbsp;</span>
    <span class="indent i9">&nbsp;</span>
    <span class="indent i10">&nbsp;</span>
    <span class="indent i11">&nbsp;</span>
    Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi.
</div>

Отредактированно Octane (24.11.2009 18:16)


[url=http://code.google.com/p/js-core/]javascript framework[/url]

Нет на форуме

 

#3 25.11.2009 13:44

Octane
Опытный
Откуда: Волгоград
Зарегистрирован: 05.03.2008
Сообщений: 220
Вебсайт

Re: Как расположить текс по дуге?

Кстати, может вот это поможет http://jwf.us/projects/jQSlickWrap/


[url=http://code.google.com/p/js-core/]javascript framework[/url]

Нет на форуме

 

#4 29.11.2009 15:07

Corvin
Новичок
Зарегистрирован: 29.11.2009
Сообщений: 3

Re: Как расположить текс по дуге?

http://www.bigbaer.com/css_tutorials/cs … t.wrap.htm вот тоже вариант похожей верстки.

Нет на форуме

 

Board footer

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