* You are viewing the archive for the ‘CSS’ Category

menu na horizontal e menu na vertical

Vou colocar 4 exemplos de menus, dois na horizontal e dois na vertical. Um usando lista e outro usando apenas a tag a.

Os 4 tipos de menus

Os dois primeiros exemplos vou fazer em lista:

1 ) primeiro de menu feito em lista na horizontal:
<!– código html!–>
<div id=”menu-lista-horizontal”>

<ul>

<li><a href=”#”>link 1</a></li>

<li><a href=”#”>link 2</a></li>

<li><a href=”#”>link 3</a></li>

<li><a href=”#”>link 4</a></li>

</ul>

</div>
/* código css */
#menu-lista-horizontal{ width:400px; margin:20px 20px;} -  aqui especifiquei o tamanho do menu, colocando margin top, right, botton e left.

#menu-lista-horizontal ul li{display:inline;float:left;} – display:inline e float:left, faz com que o texto se mova para o seu lado esquerdo.

#menu-lista-horizontal ul li a{padding: 0 5px ; color:#000;} … Continue Reading

Colocando png transparente no ie6

Como eu, muitas outras pessoas já devem ter passado por isso. Ralei muito para colocar o background em png transparente no ie6.

Em outros browsers como ie7 , firefox, safari entre outros, já aceitam o método normal de colocar no css background transparente com formato em png, um exemplo:

background: transparent url(../imagens/background-menu.png) no-repeat top left;

transparent – para não aparecer seu fundo (que seria fundo branco, clássico);

no-repeat – serve para não repetir a imagem mais de uma vez, você pode por repeat-x ou repeat-y. Nesses dois casos a imagem iram se repetir respectivamente na horizontal e na vertical;

top left – isso significa o … Continue Reading

Explicando um pouco de css das tags li e a

Muitas das tags, já tem seu valor pré-definido. Por isso usamos a técnica de css reset. Com essa técnica iremos zerar esse valores pré-definido, como já falado. Agora vou falar um pouco de css de algumas tags, como de lista e de links e também vamos falar como colocar estilo diferentes nas tags  só colocando class.

Vamos começar com as listas!

- como já falei no post anterior, para começar uma lista, precisamos colocar a tag “ul” ou “ol” (lista ordenada – numerada) consequemente depois colocamos o li, no qual identifica cada linha dessa lista.

podemos ter dois tipos de lista…

- a lista … Continue Reading

Técnica CSS Reset

Para começar a falar um pouco sobre HTML, vou começar falando de algumas técnicas.

Hoje vou falar da técnica de CSS Reset. Com a variedade de elementos HTML, é capaz de você poder passar por alguns problemas. Esses elementos possuem variedade de estilos em diferentes browsers (ie5, ie6, ie7, ie8, Firefox2, Firefox3, Chroma, Safari, Opera, entre outros, mas o que dá sempre muito dor de cabeça é o Internet Explorer). Com isso você pode passar por vários problemas ao tentar desenvolver o CSS, tirando assim muitas noites de sono.

Para evitar esse tipo de problema, o mais aconselhável … Continue Reading