CSS: Efectos cantos redondeados de elementos

Sintaxe de CSS está deseñado para simplemente que a posibilidade de obter o deseño máis inesperado está dispoñible mesmo lonxe da programación e desenvolvemento de sitios humanos. Quizais o feito de que os nenos xogan con bloques quedan na memoria de todos, utilizar a experiencia multi-achaflanada HTML, CSS e fácil.

Con todo, a programación actual aínda está moi lonxe de presentar construcións da realidade. Ata o momento, ningunha área (ocupado o que lle gusta elemento de bloque) en calquera do seu significado eo nomeamento formal dunha forma rectangular, que está formado dentro da liña curva de contorno desexado.

Ata o momento, ningún círculo, radio de redondeo, como un straight curvo e así por diante. P. Describe as ecuacións complexas matemáticas ou moi pequenos cubos, trapézios, triángulos ou outros elementos retilíneos que son distinguíveis a ollo como un punto na liña.

deseño de liña recta Classic

Non é sorprendente que o progreso no campo de tecnoloxías de programación e información legalizado proxecto rectangular. ideas innovadoras non perder tempo con unha forma arredondada, pero non te esquezas de presentar a disposición dos recursos de desenvolvemento suficientes e regras de etiquetas HTML, CSS e linguaxes de programación relacionados.

Calquera elemento usado na páxina é unha área rectangular, na que está alocada varias partes, das cales en cada caso debe ser usado só necesario considerar requisitos krossbrauzernosti características de marcación de contido específico construcións sintácticas dispoñibles.

Regras xerais para CSS

CSS ofrecer para describir os elementos do seguinte xeito:

• propiedade: valor.

Neste caso, a propiedade - nome específico e valor pode ser un nome ou unha lista de nomes ou valores.

En relación aos elementos de bloque e a necesidade de facer vía CSS cantos redondeados, ten sentido empregar a propiedade border-radius eo seu valor en formato "38px" ou "8px 16px 24px 38px".

Se o valor determinado por un único número, será definido como os de todos os ángulos. Registre todos os catro valores son:

• primeiro número - para o ángulo superior esquerdo;
• o segundo - na esquina superior dereita;
• o terceiro - para o ángulo inferior dereito;
• última - na parte inferior esquerda.

Compartindo algunhas das regras

fronteira conceptos, imaxe e fondo poden ser utilizados en conxunto. Isto é normal, e mencionou regras non interfiren uns cos outros, formando a composición global. A principal cousa - para explicar o feito de que o nome de cada un deles representa, e como ela é aplicada.

Antes de aplicar un ou outro elemento, é importante a realización de algunhas experiencias e traballo de proba en distintos navegadores. Orientación ao Consello, recomendacións, exemplos de terceiros ou sintaxe CSS, cantos redondeados, e así por diante. N. raramente é mellor que a súa propia práctica fresco.

É importante entender que a fronteira, imaxe, en termos de ángulos de deseño - o mesmo tipo de concepto. Deseño pode ser non presentados en png formato. Será cortado polo navegador, segundo as regras establecidas no CSS. Cantos redondeados - creador de coidar, con independencia da cuadratura do material de orixe.

Características HTML, CSS de navegadores

Benvido xunto gravación de estilo - para todos os navegadores dunha soa vez. En fin exemplos clásicos sobre o tema "CSS: cantos redondeados" oferta para escribir así:

background: # FF7F00; / * * Fondo /

fronteira: 1 px # CCCCCC sólido; / * Border * /

-moz-border-radius: 10px; / * CSS cantos redondeados para Mozilla Firefox * /

-webkit-fronteira de raios: 10px; / * ... para Safari e Chrome * /

-khtml-fronteira de raios: 10px; / * ... Konquerer * /

fronteira de raios: 10px; / * O CSS cantos redondeados para todos * / e así por diante. N.

Con todo, na maioría dos casos é suficiente para especificar a última regra. A redundancia debe ser usado só cando hai unha necesidade real.

mesa clásico e marabilloso

A pesar de moitas controversias partidarios esquema da táboa (tr, td) ea posibilidade de usar as etiquetas div e span ( «marabillosa" Esquema), obxectiva opción práctica favoreceu razoablemente necesario.

En divs teñen algunha dignidade nas outras mesas. Se eles non se complementan, e só competir, a cuestión tería rapidamente evaporou nunha versión que combina os mellores aspectos de táboas e divs.

A maioría dos sitios creado usando CMS (Content Management System), e na disposición do creador ven non só unha gran variedade de conxuntos de datos "xigante" de centos de carpetas, obxectos, pero tamén mesas.

Tag [div | extensión], como tal, non destaca, pero o único que vén precisamente completamente á mercé do creador - unha folla de estilo CSS. E calquera CMS separa claramente o código, parte da creatividade do creador e os seus propios estilos de estilo engadido, e no caso de modificacións (por exemplo, css - redondeando os ángulos da mesa), sempre pode restaurar a configuración e estilos estándar.

Curvas e ángulos non cubertos pola sintaxe

Pode cumprir rigorosamente as normas de HTML, CSS, pero para ter un resultado, eles non son fornecidos. Superpoñendo elementos entre si, é posible obter ningún país de calquera configuración. Utilizando PHP-desenvolvemento no servidor, pode enviar para o navegador do visitante e os ficheiros de estilo para achegar a eles o código JavaScript axeitado no corpo dun ficheiro HTML ou un JS-arquivo separado.

Calquera variante do circuíto, calquera forma de elemento de propiedade e regras CSS! Cantos redondeados - meramente particulares e oportunidades reais é moito máis amplo. Neste caso, a programación dos seus propios obxectos, pode non prestar atención ás características dos navegadores individuais, use só as etiquetas e estrutura das linguas de hipertexto, que son percibidos por todos, sen excepción navegadores.

Usando a idea de programación orientada a obxectos, pode crear a aparencia de un canto ou unha curva, obviamente, non está previsto por calquera formularios de navegador. Neste caso, non é necesario que este será o canto da zona, que era orixinalmente unha forma rectangular. É importante que os compoñentes da curva descrita en forma de regras CSS, combinados nun único código visual obxecto JavaScript e no momento no navegador lugar seguro, se reflicte na forma correcta.

Esta tecnoloxía non interfire cos obxectos de realizar-se nun plano ou programa de animación tridimensional.