[Решено]Прошу помочь с закруглением

Главные вкладки

Комментарии

Аватар пользователя Beshan Beshan 14 августа 2012 в 0:45

я тока начал изучать не судите строго,понимаю знаний мало(((, хочу сделать фон с закругленой рамкой у блоков,фаир баг стоит,да для ie6 и выше,подскажите что куда плизз

Аватар пользователя adubovskoy adubovskoy 14 августа 2012 в 1:37

Для ie6, варианты:
1. CSS PIE http://css3pie.com/
2. jquery corners или любой другой аналог http://jquery.malsup.com/corner/ (если пожать весит меньше чем pie).
3. Олдскульные способы (тру, сделаете так - вызовите слезу умиления, вспомним молодость...) http://vremenno.net/html-css/38-articles-about-creating-rounded-corners/, а совсем тру олдскульно - http://www.alistapart.com/articles/customcorners/ вот так (2003 год, помните, как оно все было страшно и удивительно?).

Аватар пользователя Beshan Beshan 14 августа 2012 в 9:27

adubovskoy wrote:
Для ie6, варианты:
1. CSS PIE http://css3pie.com/
2. jquery corners или любой другой аналог http://jquery.malsup.com/corner/ (если пожать весит меньше чем pie).
3. Олдскульные способы (тру, сделаете так - вызовите слезу умиления, вспомним молодость...) http://vremenno.net/html-css/38-articles-about-creating-rounded-corners/, а совсем тру олдскульно - http://www.alistapart.com/articles/customcorners/ вот так (2003 год, помните, как оно все было страшно и удивительно?).

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

Аватар пользователя Anonym_tsk Anonym_tsk 14 августа 2012 в 12:24

Не пинайте мертвого осла.
Для блоков сделайте так:
<div class='rounded-block'>Text...</div>

.rounded-block {
    /* Синтаксис: border-radius: ЛЕВЫЙ_ВЕРХНИЙ ПРАВЫЙ_ВЕРХНИЙ ПРАВЫЙ_НИЖНИЙ ЛЕВЫЙ_НИЖНИЙ; */
    border-radius: 5px 7px 10px 12px;
    -moz-border-radius: 5px 7px 10px 12px;
    -webkit-border-radius: 5px 7px 10px 12px;
}

Вот сайт, он вам поможет

Аватар пользователя Beshan Beshan 14 августа 2012 в 21:41

Anonym_tsk wrote:
Не пинайте мертвого осла.
Для блоков сделайте так:
<div class='rounded-block'>Text...</div>

.rounded-block {
    /* Синтаксис: border-radius: ЛЕВЫЙ_ВЕРХНИЙ ПРАВЫЙ_ВЕРХНИЙ ПРАВЫЙ_НИЖНИЙ ЛЕВЫЙ_НИЖНИЙ; */
    border-radius: 5px 7px 10px 12px;
    -moz-border-radius: 5px 7px 10px 12px;
    -webkit-border-radius: 5px 7px 10px 12px;
}

Вот сайт, он вам поможет


Большое спасибо!!!,сперва не получалось, часа три промучался и все вышло + еще немного понял как работает Друпал)))

P.S.
Еслибы вы не написали "Text..." я бы еще задовал кучу глупых вопросов))))

P.S.S.
Всем спасибо за поддержку!!!

Аватар пользователя Beshan Beshan 14 августа 2012 в 22:21

Чтото типа мини статьи для чайников как я
Как решил проблему.
Изменил фаил block.tpl.php
Был..

<?php<div id="block-<?php print $block->module .'-'$block->delta?>" class="block block-<?php print $block->module ?>">
<?php if ($block->subject): ?>
  <h2 class="block-title"><?php print $block->subject ?></h2>
<?php endif;?>

  <div class="content">
    <?php print $content ?>
  </div>
</div>?>

Стал..

<?php

<div class='rounded-block'>
<
div id="block-<?php print $block->module .'-'. $block->delta; ?>" class="block block-<?php print $block->module ?>">
<?
php if ($block->subject): ?>
  <h2 class="block-title"><?php print $block->subject ?></h2>
<?php endif;?>

  <div class="content">
    <?php print $content ?>
  </div>
</div>
</div>
?>

добавил в colourise.css (у темы colourise нету style.css наверное надо вставлять туда)

.rounded-block {
    /* Синтаксис: border-radius: ЛЕВЫЙ_ВЕРХНИЙ ПРАВЫЙ_ВЕРХНИЙ ПРАВЫЙ_НИЖНИЙ ЛЕВЫЙ_НИЖНИЙ; */
    border-radius: 5px 7px 10px 12px;
    -moz-border-radius: 5px 7px 10px 12px;
    -webkit-border-radius: 5px 7px 10px 12px;
    /*цвет фона без него у меня не работало так как он брал из html значение "transparent"*/
    background: #B0CADD;
}

Проверил в фф, хром, опере работает в других не проверял

Аватар пользователя alex_shut alex_shut 15 августа 2012 в 1:12

"Beshan" wrote:
border-radius: 5px 7px 10px 12px;
-moz-border-radius: 5px 7px 10px 12px;
-webkit-border-radius: 5px 7px 10px 12px;

border-radius: 5px 7px 10px 12px; - это лучше поставить последним, а не первым.

Аватар пользователя Beshan Beshan 16 августа 2012 в 23:42

alex_shut wrote:
"Beshan" wrote:
border-radius: 5px 7px 10px 12px;
-moz-border-radius: 5px 7px 10px 12px;
-webkit-border-radius: 5px 7px 10px 12px;

border-radius: 5px 7px 10px 12px; - это лучше поставить последним, а не первым.

Спасибо за совет.Хотелось бы узнать почему??

Аватар пользователя Anonym_tsk Anonym_tsk 17 августа 2012 в 6:34

"Beshan" wrote:
Спасибо за совет.Хотелось бы узнать почему??

Если браузер поддерживает свойство без префиксов, он будет использовать его.

Аватар пользователя alex_shut alex_shut 17 августа 2012 в 11:06

"Anonym_tsk" wrote:

точняк )
"Beshan" wrote:

Если префиксы последними идут - то браузер, который уже отказался от префикса в данном случае, может поиметь проблем. Он имеет риск неверно отобразить верстку.

А оно вам надо переписывать код через пол года год? ))

Аватар пользователя divined divined 17 августа 2012 в 11:12

Уточнение: Вы поняли ка работает html+css (на базовом уровне).

Теперь осталось: php, mysql, javascript - и сможете начинать изучать Друпал Smile

Аватар пользователя Beshan Beshan 28 августа 2012 в 14:46

divined wrote:
Уточнение: Вы поняли ка работает html+css (на базовом уровне).

Теперь осталось: php, mysql, javascript - и сможете начинать изучать Друпал =)


Javascript на базовом уровне освоил(не очень сложно так как уже сталкивался с программированием)
php по техоньку изучаю так сказать в процесе,до mysql тоже дойдет)))