GUJ Discussões   :   últimos tópicos   |   categorias   |   GUJ Respostas

Duvidas CSS

css
Tags: #<Tag:0x00007f3bb97781d8>

#1

Pessoal fiz o curso CSS e HTML do Alura e agora estou tentando trabalhar em um projeto inicial.

A primeira duvida seria, como mostrar o background inteiro de uma cor apenas? O codigo que fiz preenche apenas as palavras.

nav ul li {
display:inline;
margin-right: 50px;
background-color: yellow;
font-size: 25px;

}

A segunda duvida fica em relacao ao rotate. Consigo fazer o rotate com apenas o texto? No caso abaixo
a class selecionada seria apenas a letra A. Mas nao consegui aplicar o efeito.

.main-title-A:hover {
	-webkit-transform:rotate(-5deg);
	-moz-transform:rotate(-5deg);

}

#2

Olá @Erik_Gabriel, tudo bem? respondendo sua primeira pergunta, já pensou em colocar um espaçamento interno no seu seletor li com a propriedade padding: "algum valor"; assim faz com seu as linhas da lista não fiquem com um background apenas nas letras do seu contexto de navegação.

Agora para a utilização do transform não tem segredo para rotacionar seus textos ao passar o mouse com o pseudo seletor hover:

Tente usar valores mais altos para sentir a diferença de rotação. tem uns exemplos legais no W3C Schools: http://bit.ly/2pJyVTV e também um outro artigo que fala sobre isso aqui na comunidade: Ajuda na utilização do Hover

Espero ter ajudado, Abraços! :smile: :computer: :floppy_disk:


#3

Cara voce me ajudou sim…Na parte do “rotate”.

Porem ainda fiquei com duvidas no menu li. O background com padding aumenta em torno da palavra apenas. Ainda nao consegui fazer o back ground de fora a fora.


#4

Então @Erik_Gabriel, pra entender melhor o que você está fazendo eu criei esse menu com background-color: yellow; nas tags <li>, veja se é mais ou menos o que precisa:

Deixei o código disponível nesse repositório https://jsfiddle.net/4n1bufLg/

:slight_smile: :computer: :floppy_disk: