Css Nightmare

Como testar o nosso site no IE5.5 IE6 IE8 IE7 ao mesmo tempo num PC

2009-11-08T04:38:00.000-08:00

Ao desenvolver um site em CSS é necessário verificar o projecto em alguns navegadores como o IE (6,7,8) e Firefox. Uma vez que o IE é o navegador mais utilizado (com mais de 80% de utilizadores) em todo o mundo deve haver uma preocupação em tornar o meu site perfeito em todas as versões do IE.

Existe uma ferramenta para verificar o site no IE5.5, IE6, IE7 e IE8. Usa esta ferramenta que pode mostrar-te como uma página web é visualizado em todos os browsers acima mencionados. É para Vista e XP.

O programa IE Tester é muito útil para web designers. Faz download do software ...

OFFF - Internacional Festival For The Post-Digital Creation Culture

2009-11-07T16:27:00.000-08:00

Depois de New York, Barcelona e Lisboa, Paris foi o local eleito para acolher no próximo ano a edição do Festival OFFF, único festival de cultura pós-digital do mundo.

Paris 2010 - 24, 25 e 26 Junho

Site OFFF

Iniciação CSS

2009-11-07T15:29:00.000-08:00

As CSS (Cascade Style Sheets) têm a seguinte nomenclatura:

"selector", a propriedade ("property") e o valor ("value").

selector {property: value}

cada "selector" pode ter várias propriedades "property", sendo obrigatório a separação das mesmas com o ";".

Exemplo:

body {background: #CCFFFF; margin: 0px;}

ou

body {

background:#CCFFFF;

margin: 0px;

}

CLASS
Class: cria uma "biblioteca" de estilos que pode ser aplicado em qualquer tag. Este tipo de CSS tem sempre um "." (ponto) antes do nome e não deve ter inicialmente um número.

Exemplo:

CSS

.texto {

font-family: Arial, Helvetica, sans-serif;

font-size: 10px;

font-weight: bold;

color: #000000;

background-color: #CCCCCC;

margin: 4px;

padding: 2px;

}

HTML

<p class="texto">o meu texto</p>

TAG

Tag: aplica um estilo para uma tag específica, como o . Este tipo de CSS é descrito com o nome da tag, sem qualquer ponto "." no início ou aspas.

Exemplo:

CSS

body {

background: #000000;

margin: 0px;

Significa que a página vai ter um pano de fundo ("background") preto e sem margens.

Avançado:
Podemos aplicar estilos para pseudo-tag (como efeitos de texto para links) e IDs (por exemplo: aplicações de estilos nas DIV e Layers)

A nomenclatura é a seguinte:

selector:pseudo-class {property: value}

"Pseudo-tag":

a:link {color: #FFFFFF;text-decoration: underline;}

(a tag significa "anchor" (ancora), que permite fazer uma Hiperligação ("Hyperlink") para uma outra página ou para um outro lugar da mesma página)

Exemplo:

CSS

a.texto:link {
font-family: Arial, Helvetica, sans-serif;
font-size: 20px;
font-weight: bold;
color: #FFFFFF;
text-decoration: underline;
}

a.texto:visited {
font-family: Arial, Helvetica, sans-serif;
font-size: 20px;
font-weight: bold;
color: #FF0000;
text-decoration: underline;
}

a.texto:hover {
font-family: Arial, Helvetica, sans-serif;
font-size: 20px;
font-weight: bold;
color: #FFFFFF;
background:#0000FF;
text-decoration: underline;
}

HTML

<p class="texto">Texto <a

href="http://www.w3schools.com" class="texto">Link</a></p>

O "ID selector"

É possível definir estilos para elementos do HTML com o "ID Selector". Este tipo de CSS é descrito um asterisco "#" antes da designação e, também, não deve conter um número no início.

Exemplo:

CSS

#div_amarelo {
background-color:#FFFF00;
width:150px;
height:150px;
margin:30px;
padding:10px;
}

HTML:



<div id="div_amarelo">



<p class="arial">Esta Div tem:<br>



altura: 150 px <br>



largura: 150 px <br>



fundo: amarelo <br>



margem de 30 px<br>



padding: 10 px </p>



</div>

"Comentários" nas CSS

No código HTML existe basicamente este comentário:



No código CSS existe somente este comentário:

/* o meu comentário */

30 Sugestões de Livros WebDesign

2009-11-07T15:09:00.000-08:00

Para acompanhar a indústria de web design podes procurar fontes de auto-estudo sempre que possível, tais como livros, ou então ficarás para trás. Consulta aqui!

Lista de links para tutoriais e dicas

2009-11-07T14:25:00.000-08:00

Excelente lista de links para tutoriais, dicas e recursos sobre a utilização de CSS. Consulta o site de Grace Smith.

Imagem optimizada no Photoshop

2009-10-27T12:42:00.000-07:00

Baixa Qualidade:

Alta Qualidade:

O próximo passo: HTML 5

2009-10-25T15:07:00.000-07:00

HTML (Hypertext Markup Language) é o código que ajuda a formatar a world wide web.

Ao que tudo indica, a tão sonhada Web Semântica de Tim Berners-Lee está no caminho de acontecer e o HTML 5 pode ajudar bastante a chegar lá. O sistema de divisão de marcações é todo feito por tags. Na nova linguagem algumas dessas “etiquetas de marcação” são mais objectivas. De um modo geral, com essas e outras novidades, será muito mais fácil navegar pela Internet!

O seu núcleo de editores (Ian Hickson e Dave Hyatt), da Google e Apple respectivamente, apresentaram os últimos recursos numa conferência do Google I/O deste ano.

A Google em particular, está empenhada em melhorar a usabilidade e as possibilidades do desenvolvimento web.

Já é oficial!!!

2009-10-25T14:24:00.000-07:00

Quem nunca teve problemas com bugs no IE6 que atire a primeira pedra.

Não adianta, quem trabalha com web sempre teve esse problema.

Agora é hora de o mundo aceitar o facto - o Internet Explorer 6 está morto.

Existem vários Sites que incentivam à morte do Internet Explorer 6.

Parece que o mercado estava apenas a aguardar o anúncio de que os utilizadores já são em menor número que os da versão 8.

O Internet Explorer 6 é antiquado, nunca suportou decentemente os padrões web e ainda é o pesadelo de muitos webdesigners, vai deixar de ser suportado oficialmente pela Microsoft. Isto não é sobre ser anti-Microsoft, é sobre a exigência de que se incentive as pessoas a migrar para navegadores mais modernos, como o IE8, o Firefox, Chrome, Safari e Opera.

Se ainda utilizas esse browser, faz o upgrade.

Para mais informações, e prestar as tuas condolências, visita:
http://ripie6.com/

http://www.ie6nomore.com

http://enoughie6.com/en

Bem-vindos

2009-10-22T11:44:00.000-07:00

Bem-vindos ao meu blog.
O objectivo deste blog é deixar algumas ideias, tutoriais e dicas sobre CSS - Cascading Style Sheet.
Caso tenham alguma dúvida deixam aqui a vossa questão. ;)

Catarina