Como folhas de estilo em cascata (css) de trabalho
CSS, ou Cascading Style Sheets, é o código que controla não só a aparência visual dos seus elementos HTML individual, mas também onde os elementos aparecem em relação um ao outro, e às vezes como eles interagem e animar. Entre HTML, CSS e javascript, você codificar toda a camada de apresentação de um website. powering o local para executar funções dinâmicas ou se conectar a um CMS (conteúdo management sistema) banco de dados requer um código adicional, tal como o PHP.
CSS tem evoluído suas capacidades dramaticamente nas últimas anos- agora é possível criar sites visualmente ricas - com (por exemplo) caixas-de canto arredondado, gradientes simples e texto sombreado - sem o uso de gráficos de bitmap em tudo. Todos estes efeitos frescos pode ser definida como trechos de código e, em seguida, aplicado a qualquer objeto HTML que você sente necessidades alguns gussying-se. Se você sempre exigem uma mudança de todo-o-board para o seu site, atualizando uma linha CSS de código irá fazer o truque.
Para começar suas capacidades CSS fora do chão, você começar definindo uma série de estilos para cada elemento que você deseja afetar, se é um componente HTML (como um link ou um título) ou um elemento CSS (como um recipiente div). Você posso fazer tudo isso definindo dentro do documento HTML em si, mas é mais comum para definir os estilos em um documento separado de sua página HTML. Observe também que você pode definir uma série de modificadores, chamado aulas, que você pode chamar em seu código HTML para afetar ainda mais a forma como elementos aparecem - é semelhante à forma como adjetivos ajudar a especificar o substantivo (s) que estão anexados.
Aqui está um exemplo de código CSS que faz com que todos os seus títulos HTML aparecer vermelho e definido em 18 pontos Arial:
h1 {cor: # e80f0f-font-family: Arial, Helvetica, sans-serif-margem: 20px 20px 32px; linha-altura: 22px; font-size: 18px;} Este código é guardado dentro de um documento separado - neste caso, um documento chamado sample.css. A página HTML refere-se a este documento se externo na seção principal da página. Então, em qualquer lugar da página que o tag é usada, o texto que se segue irá render com as configurações definidas de volta no documento CSS.
Agora, se você quiser ter um título caso especial que fez algumas manchetes maiores com uma ainda mais brilhante vermelho, você poderia configurar uma classe CSS personalizado para lidar com essa tarefa e anexá-lo para a marca em seu HTML. Você pode nomear uma classe algo que você gostaria - apenas certifique-se que tem um período na frente do nome e não tem espaços no nome, como este:
.grande {font-size: 24px; line-height: 26px; color: # e80f0f-}Como se mostra no exemplo seguinte, o primeiro título aparece como o código CSS definiu. O segundo tem a manchete classe .big anexado ao marcador de modo que o resultado é um maior título, mais brilhante.
Observe que no CSS .big exemplo de código classe dada anteriormente, você não tem que repetir as preferências de fonte e de margem. Estas definições já estão contabilizados no estilo originais. Você só precisa de delinear as mudanças. A palavra cascata em Cascading Style Sheets significa que seus estilos são repassados (herdado) Por folhas de estilo que começam suas instruções de suas preferências originais - neste caso, aqueles que você criou na classe. Basicamente, quando você criar um estilo, qualquer elemento que é atribuído esse estilo “cascatas através” para os outros estilos, como dirigido por suas configurações, a menos que você aplicar uma alteração.
Você criar efeitos visuais em CSS como esta usando propriedades aprovadas, tais como font-size, margem, e cor, como usado nos exemplos apenas dadas aqui. Portanto, como você pode imaginar, a chave para obter uma alça sobre CSS (e no que você pode e não pode fazer com ele) encontra-se em estudar todas as propriedades CSS disponíveis e experimentar com que tipo de valores que você pode entrar para cada um . Você pode encontrar listas bastante abrangente on-line se você procurar lista e valores propriedades CSS.
