Кривая угловая граница для отделения

Вы можете использовать модуль %, чтобы получить дополнительные шары.

Пример фрагмента:

select *, coalesce(floor(Overs)*6 + floor((Overs%1)*10), 0) as Balls
from (values 
 (1.0),
 (4.0), 
 (4.5),
 (null)
) as v(Overs);

Тест на db <> fiddle здесь

[ 1110] Результат:

Overs Balls
----- -----
1.0   6
4.0   24
4.5   29
NULL  0

10
задан praveenjayapal 12 December 2008 в 06:29
поделиться

5 ответов

Можно использовать CSS для достижения скругленных углов в современных браузерах...

border-radius: 10px;

Удобный генератор

Это известно как прогрессивное улучшение. IMO, это лучше, чем изображения и или приемы CSS с полями и границами. Если у Вас абсолютно не должно быть скругленных углов.

6
ответ дан 3 December 2019 в 19:36
поделиться

Если Вы хотите полагаться на WebKit и браузеры Mozilla, можно использовать следующие команды CSS:

.radius {
-moz-border-radius: 6px;
-webkit-border-radius:6px;
border-radius: 6px;
    }

Детали могут посмотреться здесь.

информация о радиусе границы спецификации CSS2 может быть найдена здесь

Они, к сожалению, не работают на т.е.

Вы могли пойти путем JavaScript для IE только при помощи niftycube, который обладает дополнительным преимуществом поддержки высоты столбцов, выравнивающейся без проблем.

9
ответ дан 3 December 2019 в 19:36
поделиться

http://www.curvycorners.net/

Испытайте эту библиотеку, она сделала чудеса для меня! Это - протестированное перекрестное решение для браузера.

7
ответ дан 3 December 2019 в 19:36
поделиться

Вот тот, который я записал, что Вы можете использовать, если Вам нравится он. Это представляет поле скругленного угла любых размеров с цветом фона, но не границей вокруг всего поля. Именно для белых фонов страницы, но может быть изменен путем редактирования цвета рамки в c1, c2 и стили c3.

.rounded {background-color:#f1f0f1}
.rounded .inner {padding:8px 10px 8px 12px}
.rounded .c1 {height:1px;line-height:1px;font-size:1px;border-width: 0px 4px 0px 4px;border-color:#FFFFFF;border-style:solid;padding:0px}
.rounded .c2 {height:1px;line-height:1px;font-size:1px;display:block;border-width: 0px 2px 0px 2px;border-color:#FFFFFF;border-style:solid;padding:0px}
.rounded .c3 {height:2px;line-height:1px;font-size:1px;display:block;border-width: 0px 1px 0px 1px;border-color:#FFFFFF;border-style:solid;padding:0px}


   <div class="rounded" style="width:200px;height:100px">
    <div class="c1"></div><div class="c2"></div><div class="c3"></div>
        <div class="inner">
        -- Content Here --
        </div>
        <div class="c3"></div><div class="c2"></div><div class="c1"></div>
   </div>
0
ответ дан 3 December 2019 в 19:36
поделиться

Я использовал бы плагин jQuery для обработки скругленных углов. Вот список доступных плагинов скругленного угла на сайте jQuery: http://plugins.jquery.com/taxonomy/term/189

-2
ответ дан 3 December 2019 в 19:36
поделиться