Pesquisar na Comunidade
Mostrando resultados para as tags ''introdução''.
Encontrado 2 registros
-
css Aula 5 - Introdução ao CSS, como utilizar estilos
um tópico no fórum postou Lordfire Tutoriais de Websites
E aí galera, finalmente vamos começar a deixar tudo mais bonito usando CSS! Mas não esqueça de acompanhar todas as aulas! Como vocês já devem saber, o CSS é uma linguagem que serve para adicionar estilização às nossas páginas. Isso é feito por meio de uma folha de estilos, que é um conjunto de seletores, propriedades e valores. Para usar o CSS, temos três formas: em um arquivo externo, no cabeçalho e inline. Para usar um arquivo externo com css, dentro das tags <head> você deve adicionar o seguinte código: <link rel="stylesheet" href="arquivo.css" /> Lembrando de mudar "arquivo.css" para o nome do arquivo que você for usar. Eu costumo usar "style.css" ou com o mesmo nome da página, se necessário. O conteúdo desse arquivo deve ser apenas o código CSS, sem nada de HTML. Já para usar no cabeçalho dentro do head, devemos usar a tag <style> e dentro dela, o código CSS: <head> <style> p { color: blue; font-weight: bold; } </style> </head> Também podemos usar estilos "inline", isto é, no meio do código HTML para aplicar estilos a um único elemento, usando o atributo style que já usamos em aulas anteriores. Por exemplo: <p style="color: blue; font-weight: bold;">Texto azul e negrito</p> Obviamente, é possível misturar todos os três tipos. É bastante comum uma página que tem um layout padrão para todas as páginas (com arquivo externo), algumas páginas terem elementos que precisam de estilos específicos (com CSS no cabeçalho) e um ou outro elemento que tenha seu próprio estilo (usando inline). Tudo vai da necessidade e facilidade pra alterar depois. Seletores Um seletor nada mais é do que o elemento que desejamos aplicar o estilo. Existem três tipos de seletores: por tipo, por id e por class. Seletor por tipo Quando usamos um seletor por tipo, nós aplicamos um estilo a todos os elementos daquele tipo. Por exemplo: p { color: blue; font-weight: bold; } Esse código CSS fará com que todos os elementos <p> tenham o texto azul (color: blue) e negrito (font-weight: bold). Em uma página com mais de um, todos eles terão o mesmo estilo. Seletor por id Usando um seletor por id, nós aplicamos estilo a um único elemento identificado pelo atributo id específico. Para isso, devemos usar um hash (o jogo da velha: "#") na frente do id do elemento: <head> <style> p#azul { color: blue; font-weight: bold; } </style> </head> (...) <p id="azul">Texto azul e negrito</p> <p>Texto normal sem estilo</p> Também é possível omitir o tipo do elemento: #azul { color: blue; font-weight: bold; } Produzindo um texto azul e negrito. Tome cuidado: o id foi feito para identificar um elemento específico, portanto, evite usar o mesmo id para elementos diferentes. Use classes, que serão ensinadas agora: Seletor por class Um seletor por classes aplica estilo por todos os elementos identificados por um atributo "class". Um seletor para uma classe específica deve ter um ponto (".") na frente: <head> <style> p.azul { color: blue; font-weight: bold; } </style> </head> (...) <p class="azul">Texto azul e negrito</p> <p id="azul">Texto normal sem estilo</p> Note que também não é necessário usar o elemento na frente. Mas, neste caso, podem existir elementos diferentes com a mesma classe, e podemos trabalhar com isso: <head> <style> .azul { color: blue; } a.azul { background-color: black; } p.azul { font-weight: bold; } </style> </head> (...) <a class="azul" href="http://xtibia.com">XTibia!</a> <p class="azul">Texto azul e negrito</p> Limitando a classe para um elemento específico, vamos ter tanto o link quanto o parágrafo em azul, porém apenas o link terá fundo preto e apenas o parágrafo estará negrito. Você pode aplicar múltiplas classes em um mesmo elemento usando espaços: <p class="azul fundo_vermelho center">Texto azul e negrito</p> Uma classe ou id nunca deve começar por um número! Só o esquisito Internet Explorer aceita isso, hahahaha Podemos trabalhar com os 3 seletores juntos, inclusive usando inline: <style> p { color: blue; } a.azul { background-color: black; } #azul { font-weight: bold; } </style> (...) <p id="azul" class="azul" style="text-align: center;">Texto azul, com fundo preto e negrito, centralizado</p> Mas não esqueça, o CSS tem uma ordem específica para ser aplicado: Arquivos externos, de cima pra baixo Tag style, de cima pra baixo Atributo style (inline) Portanto, não importa o que o arquivo externo aplique ou as tags no cabeçalho, se houver alguma tag inline, ela vai substituir (mas nunca apagar: apenas soma). Aqui há uma lista com todas as propriedades disponíveis: http://www.w3schools.com/cssref/default.asp Para ver os valores possíveis, clique no nome da propriedade. Você pode me perguntar sobre isso, ou me esperar ensinar algumas das principais possibilidades nas próximas aulas. -
Já passou da hora de introduzirmos e, talvez, até migrar a galera pra esse tipo de sistema(unix). Sei que bastante usuários aqui são iniciantes, leigos, principalmente quem procura por servidores de pokemon, mas, que tal aprender e botar em prática o aprendizado pra uma significante melhora no seu servidor e no trabalho nele em geral, principalmente manutenção? Pra quem ainda não sabe do que estou falando: Unix-like » Beleza campeão, mas e eu, o que ganho com isso? Robusto e estável: Linux pode suportar grande carga de trabalho sem falhar, e um servidor Linux pode permanecer em funcionamento por meses ou anos, sem precisar ser reiniciado uma única vez. Processos rodando em Linux podem ser encerrados de forma isolada, sem afetar todo o sistema. Acessível: Com custo de licença zero, Linux pode ser instalado em quantos computadores você desejar. Flexível: Com código-fonte aberto, inúmeras opções de configuração e inúmeros softwares desenvolvidos para Linux, ele se torna o sistema mais flexível do mercado, podendo se adaptar a qualquer empresa. Seguro: Levando a segurança em conta desde sua concepção inicial, Linux é muito mais imune a vírus e outras ameaças de segurança do que outros sistemas operacionais. » As coisas melhoraram, mas e pro meu servidor, o que isso significa? Pensemos bem: se o Linux nos da todas essas vantagens sobre outros sistemas, o que ganhamos no nosso servidor com isso? Estabilidade, segurança, um trabalho mais fácil e mais confortável e principalmente desempenho. Por quê? O linux é muito mais leve! Logo você pode exigir mais da capacidade do seu dedicado/vps com menos máquina. E isso é uma beleza, humpty-dumpty?! Logo, economia e satisfação ao jogador por melhor qualidade do serviço prestado. » Parece legal, algo mais pra me convencer? Se após argumentos tão válidos e necessários para um servidor, como estabilidade, segurança, flexibilidade e portabilidade ainda não o convenceu, leia este artigo. Se estiver com pressa, clique aqui e veja 5 belos motivos. » Whooo-yupi, por onde devo começar? Antes de tudo você deve escolher um sistema e provir de uma máquina com este sistema. Os sistemas preferíveis para servidores são: Gentoo Debian Ubuntu Slackware CentOS BSD's(unix-like, requer mais conhecimento) Alguns downloads: clique aqui, ó. Ao contratar um serviço de hospedagem/dedicado ou VPS. Exija ou peça uma máquina com a pré-instalação de algum desses sistemas. Se a empresa já trabalhar com estes sistemas, melhor.[A ****** tê da a portabilidade de escolher qual sistema quer usar e por preços baixos e qualidade indiscutível, visitem: www.******.com.br] » Agora veja uma lista de tutoriais aqui no Ékz, com compilação de OTservs e uso geral do Linux em OpenTibia: • Compilando em Ubuntu e Debian • Compilando em Ubuntu [outro] • Outro tutorial de compilação em Linux • Anti-nukers e informações • Diferenças entre Windows vs Linux • Rodando RME no Wine[linux] • Compilando em Conectiva • Informações sobre servidor rodando em Linux » E se eu tiver alguma dúvida, onde procuro por ajuda? Basta visitar as seguintes seções aqui no Ekztibia: • Dúvidas sobre Linux/Unix-like's • Dúvidas sobre Rede/Infraestrutura • Tutoriais sobre Linux/Unix-like's • Tutoriais de Rede/Infraestutura Tudo em mãos. Vamos lá? www.******.com.br Abraços e boa sorte, Henrique M.
