Datalist apresentada como uma mesa
-
19-09-2019 - |
Pergunta
Como posso conseguir este layout alt texto http://img195.imageshack.us /img195/1870/screenshot20091212at151.jpg (agora o seu feito com mesas) e ainda ter marcação semântica, eu acho que a melhor tag adequado para isso seria dl. Cada célula deve ter a altura de sua linha.
EDIT: na coluna da esquerda contém a descrição eo direito dos dados. Então eu não acho que isso é bem adequado para tabelas. Seria se eu iria passar a descrição para a cabeça da tabela, mas isso levaria 2000 px de largura
Solução
Se você está preocupado com a semântica e acho que esta é a razão pela qual uma lista de definições é mais adequado, leia este documento oficial sobre a lista de definição.
Ele diz:
Listas de definição, criados usando o elemento DL, geralmente consistem de uma série de pares termo / definição (embora listas de definição pode ter outras aplicações)
e
Listas de definição variam apenas ligeiramente de outros tipos de listas em que os itens da lista de consistem de duas partes: um termo e uma descrição.
Isso significa que o termo (por exemplo Anrede
) é descrito / definida pela sua descrição (por exemplo Herr
). Podemos discutir aqui, mas Herr
não é realmente uma descrição do Anrede
é mais um valor possível / palavra (de dados) você pode usar como
Anrede
. E uma definição seria
Uma forma de pessoas de endereço, dependendo do sexo, graduação etc.
Btw para todos os não falantes de alemão, Anrede significa saudação.
Claro que existem exceções, mas de um ponto de vista semântico, uma mesa se encaixa melhor.
Tudo que eu quero dizer é: não sobrecarregar-se com essas coisas. Para obter este olhar o mesmo com etiquetas DL e CSS não vale a pena o esforço. Para usar uma tabela para os seus dados é bom, realmente.
Outras dicas
Se for informações tabulares, em seguida, uma mesa não é o melhor, é o único modo sensata para exibi-lo - isso é o que as tabelas foram feitas para
Para ser um pouco mais formal sobre o assunto, a semântica de seus dados é realmente tabular, não há nenhuma razão no mundo a mentira sobre isso.
Gostaria de usar um <dl>
, porque ele está a apenas 2 colunas.