Форум АНТИЧАТ - Элемент с закругленными углами R=3px ((( а надо R=5px

УСТРАНЕНИЕ КОНКУРЕНТОВ. БЛОКИРОВКА ДОМЕНОВ, БЛОКИРОВКА ИНСТАГРАМ/ТЕЛЕГРАМ И ДРУГОЕ. ПРОВЕРЕННЫЙ СЕЛЛЕР.

Antichat снова доступен.
Форум Antichat (Античат) возвращается и снова открыт для пользователей. Здесь обсуждаются безопасность, программирование, технологии и многое другое. Сообщество снова собирается вместе.
Новый адрес: forum.antichat.xyz

		Форум АНТИЧАТ > Программирование > PHP, PERL, MySQL, JavaScript
Элемент с закругленными углами R=3px ((( а надо R=5px

Опции темы

Поиск в этой теме

Опции просмотра

Элемент с закругленными углами R=3px ((( а надо R=5px

19.09.2009, 19:00

ufalog

Участник форума

Регистрация: 28.07.2007

Сообщений: 177

Провел на форуме:
274360

Репутация: 5

Отправить сообщение для ufalog с помощью ICQ

Элемент с закругленными углами R=3px ((( а надо R=5px

PHP код:


		
			
<div id="rounded-box-3">

    <b class="r3"></b><b class="r1"></b><b class="r1"></b>

    <div class="inner-box">

        <h3>Элемент с закругленными углами R=3px</h3>

        <p>Этот способ закругления углов подсмотрен на GMail.</p>

    </div>

    <b class="r1"></b><b class="r1"></b><b class="r3"></b>

</div>

css

PHP код:


		
			


.r1, .r2, .r3 {

    display: block;

    height: 1px;

    overflow: hidden; 

    font-size:1px;

}



.r3 { margin: 0 3px; }

.r2 { margin: 0 2px; }

.r1 { margin: 0 1px; }





#rounded-box-3 .inner-box, #rounded-box-3  b {

    background-color: #294d67;

}



.inner-box {

    padding:1em;

}

как увеличить радиус до 5 px?

21.09.2009, 12:22

real_kas

Познающий

Регистрация: 22.03.2007

Сообщений: 45

Провел на форуме:
110666

Репутация: 9

Код HTML:

<style>.r1, .r2, .r3, .r4, .r5{
display: block;
overflow: hidden;
font-size:1px;
float: none;
}
.r5{
margin: 0 6px;
height: 1px;
background-color: #000;}
.r4{
margin: 0 4px;
height: 1px;
border-right: 2px solid #000;
border-left: 2px solid #000;
background-color: #CCCCCC;}
.r3{
margin: 0 3px;
height: 1px;
border-right: 1px solid #000;
border-left: 1px solid #000;
background-color: #CCCCCC;}
.r2{
margin: 0 2px;
height: 1px;
border-right: 1px solid #000;
border-left: 1px solid #000;
background-color: #CCCCCC;}
.r1{
margin: 0 1px;
height: 2px;
border-right: 1px solid #000;
border-left: 1px solid #000;
background-color: #CCCCCC;}
.inner-box {
padding:1em;
border-right: 1px solid #000;
border-left: 1px solid #000;
background-color: #CCCCCC;}</style>

Код HTML:

<table>
    <tr>
        <td>

            <div id="rounded-box-5">

                <i class="r5"></i>
                <i class="r3"></i>
                <i class="r2"></i>
                <i class="r1"></i>
                <i class="r1"></i>

                <div class="inner-box">
                    <table>
                        <tr>
                            <td>
                                text
                            </td>
                        </tr>
                    </table>
                </div>

                <i class="r1"></i>
                <i class="r1"></i>
                <i class="r2"></i>
                <i class="r3"></i>
                <i class="r5"></i>

            </div>

        </td>
    </tr>
</table>

21.09.2009, 15:01

KaMiKadZe

Участник форума

Регистрация: 24.02.2006

Сообщений: 206

Провел на форуме:
2735257

Репутация: 103

В CSS 3 будет все проще, уже для движка safari & firefox можно использовать

PHP код:


		
			
#rounded-box-3 {

-moz-border-radius: 5px;

-webkit-border-radius: 5px; }

После чего весь блок будет с закруглениями

23.09.2009, 02:00

ffdown

Новичок

Регистрация: 03.08.2008

Сообщений: 23

Провел на форуме:
52521

Репутация: 0

и когда ж оно будет?

« Предыдущая тема | Следующая тема »

Здесь присутствуют: 1 (пользователей: 0 , гостей: 1)

Быстрый переход