Como fazer listas de links para HTML5 e CSS3 Programming - dummies

Vídeo: Curso de HTML5 - 11 - Listas em HTML5 com OL e UL - by Gustavo Guanabara 2025

Muitas páginas da web se tornam listas de links em programação HTML5 e CSS3. Como as listas e os links estão bem juntos, é bom olhar para um exemplo. Observe esta lista de links para livros escritos por um determinado autor.

Este exemplo não tem nenhum código novo para descobrir, mas a página mostra alguns componentes interessantes:

A lista: Uma lista não ordenada ordinária.
Links: Cada item da lista contém um link. O link tem uma referência (que você não pode ver imediatamente) e o texto vinculável (que é marcado como um link comum).
Texto descritivo: Depois de cada link é algum texto comum que descreve o link. Escrever algum texto para acompanhar o link real é muito comum.

Este código mostra a forma como a página está organizada:

listLinks. Html

Alguns livros de programação agradáveis 

HTML / CSS / JavaScript Tudo em um para Dummies Um recurso completo para desenvolvimento web
JavaScript / AJAX para Dummies Usando JavaScript, AJAX e jQuery
Programação de jogos - o L Desenvolvimento de jogos de linha em Python
HTML5 Game Development para Dummies Criando jogos de web e móveis em HTML5

O recuo é interessante aqui. Cada item da lista contém uma âncora e algum texto descritivo. Para manter o código organizado, os desenvolvedores web tendem a colocar a âncora dentro do item da lista. O endereço às vezes vai em uma nova linha se for longo, com o texto âncora em uma nova linha e a descrição em linhas sucessivas.

Normalmente, a etiqueta vai no final da última linha, então as tags de início parecem as balas de uma lista não ordenada. Isso torna mais fácil encontrar seu lugar ao editar uma lista mais tarde.