логотип
Антивирусная безопасность

Как закруглить углы CSS, HTML, DIV

Рассмотрим варианты, как закруглить углы картинки, панелей сайта, не прибегая к Фотошопу и форматам gif, jpg, png, а с помощью стиля CSS и кода HTML.

Закруглить углы CSS

В CSS прописываем свойство для стиля .corners

.corners {
border-radius: 10px;
}

а в "HTML" код прописываем класс <td class="corners" ...

<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="utf-8">
<title>Закруглить углы</title>
<link rel="stylesheet" type="text/css" href="mystyle.css">
</head>
<body>
<table width="200" height="100" bgcolor="#00e600">
<tr>
<td class="corners" align="center">Вариант 1</td>
</tr>
</table>
</body>
</html>

как закруглить углы css, html, div

HTML

Прописываем в HTML код такой стиль:

<td style=" border-radius:10px; ...">Вариант 2</td>

<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="utf-8">
<title>Закруглить углы</title>
</head>
<body>
<table width="200" height="100" bgcolor="#FFFF00" >
<tr>
<td style="border-radius:10px; border: 1px solid silver; padding: 10px;" align="center">Вариант 2</td>
</tr>
</table>
</body>
</html>

как закруглить углы css, html, div

DIV

<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="utf-8">
<title>Закруглить углы</title>
</head>
<body>
<div style="background-color: #00FFFF; border: 1px solid silver; margin: 5px auto; padding: 10px; width: 200px; border-radius:10px;"> Вариант 3
</div>
</body>
</html>

как закруглить углы css, html, div

Во всех трёх вариантах можно закруглить углы разного радиуса.

Требуется только прописать для каждого угла своё значение: 10px 5px 30px 15px.

как закруглить углы css, html, div

В Internet Explorer свойства "border-radius" не работает и поэтому используют скрипт разработанный Remiz Rahnas border-radius.htc (Скачать) или PIE.htc (Скачать), который загружается в корневую папку сайта. В CSS для стиля .corners прописывается дополнение:

"behavior: url(папка где лежит скрипт/border-radius.htc)"

.corners {
border-radius:10px;
behavior: url("htc/border-radius.htc");
}

Но это все не так существенно, так как сейчас мало кто пользуется IE.





Борьба с вирусами
Все про компьютерные вирусы и методы по удалению.

Компьютер
Безопасность, очистка, ускорение системы.

Вирус и его цель
Вид обнаружение и быстрое удаление вируса.

Вирус в телефоне
Защита от вирусов, очистка, ускорение.

Kaspersky
Компьютерная антивирусная помощь.

Dr.Web
Только Dr.Web антивирусы, сканеры, лечащие утилиты.


Для компьютера
Антивирусные программы ведущих разработчиков.

Для телефона
Бесплатные антивирусные программы на смартфон.

Для флешки
Как обезопасить свой компьютер от вирусов с флешки


Создание и продвижение
Как создать свой сайт и продвигать его в поисковых системах.

Установить на сайт
Доработка сайта с полезными предложениями. .