Dê efeitos as fotos com HTML

Melhore as imagens para a Web usando HTML.

HTML e CSS

Hyper Text Markup Language (HTML ou em espanhol "linguagem de marcas de hipertexto") é uma linguagem de autor comum usada por desenvolvedores da Web para criar sites estáticos. A estrutura de uma página da web é estabelecida com HTML. Embora seja bom criar o esqueleto do seu projeto da web, não é tão bom usá-lo como um estilo ou para efeitos. Para isso, folhas de estilo em cascata (CSS) são usadas e complementadas com o seu HTML, ele permite que você adicione elementos gráficos e estilos à sua página web. Por exemplo, se você quiser que o texto apareça em negrito em todos os títulos de cada página, você pode fazê-lo com CSS

Opacidade da imagem

Um dos efeitos gráficos mais comuns é a opacidade. A opacidade determina o grau de transparência de uma imagem encontrada no site. Se você quiser colocar uma imagem de plano de fundo em sua página da web e precisar reduzir a opacidade para criar um efeito mais transparente, poderá fazê-lo com CSS. Coloque o código CSS correspondente na tag HTML :

sua imagem

Neste exemplo, a opacidade em "50" foi definida, reduzindo a visibilidade das imagens da página da Web pela metade.

Efeito "Mouse over"

Você pode ter o efeito de opacidade um passo além e alterar a opacidade de uma foto quando o cursor do usuário passar sobre ela. Este é um efeito "mouse-over". O código é semelhante a uma simples alteração de opacidade e também é colocado dentro da tag HTML . Este é um bom efeito de usar os botões de navegação.

Você pode ver os comandos "onmouseout" e "onmouseover". Ao carregar a página, este código reduz a opacidade da imagem em% 50, quando você passa o cursor sobre ela aumenta para% 100, quando você faz os cursos a imagem é reduzida novamente para% 50.

Flutuar (flutuar)

"Float" é outro efeito HTML e CSS simples para uma foto. O "float" define onde uma imagem aparecerá dentro de uma tabela, célula ou documento. O comando "float" usa as propriedades da esquerda, direita e centro. Você pode usar isso para colocar uma imagem dentro do texto ou para criar uma série de imagens corretamente posicionadas em uma galeria. Você pode definir isso na tag head HTML da seguinte forma:

No exemplo anterior, foi indicado que todos os elementos HTML com a tag Flutuam para a esquerda no documento.