Namoral mesmo, esse Guanabara é muito FODA! Eu sou burro pra caralho pq tenho TDAH, aprendo muito devagar e tenho facilidade em desistir. Até agora não desisti e estou aprendendo TUDO! Eu to espantado comigo. kkkk Esse professor é muito bom.
Uma coisa legal que dá para fazer quando você cria um id é poder criar uma âncora na página que ao clicar te leva direto ao id específico, exemplo: colocar no final da página um Clique para voltar ao início
Tbm dá pra usar isso pra fazer tipo um índice no começo da página. Quando tem muito conteúdo às vezes as pessoas não têm paciência de ler até encontrar o que querem, colocar essas âncoras no começo pra direcionar pra cada tópico eu acho bacana.
No CSS, sempre que fazemos uma configuração de estilo para um elemento do HTML em um seletor, como por exemplo um h1, todas as unidades desse elemento ficam igualmente marcadas com essa configuração de estilo... Às vezes, de forma específica, iremos precisar personalizar apenas UMA UNIDADE de um elemento, sem alterar o estilo das demais unidades desse mesmo elemento no HTML (uma unidade de h1 por exemplo). Para fazer isso, temos que aprender a utilizar os comandos de id (#) e de class (.) de maneira eficiente. Para usar o id, dentro no código HTML, devemos dar uma identificação para a tag específica do HTML que queremos personalizar, essa identificação é feita dentro da tag HTML com o comando "id". Exemplo: " Criando Sites com HTML e CSS " Após inserir o comando "id" dentro da tag, é preciso dar um nome (de sua preferência) para essa identificação. Feita a configuração, isso vai diferenciar essa unidade (com id) de todos os seus iguais (mesmo elemento). Com isso iremos conseguir personalizar configurações de estilo para determinadas unidades específicas, sem alterar os seus iguais. Agora, para configurar especificamente o estilo desse id que denominamos como "principal" no exemplo, devemos ir até o nosso código CSS e abrir um seletor personalizado para esse id que criamos. Esse seletor deve possuir o nome do elemento a que a unidade marcada pertence e o identificador "#principal" (# + nome do id), ficaria assim: h1#principal { } Dessa forma, toda configuração que fizermos dentro desse seletor personalizado, será válida somente para a tag que tem o respectivo identificador id. Observação: Não precisamos necessariamente escrever o nome do elemento a que a unidade marcada pertence (h1 no caso do exemplo) antes da "#", ficando somente como "#principal"... Isso faria com que conseguíssemos colocar qualquer tag que quiséssemos como esse id "#principal", podendo alterar o estilo de várias unidades de elementos de forma personalizada... mas é recomendado fazer do jeito do exemplo, com o nome do elemento na frente, já que só permitido usar somente um id e o seu respectivo nome por documento HTML. O uso de "class" que é o indicado para a alteração personalizada do estilo de VÁRIAS unidades específicas. Uma " # " no CSS identifica um " id " no HTML. Em HTML é " id " = Em CSS é " # " Já um " . " no CSS identifica uma " class " no HTML. Em HTML é " class " = Em CSS é " . " Nota: Uma coisa legal que dá para fazer quando você cria um id, é poder criar uma âncora na página que ao clicar te leva direto ao id específico. Exemplo: Colocar no final da página um Clique para voltar ao início Também dá pra usar isso para fazer um índice no começo da página. Quando tem muito conteúdo às vezes as pessoas não têm paciência de ler até encontrar o que querem, colocar essas âncoras no começo para direcionar pra cada tópico é bacana.
Prof. Guanabara, muito bom esse sistema de separação de conteudo, torna mais facil a localização para tassistir novamente. Estou conseguindo fazer o curso apesar de algumas dificuldades pois sou deficiente visual, mas estou conseguindo driblaras dificuldades. Parabens pelo conteudo que disponibilizou para nós, e miito obrigado.
Sou um aluno introspectivo... Mas presto bastante atenção. Estou comentando agora porque minha gratidão por ti, Gustavo, e pela sua equipe é imensa. Obrigado por existir, meu professor!!
📝 *REVISÃO DO TIO GUANABARA* *No arquivo .html:* Criando Sites com HTML e CSS *No arquivo .css:* h1#principal { text-align: center; background-color: rgb(4, 109, 0); color: white; } - Obs: o *h1* antes de# é opcional -> #principal *id* em HTML = *#* em CSS *class* em HTML = *.* em CSS
Cara esse professor e o melhor, venho aqui só pra comentar queria muito começa a aprender com ele mais ainda não tenho nenhum PC mais já assisti alguns vídeos dele e são os melhores que eu já vir.
Quero compartilhar algo que tem me ajudado muito ao acompanhar o excelente conteúdo do professor Guanabara. Sempre que surge uma dúvida pesquiso em fontes externas. E tenho recorrido frequentemente ao ChatGPT. É impressionante como tenho conseguido aprender muito com as explicações complementares que ele retorna. Se alguém também já experimentou dê seu feedback sobre o resultado.
Guanabaraaaaaa, Meu querido!!! O curso ta lindo demais, obrigado!!!! não sabia nada de html5 e nem de css com seu curso sair do zero em relação a esses conhecimentos, obrigado MESTREEEEEEEEEEEEEEEEEEE
Uma dica pra quem está usando VSC, você pode usar o seguinte atalho para criar id. Primeiro inseri o caractere da tag que deseja(vou usar o parágrafo como exemplo) seguido da # e o nome do id que deseja, ficando assim: p#primeiro_paragrafo Então é apertar tab e a tag será criada com a classe="primeiro-paragrafo", pode ser usado para classes também, só alterar o # por .
Pode parecer bobeira dividir bem os assuntos dos vídeos, mas eu fiz diversos cursos neste canal e sempre esqueço algo, então novamente lhe agradeço muito guanabara
Detalhe: Como ele explicou o h1 antes da #principal é opcional... Mas caso não coloque, mudará a css de todos os locais que estão identificados com o id="principal" na html.
Gostei bastante do vídeo, o curso está ótimo. Seria legal se você voltasse a nos chamar de gafanhotos. E sinto saudades do Guanacast, podia voltar a fazer.
*Uma dúvida* : Segundo o material em PDF, "Em um mesmo documento HTML, só podemos usar um id para um único elemento, o que significa que não podemos ter dois elementos com um mesmo id dentro de uma mesma página. [...]" Sabendo disso, não é uma redundância lógica escrever h1#principal, por exemplo? Afinal, teoricamente #principal só pode ser utilizado em uma tag , certo?
Eu fiquei com essa mesma dúvida quando ele falou no vídeo. Porém acredito que ele prefira escrever com o h1 na frente pois ele pode ter um outro id "principal" num segundo documento html de um mesmo site que esteja fazendo. Por exemplo, nesse segundo doc ele pode ter botado tmb o id "principal" numa e estar usando o mesmo arquivo CSS para os dois html, porém querer estilos diferentes para essa div com id "principal". Provavelmente a essa altura vc já deve saber disso, porém escrever aqui agora nesse momento me ajudou a esclarecer essa minha questão.
Uso de IDs únicos: Conforme a especificação HTML, o atributo "id" deve ser único em um documento HTML. Isso significa que você não pode ter dois elementos com o mesmo "id" dentro da mesma página. Portanto, é uma redundância lógica usar um seletor CSS que combina um elemento específico com um ID específico, como h1#principal, porque o ID já deve ser único. No entanto, essa redundância não afetará o funcionamento do seu código. Nomeclatura de IDs: Quando você dá um nome ao seu ID, é uma boa prática escolher nomes que sejam descritivos do conteúdo ou do propósito desse elemento na página. Isso torna o código mais legível e fácil de entender. No exemplo dado, usar #principal como ID é uma escolha válida, pois comunica claramente que este é um elemento principal da página. Reutilização de IDs: Às vezes, pode haver casos em que você deseja reutilizar um mesmo ID em diferentes páginas do mesmo site. Por exemplo, você pode ter um ID "principal" que se refere ao conteúdo principal em várias páginas. Nesse caso, pode ser útil definir um mesmo ID em diferentes páginas para estilizá-lo de forma consistente com CSS. No entanto, isso deve ser feito com cautela para evitar conflitos e confusões. Hierarquia e Especificidade: Usar um seletor CSS que combina um elemento com um ID, como h1#principal, pode ser útil quando você deseja aumentar a especificidade de uma regra de estilo. Isso pode ser necessário se você estiver lidando com regras de estilo conflitantes em seu CSS. No entanto, lembre-se de que, na maioria dos casos, especificar apenas o ID (#principal) é suficiente.
Guanabara eu tô começando o seu curso de python de 3 anos atrás Estou na 4 Capítulo e já estou gostando muito só que eu não entendi o conceito de váriaveis
Olá, também estou fazendo o curso de python. Imagina que depois do pertence: = o que você colocar vai ficar armazenado na memória do seu PC e antes do: = é o nome daquele espaço reservado na memória. Ficando por exemplo : nome da variável = algo na memória do seu PC
Por algum motivo as propriedades do meu body só funcionam quando eu coloco abaixo de h1. edit: Tinha esquecido o ponto e vírgula de @charset "UTF-8", após isso tudo funcionou normal.
irmão, eu não tô nesse nível de estudos ainda, mas sempre q eu tenho dúvidas, eu digito em sites de inteligência artificial, tem o chatgpt, tem o baard, tem o BING... eles são muito bons pra ensinar programação.
Saudações, eu gostaria de saber como é que o prof Guanabarra coloca acentos nas palavras sem usar o word? Peço ajuda , como nós aprendemos o word usa pt e nós usamos px.
Para adicionar acentos em palavras em HTML e CSS, você pode usar códigos de caracteres especiais ou entidades HTML. Isso é útil quando você está trabalhando diretamente com código e não está usando um processador de texto como o Microsoft Word, que oferece suporte nativo a acentos. Aqui estão alguns exemplos de como adicionar acentos a letras em HTML usando entidades HTML: Acento agudo: á: á é: é í: í ó: ó ú: ú Acento grave: à: à è: è ì: ì ò: ò ù: ù Circunflexo: â: â ê: ê î: î ô: ô û: û Você pode simplesmente incorporar essas entidades HTML em seu código HTML ou CSS para adicionar acentos às palavras. Exemplo em HTML: html Copy code A palavra café é escrita como café. Exemplo em CSS: h1::before { content: "A palavra café é importante."; } Lembre-se de que, ao usar o VS Code para escrever código HTML e CSS, você pode configurar a codificação do arquivo para UTF-8 para garantir que os caracteres acentuados sejam exibidos corretamente. Você pode fazer isso selecionando "File" (Arquivo) -> "Preferences" (Preferências) -> "Settings" (Configurações) e pesquisando por "files.encoding". Certifique-se de que a opção esteja definida como "utf8". Isso garantirá que os acentos sejam tratados corretamente ao salvar e visualizar seu código.
gente, eu sei que nao tem nada a ver com essa aula, mas eu to precisando de ajuda para por a '→' (setinha) no pycharm.... Já digitei alt 26, mas nada acontece. Eu preciso por alguma configuração ou algo do tipo ?? @curso em video
Para inserir o caractere '→' (seta) no PyCharm, você pode usar um método diferente, já que a combinação de teclas "Alt + 26" não funciona na maioria dos editores de código, incluindo o PyCharm. Aqui estão algumas maneiras de inserir uma seta no PyCharm: Usando códigos Unicode: Você pode usar o código Unicode da seta para inseri-la no seu código. O código Unicode para a seta direita é "\u2192". Para inseri-lo no PyCharm, siga estas etapas: No seu código, coloque o cursor onde você deseja inserir a seta. Digite \u2192. O PyCharm deve automaticamente converter isso em uma seta quando você pressionar a barra de espaço ou Enter. Usando o menu "Inserir Símbolo": Coloque o cursor onde deseja inserir a seta. No menu superior do PyCharm, vá em "Inserir" > "Símbolo". Na janela "Símbolo", você pode pesquisar por "seta" ou "right arrow" e selecionar a seta direita. Clique no botão "Inserir" para colocar a seta no seu código. Atalho de teclado personalizado: Se você planeja usar a seta com frequência, pode configurar um atalho de teclado personalizado para inseri-la mais rapidamente. Para fazer isso: Vá para "Arquivo" > "Configurações" (ou "PyCharm" > "Preferências" em um Mac). Na caixa de pesquisa, digite "Atalhos de Teclado". Expanda "Editor de Texto" e depois "Inserir Símbolo". Clique com o botão direito do mouse na opção "Inserir Símbolo" e escolha "Adicionar Atalho de Teclado". Defina um atalho de teclado que você deseja usar para inserir a seta. Clique em "OK" para salvar as configurações. Depois de configurar um atalho personalizado, você pode usá-lo sempre que precisar inserir a seta no seu código. Certifique-se de escolher um atalho que não entre em conflito com outras funcionalidades do PyCharm.
não sei pq mas o style externo do body não estava funcionado de jeito nenhum, tive que colocar direto na tag só assim foi, alguem sabe me dizer pq não estava funcionando?
Se o estilo definido em um arquivo CSS externo não estiver funcionando e você precisou aplicar o estilo diretamente na tag HTML () para que funcionasse, pode haver várias razões para isso. Aqui estão algumas possíveis causas: Erro no caminho do arquivo CSS: Certifique-se de que o caminho para o arquivo CSS externo esteja correto e que o arquivo CSS esteja localizado onde você especificou. Erros de caminho podem fazer com que o navegador não encontre o arquivo CSS. Erro de sintaxe no arquivo CSS: Um erro de sintaxe, como a ausência de um ponto e vírgula após uma regra CSS, pode fazer com que o navegador ignore todo o arquivo CSS. Verifique se o arquivo CSS não contém erros de sintaxe. Ordem de carregamento do CSS: Às vezes, a ordem em que os arquivos CSS são carregados pode afetar o resultado. Certifique-se de que o arquivo CSS externo seja carregado após qualquer outro arquivo CSS que possa estar sobrescrevendo as regras. Especificidade das regras CSS: Se outras regras CSS têm maior especificidade ou estão sendo aplicadas após o arquivo CSS externo, elas podem anular as regras no arquivo externo. Isso pode ocorrer, por exemplo, se você estiver usando estilos em cascata e as regras mais específicas estiverem vindo de outro lugar. Cache do navegador: Às vezes, o navegador pode armazenar em cache versões anteriores de arquivos CSS. Certifique-se de limpar o cache do navegador ou forçar a recarga da página para garantir que o navegador esteja usando a versão mais recente do arquivo CSS. Problemas no servidor: Se o servidor estiver configurado incorretamente, ele pode não estar servindo o arquivo CSS corretamente. Verifique as configurações do servidor para garantir que ele esteja configurado para servir arquivos CSS corretamente. Certifique-se de revisar esses pontos para identificar por que o arquivo CSS externo não estava funcionando. Se você acha que o problema estava relacionado à falta de ponto e vírgula no seu arquivo CSS, verifique a sintaxe do arquivo para corrigir quaisquer erros. Lembre-se de que o uso de um arquivo CSS externo é uma prática recomendada, pois facilita a manutenção e organização do código.
