Listas OL e UL - @Curso em Vídeo HTML5 e CSS3 

Um atalho legal pra cria varias tag iguais com uma digitação e o "*" Um exemplo as voce digita li*7 por exemplo e vai cria 7 quando der enter

pra quem ta aprendendo html desde o começo, ja fique em mente que ul é uma das coisas mais uteis de um site

Para quem está vendo o vídeo agora, eu dei uma olhada na documentação MDN que o VsCode sempre recomenda e o parâmetro "type" dentro do ou está ultrapassado. O correto é colocar esse parâmetro dentro das CSS. Fica mais ou menos assim: ol { list-style-type: 1; } ul { list-style-type: circle; } Valeu pessoal, ótimo curso para vocês!

Esse conteúdo foi tão confuso no primeiro semestre de ADS, até a professora ficava perdida na explicação/correção. Já aqui parece ser tudo tão fácil, eu mal vejo a aula e consigo pegar tudo de primeira, Guanabara é fera demais!!!

Um bom exemplo é uma receita gente. A não ordenada nós usamos nos ingredientes necessários, nquanto a ordenada usamos no modo de preparo, no qual há uma ordem a ser seguida. Olhem: 1 Ovo 1/2 Xícara de chá de leite 2 Xícaras de farinha etc etc Quebre o Ovo Coloque o ovo etc etc.

*MOTIVOS PARA VER ESSE VÍDEO:* • Ver como listas são importantes • Saber quais tipos de listas existem • Aprender a personalizar listas facilmente • (adicione mais motivos no comentário abaixo)

Queria deixar minha humilde contribuição por aqui, eu tenho o costume de fazer bastante marcações nos códigos, um atalho legal pra não ficar precisando digitar "

As vezes eu penso que o Guanabara é um Anjo mn, namoral, Que Curso Foda!

Muito bom o curso, não vejo a hora de entrarmos em CSS! 👏👏👏

Se você tiver dúvida de como ele vai pro final da linha tão rápido, é só apertar a tecla "end" no seu teclado, geralmente esta em cima das setinhas

Estou fazendo o curso agora em 2022, estou muito satisfeito com a didática, da forma geral como o curso é ministrado! E que show de bola né, o curso é inteiramente gratuíto! Guanabara, você é o cara que vai me fazer, finalmente, entrar para área de TI, e isso é algo que não vou esquecer jamais! Valeu demais!

Atualmente estou com 13 anos, e já me identifico muito com programação! Estou gostando muito do curso e vou assistir ate o módulo 4 (estou esperando o 5 começar) Desejo boa sorte a todos que estão vendo este comentário e muito sucesso!

Juntei esta aula com aquela das imagens e fiz uma lista de imagens usando o img dentro do da lista ordenada ficou legal e me deu umas boas ideias

A tag não tem mais o parâmetro type na versão atual do HTML. Esse atributo está obsoleto. Você pode usar a propriedade CSS list-style-type para definir o estilo:

Grande Professor! Eternamente grato pela sua dedicação em passar conhecimento p/ todo mundo! Estudo Análise e Desenvolvimento de Sistemas, mais sem dúvida nenhuma se não fosse seu canal estaria completamente perdido. Ainda tá pra existir uma didática tão fera quanto à sua. Gratidão eterna pelo seus ensinamentos. Abraços!

Uma coisa bacana é apertar Shift+alt+seta pra baixo para duplicar a linha, assim é possivel fazer varias list itens sem muito esforço.

Tive que voltar umas 10 vezes em 3:56 pra saber se era o Guaná ou uma drag que mandou esse "vamos".

Amei a aula! Oh pessoal, eu estou fazendo assim: Tenho um site meu que já estava desenvolvendo há bastante tempo (desde que comecei a seguir os cursos de HTML5 e CSS3 do Gustavo Guanabara) tudo que estou aprendendo aqui estou indo adicionando no meu site afim de treinar já criando um site... Como por exemplo, tudo que foi abordado aqui, também botei lá no meu site kkkkk

Guanabara é um gênio, bagunçou a ordem dos exercícios exatamente para poder dar um exemplo prático do uso de listas ordenadas. Um homem á frente de seu tempo.

Cara! Muito obrigado por disponibilizar esse curso pra nos. Estou começando nesse rumo da tecnologia e estou adorando não só esse novo mundo de experiencias, mas também em ter essas aulas incríveis com vc. Não pare de fazer esse curso, por favor.

sensacional como sempre! gratidão, professor!

Assisti a várias aulas básicas de HTML, com certeza, esse curso é o melhor!

Obrigado Guanabara pelo conteúdo produzido com carinho e muita dedicação .

Para escolher quantos você vai usar, você pode usar ol *OU* ul>li*4 Você pode colocar qualquer número de acordo a sua necessidade no lugar do 4 que vai ser gerado automáticamente pré determinados "li"

muito bom seu curso todo dia cedo a noite e exercitando mutio valeu continua assim sempre

obrigado professor Gustavo, seu curso é ótimo

Esse curso é sensacional

Com certeza muito útil para nosso dia a dia, amando as aulas!

Aula Fantástica ! Parabéns Guanabara.

Estou fazendo do e estou gostando e aprendendo muito, só agradece.

só uma palavra PERFEITO

estava com medo desse conteúdo, mas foi bem tranquilo, grato pela aula.

Muito boa a aula! Teve uma hora que eu me atrapalhei nas listas aninhadas mas tentei parar, pensar e entender a lógica, daí quando tentei outra vez consegui. Está tão no início e parece que já aprendi tanto, imagina até o fim do curso, o tanto que vou ter visto. Obrigado!

Ótimas suas explicações. Farei todos os seus cursos 🤞

Aula ajudou muito, obrigado Mestre Guanabara s2

Aprendendo muito com o Grade Guanabara

Bom trabalho, obrigado pela informação.

Bom dia. Sigamos. Que Deus nos abençoe.

Parabéns pela didática, Guanabara!!

Obrigado pela aula!

Muito bom!

Excelente aula sobre listas, Guanabara!

Aula muito boa como sempre!

Estou fazendo esse curso enquanto também aprendo java com um amigo, mesmo sendo duas coisas distintas estou absorvendo e aproveitando mundo. Nao estou anotando nada, porém esse sempre foi meu jeito de estudar e absorver informação. Obrigado pelo curso, depois deste vou fazer o de javascript. Espero conseguir entrar na area em pouco tempo, tenho 15 anos. Abraços Professor!

Listas ordenadas Acordar Escovar os dentes Tomar café Ir para o trabalho Listas não ordenadas Pão Açúcar Leite Arroz valeu,, gustavo. tô TREINANDO AS AULAS. 👏👏👏🤙✍

Aprendendo muito!

muito bom o curso

Cara, eu no eu exercício ja colocando comentários no código para não esquecer, e logo em seguida, o professor sugeriu fazer isso no video. Me senti uma menina a frente do meu tempo 😂😂. Brincadeiras a parte, é muito legal fazer determinadas anotações em exercícios, para quando for necessário, você poder relembrar. Agradecendo mais uma vez o professor Guanabara, por proporcionar uma aula bacana para nós estudantes de HTML e CSS. Está me ajudando muito mesmo.

Obrigado professor!

Aula assistida com sucesso ✅

Excelentes as aulas!!!!

Feliz Ano novo melhor professor da web!!!

mano que curso massa de html, ainda com documentação 🖖🤓

Mutio Obrigado Guanabara.

Perfeito!

Excelente !

Aula top!

Ótima aula!

Obrigado guanabara !!😁

Top!

Obrigado!!

Obrigado Guanabara.

Top, valeu!

Valeu professor!

Rapaz, lembro quando eu comecei, não tinha livro sobre HTML no Brasil nem RU-vid. Comecei fuçando arquivos .html do Windows 98 (o 95 não tinha HTML nas primeiras versões). Tinha lá o comando "código fonte", deduzi que era o código por trás do arquivo. Como tudo no Windows era extensão de arquivo, também deduzi que o browser interpretava os "códigos" e bastaria abrir o arquivo no Notepad pra ver e editar o código fonte. Criava cópias dos arquivos, mexia no código só pra ver o que acontecia. Na época as folhas de estilo nem eram muito usadas (como eu disse, nem tinha livro sobre web design no Brasil). Eu ficava mudando cor do background com a propriedade BGCOLOR (hahaha). Descobri que dava pra usar nomes de cores (LIME, RED, INDIGO, TEAL). Criava lista. Tinha um editor que vinha no Windows 98, o Frontpage, mas eu queria aprender fuçando no código. Uns dois anos depois foram aparecendo os livros enormes e caros. As revistas que vinham com CD não ajudavam nada.

obg pelo curso de html e css ❤❤❤❤❤❤

Curso muito bom rumo ao desenvolvimento ... 🖒

melhor professor do RU-vid

Show!!

📝 : A tag em HTML representa uma lista ordenada de itens. Esses itens são tipicamente exibidos com uma contagem que os precede, que pode ser de qualquer tipo, como numerais, letras, algarismos romanos ou simples símbolos. Café Chá Leite As opções ‘1’, ‘A’, ‘a’, ‘I’, ‘i’ são usadas com o atributo type na tag para especificar o tipo de numeração que você deseja usar para os itens da lista. Aqui está o que cada uma dessas opções significa: 1: Os itens da lista serão numerados com números (1, 2, 3, etc.). Este é o padrão se o atributo type não for especificado. A: Os itens da lista serão numerados com letras maiúsculas (A, B, C, etc.). a: Os itens da lista serão numerados com letras minúsculas (a, b, c, etc.). I: Os itens da lista serão numerados com algarismos romanos maiúsculos (I, II, III, etc.) . i: Os itens da lista serão numerados com algarismos romanos minúsculos (i, ii, iii, etc.). ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- : A tag em HTML representa uma lista desordenada de itens. Isso significa que a ordem dos itens na lista não é importante. Os itens em uma lista desordenada são tipicamente exibidos com um marcador, que pode ser um ponto, um círculo ou um quadrado. Café Chá Leite As opções ‘disc’, ‘circle’ e ‘square’ são usadas para alterar o estilo dos marcadores em uma lista desordenada () em HTML. No entanto, essas opções estão obsoletas em HTML5 e você deve usar CSS para alterar o estilo dos marcadores. disc: Este é o padrão. Um círculo preenchido. circle: Um círculo não preenchido. square: Um quadrado preenchido. ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- : A tag em HTML é usada para representar um item que faz parte de uma lista. Este item deve estar contido em um elemento pai, que pode ser uma lista ordenada (), uma lista desordenada (), ou um menu () e representa uma única entidade dessa lista. Em listas desordenadas () e menus, os itens da lista geralmente são exibidos com pontos de marcação. Em listas ordenadas (), os itens da lista geralmente são exibidos com números ou letras. primeiro item segundo item terceiro item primeiro item segundo item terceiro item ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- li*(Numero de li que se querer criar): Ex:li*7 = criar 7 tags de linhas de listas. ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- start: Você também pode indicar o início da contagem usando o parâmetro start. Por exemplo, a tag

Meu, na boa, tu é foda dmais Sz

ótimo!

mt obg

fala pessoal uma dica muito boa e dar uma olhada no material de apoio, lá tem um exercicio muito bacana sobre listas.

Curso foda

Muito bom

Top

to acompanhando ele deis de o primeiro video, o curso de html 5, quando ele começo eu so tinha 5 anos

MUITOOOOOOOOOOOOOOOOOOOOOOOOOOOOO BOMMMMMMMMMMMMMMMMMMMMMMMM!!!!!

Boa aula. Só faltou as listas de definição e como fazer listas com sublistas (aninhadas). 1. Compras no shopping 1.1 Comprar camisas 1.2 Comprar calças 2. Trabalho Para fazer isso é só criar uma outra lista dentro da principal usando ou . Vai depender do tipo de lista que está utilizando.

Sabia que essas pastas ia embolar alguma hora! Hehe.

tive que usa o caderno pra ser meu IDE e sinceramente achei muito mais produtivo.

Lembrando que para renomear uma pasta basta clicar sobre a mesma e apertar F2

Eae pessoal, beleza ? Eu sou o dona da Let's.code(BR), uma comunidade de desenvolvedores que tem como objetivo ajudar iniciantes no mundo da programação. Temos membros ativos, que sempre estão dispostos a tirar dúvidas sobre qualquer linguagem. O nosso sistema de organização dividido por linguagens, o modo como os membros podem tirar suas duvidas e a grande quantidade de pessoas disposta a ajudar é o que torna o nosso servidor a escolha Idea para vc, dev. Seja bem vindo!

Uma coisa que percebi quando fui fazer é que: no parâmetro START pode ser atribuido apenas números! Ou seja mesmo que o TYPE seja type="a" e você quer que comece a lista na letra por exemplo, colocar start="c" NÃO TERÁ ÊXITO. Mas se colocar um valor numérico correspondente a essa letra conseguirá. Solução: Código:

finalizado

Uma coisa que eu aprendi aqui é que da para criar primeiro os itens da lista e depois coloca-los dentro das listas usando o ctrl+shift+p (com o Wrap With abbreviation), e encapsulando todos o itens com o comando " li*"

To arorando as aulas

Bem que eu notara que a numeração das aulas estava descompassada! kkkkk Mas fiz o certo em não avançar só para descobrir o que deu errado. No entanto, eu tenho os exercícios antes de ver o vídeo, então eu fiz a numeração correta desde sempre. hahahahah Sobre as listas: eu me aventurando há anos com WordPress e tentando criar meus temas, jamais tinha dado a importância necessária às listas! Eu achava até estranho quando via estilos para listas em CSS e ficava me perguntando "ué?!" kkkkkkk

não sei onde ele consegue explicar melhor, se é nesse videos ou no material em pdf

Fala Guanabara de começo quero agradecer muito por sua dedicação em proporcionar um material tão valioso e rico em informações, meu nome é Martim estou falando pela conta da minha esposa. Tenho uma observação sobre o material PDF desta aula nos exercícios, pergunta número (4. Segundo as ... é a única que possui fechamento "opcional"? ) Acho que passou batido, mas deveria ser "fechamento obrigatório"

😎👏

Aula passa mto rápido. To acompanhando com meu caderninho.

to penando pra conseguir fazer um menu retratil ahaha.. um dia eu consigo!!

Caramba! Ele se desculpou humildemente de um "erro" comum desses. Nem precisava se desculpar não!

Estou estudando HTML, CSS e Java script, sei o básico de python mas infelizmente não posso exercitar kkkkkkk não tenho notebook ou coisa parecida, por enquanto só aprender a teoria está otimo

A tecla de atalho pra renomear arquivos e pastas 📁 no Windows é a F2

Essa é a ultima aula que está no site do Curso em Vídeo, porém aqui no canal tem umas 5 a mais. Alguém sabe qual é o "delay" entre uma aula sair no RU-vid e sair no site?

no PDF9, exercício 4. reveja a resposta correta. estamos com 3 alternativas que tem fechamento opcional.

Estou fazendo o curso em 2023 e o parâmetro Type dentro da ul não está funcionando. Será que não é mais usado?