Sou uma aluna quieta... não falo , só presto atenção. Gostaria de aparecer agora e te agradecer e pedir pelo amor de Deus pra continuar seguindo com este curso.
Basicamente temos quatro tipos de Alinhamento de Texto: - Alinhamento à esquerda - Alinhamento à direita - Centralizado - Justify Os textos no HTML (p, h1, h2 e etc.) já vem por padrão alinhados à esquerda da tela, mas se quisermos mudar esse alinhamento, devemos usar a Propriedade de Estilo "text-align", os valores mais comuns dessa propriedade são: center, right, left e justify O valor "center" alinha o texto no centro da tela, o valor "right" alinha o texto na parte direita da tela, o valor "left" alinha o texto na parte esquerda da tela... Sendo que o texto de PARÁGRAFOS normalmente tem um alinhamento nos DOIS LADOS, à esquerda e à direita... que é a função fundamental do valor "justify". Existe uma Propriedade de Estilo chamada "text-indent", que é responsável por dar aquele recuo no início de um parágrafo: Geralmente colocamos o valor dessa propriedade como "30px" de recuo.
É esse tipo de comentário informativo que eu adoro ler, essa aula apesar de curta, ajudou em algo que vamos usar e muito quando estivermos produzindo nossos próprios sites.
Professor, o "Lorem" do VSCode pode ser usado como "Lorem(n)", onde n representa o número de palavras desejadas. Lorem133 + Enter, digitaria 133 palavras. Tags com múltiplas classes podem ser criadas, tendo cada classe separada por um ponto. Ex.: div.sidebar.secondary + Enter = . De mesmo modo, id com cerquilhas (#). Ficam as dicas, grande abraço.
Suas aulas são espetaculares! Você sabe despertar em qualquer aluno a incessante sede de conhecimento. Parabéns pela didática! Eu adoraria que elaborasse um curso de Android (Java ou Kotlin). Obrigado pelos cursos, Guanabara! Você é incrível!
Sinto muito orgulho por dizer que estou aprendendo no CursoemVideo. Com muito estudo e foco espero me tornar um bom profissional na área de desenvolvimento e programação. E quando Eu chegar lá poderei dizer, com muito orgulho, que aprendi tudo com o Professor Guanabara e o CursoemVideo. Obrigado Gustavo Guanabara, continue sendo esse professor BADASS que você é, espero muito te conhecer um dia. 💗
Boa tarde estou fazendo curso na plataforma do cursos em video queria ser um apoiador mas não tenho cartão e nem conta no PayPal se tiver a opção boleto por exemplo ou deposito bancario sei la aldo do tipo ficaria muito contente de ser um apoiador pois tenho recomendado pois você e sua equipe muito boa so tenho a agradece estou querendo fazer o estudonauta também desde ja muito obrigado
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.
Professor, tenho uma dúvida com entre entender a diferença de text-align e text-aline-last ( o visual studio code fica sugerindo o uso do text-align-last) não consegui perceber diferença, mas acredito haver, se tem, seria qual ?
E quando é que lançam mais aulas do módulo 2 do curso de HTML5 CSS3 na plataforma do curso em vídeo? Lançar na plataforma do curso em vídeo, 3 aulas de 4 em 4 semanas é muito pouco para quem é apoiador e lhes foi prometido acesso antecipado ao modulo 2 do curso. Na plataforma do youtube este curso desenrola-se com mais rapidez e frequência. Gustavo Guanabara eu aprecio muito os seus cursos e tenho a certeza que esta critica não se destina a si, que acredito não será o responsável pelo lançamento de novas aulas pois como você disse no inicio do curso, já estão prontas e gravadas todas as aulas do referido curso. Cumprimentos, obrigado e desculpe o meu desabafo Guanabara.
📝 *VALE LEMBRAR:* * text-align: - center - end - justify - left - right - start * Alinhamento padrão: left * Tag obsoleta: * text-indent: -> tamanho de recuo do parágrafo
O Wix é uma ótima ferramenta para quem quer montar um site simples para divulgar alguma coisa ou colocar alguma informação básica de um negócio por exemplo, até acho válido sim, mas é muito limitado.
ola! tudo bem? estou tendo dificuldade para ajustar a palavra dentro da celula ...na tabela que eu estou fazendo algumas palavras se separam sozinha pois a celula é muito pequena ... teria como a celua se ajustar automaticamente de acordo com o tamanho das palavras ? ex do que esta acontecendo "diametr o"
procura 3 listras horizontais no vs code, vai em arquivo, preferências, configurações, digita word wrap e deixa em "on". Se não for isso então, provavelmente pra fazer com que uma célula de tabela se ajuste automaticamente ao tamanho do conteúdo, você usa a propriedade CSS table-layout com o valor auto. Isso fará com que a largura da célula seja determinada pelo conteúdo dentro dela. Além disso, você pode definir a propriedade word-break como break-all para permitir que as palavras sejam quebradas em várias linhas, evitando que elas sejam separadas automaticamente. Aqui está um exemplo de como você pode aplicar essas propriedades: html Copy code table { width: 100%; /* Define a largura da tabela */ table-layout: auto; /* Ajusta a largura da célula automaticamente */ border-collapse: collapse; } td { border: 1px solid #000; /* Adicione bordas para visualização */ word-break: break-all; /* Permite que as palavras sejam quebradas em várias linhas */ } Lorem ipsum dolor sit amet consectetur adipisicing elit. Earum, iure optio explicabo cumque quisquam nihil asperiores sit quaerat, eum unde iste. Id similique quia fuga vitae. Suscipit unde nesciunt porro. Lorem ipsum dolor sit amet consectetur adipisicing elit. Earum, iure optio explicabo cumque quisquam nihil asperiores sit quaerat, eum unde iste. Id similique quia fuga vitae. Suscipit unde nesciunt porro. Neste exemplo, a tabela se ajustará automaticamente ao tamanho do conteúdo da célula, e a propriedade word-break: break-all; garantirá que as palavras sejam quebradas em várias linhas, se necessário, para evitar que sejam separadas automaticamente. Isso deve resolver o problema que você está enfrentando.
Para centralizar uma imagem horizontalmente no contexto de um elemento HTML, você pode usar CSS. Existem várias maneiras de fazer isso, mas duas das abordagens mais comuns são as seguintes: Usando text-align: center (para imagens em elementos inline ou inline-block): Se a imagem estiver dentro de um elemento inline ou inline-block (como um parágrafo ou uma div sem uma largura definida), você pode centralizá-la horizontalmente definindo o text-align do elemento pai como center. Por exemplo: html Copy code Isso centralizará a imagem horizontalmente dentro do elemento pai. Usando margin: 0 auto; (para imagens em elementos de bloco): Se a imagem estiver dentro de um elemento de bloco (como uma div com uma largura definida), você pode centralizá-la horizontalmente definindo as margens esquerda e direita como "auto". Por exemplo: html Copy code Isso centralizará a imagem horizontalmente dentro do elemento de bloco, desde que o elemento de bloco tenha uma largura definida. Lembre-se de que, em uma abordagem mais moderna, você geralmente define estilos em um arquivo CSS externo em vez de usar estilos inline como nos exemplos acima. Isso mantém o seu HTML mais limpo e facilita a manutenção do código. Então, dependendo do seu caso específico, escolha a abordagem que se adequa melhor à estrutura do seu documento HTML e ao layout desejado.@@briansantos9803
Muitos deram uma parada no Curso, como eu. Só entro para ver os Comentários, mas só vou continuar esse Curso depois de ter um bom número de aulas já lançada na plataforma e aqui on Canal. O ritmo é muito lento, enquanto isso vou fazendo outro Curso como JavaScript no Canal.
o maior problema é a enrolação desse curso, 5 meses de curso e não mostrou nada praticamente, é tanta coisa que poderia ser falada em 2min e o Guanabara perde 15min falando sobre, isso desanima muuuuuito.
@@PedroHenrique9 Sim. E principalmente os Cursos demorados, ele demora lançar as aulas e quando lança é aulas de 12 minutos só para falar de uma ou duas tags...
Pessoal, eu tenho uma dúvida, se alguém mais experiente puder me ajudar, agradeço. Mesmo após aprender todos esses recursos e ser capaz de elaborar o nosso próprio site com qualidade. Mesmo assim ainda é mais interessante utilizar o wordpress? eu percebi que o site do curso em video é feito em wordpress. Eu na minha ingenuidade achei que pelo Guanabara ser faixa preta em desenvolvimento web ela não usaria wordpress no seu próprio site.
Olá, Luis. Wordpress tem suas vantagens e muitos devs gostam de trabalhar lá. creio que os custos com hospedagens etc sejam menores também. Mas depende de que tipo de site vc vai fazer.
Se você deseja centralizar uma única palavra na página toda, você pode usar um elemento HTML, como um parágrafo () ou um cabeçalho (, , etc.), e então aplicar estilos CSS para centralizá-lo horizontalmente e verticalmente. Aqui está um exemplo de como fazer isso: Centralizar Palavra /* Estilos para centralizar o conteúdo na página */ html, body { height: 100%; margin: 0; display: flex; justify-content: center; align-items: center; } Sua Palavra Neste exemplo, aplicamos estilos CSS para o elemento html e body para centralizar todo o conteúdo na página. O display: flex; com justify-content: center; e align-items: center; garante que o conteúdo seja centralizado tanto horizontalmente quanto verticalmente na página. Substitua "Sua Palavra" pelo texto que você deseja centralizar na página. Isso fará com que essa palavra seja exibida centralizada na página inteira.
Eu tento não adicionar o estilo no shorthand da fonte igual ao professor mas não da certo, meio que ele me obriga a declarar o estilo. Alguém sabe o porque ?
O shorthand em CSS para fontes requer propriedades obrigatórias, como tamanho da fonte e família da fonte. Se você omitir essas propriedades, o shorthand não funcionará corretamente. Certifique-se de incluir todas as propriedades necessárias para que o shorthand funcione corretamente. Você pode adicionar propriedades adicionais, como estilo da fonte, peso da fonte e altura da linha, conforme necessário. Certifique-se de seguir a sintaxe correta e verificar erros de digitação ou formatação em seu código CSS.
Para criar shorthand CSS corretamente, siga este formato: font: [estilo] [peso] [tamanho]/[altura da linha] [família da fonte], [fallback]; Aqui está uma explicação de cada parte: Estilo da Fonte (opcional): Pode ser italic, normal ou oblique. Indica o estilo da fonte, como itálico. Peso da Fonte (opcional): Pode ser normal, bold, bolder, lighter ou um valor numérico como 400 ou 700. Define o peso da fonte, como negrito. Tamanho da Fonte (obrigatório): Deve ser especificado, geralmente em pixels (px), em unidades de medida (em, rem, %) ou outras unidades de tamanho. Define o tamanho da fonte. Altura da Linha (opcional): Pode ser especificada após o tamanho da fonte com uma barra /. Define a altura da linha, que controla o espaço entre as linhas de texto. Por exemplo, 1.5 significa 1,5 vezes o tamanho da fonte atual. Família da Fonte (obrigatório): Deve ser especificada, geralmente como uma lista de nomes de fontes separados por vírgulas. Define a família de fontes desejada. Por exemplo, Arial, sans-serif especifica a fonte Arial e, se indisponível, usa qualquer fonte sans-serif genérica. Fallback (opcional): Pode incluir uma ou mais fontes de fallback após a família da fonte principal, separadas por vírgulas. Isso é útil para garantir que o navegador escolha uma fonte disponível se a principal não estiver disponível. Por exemplo, font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;. Exemplo completo: font: italic bold 16px/1.5 Arial, sans-serif; Lembre-se de que, ao usar shorthand, é essencial seguir a ordem correta das propriedades e incluir as propriedades obrigatórias (tamanho da fonte e família da fonte). Isso ajudará a criar regras de estilo de fonte de maneira mais eficiente e concisa.
Não da pra discutir sobre as aulas, elas são muito boas e ainda são gratuitas, porém nesse atual ritmo, vai levar anos para aprender apenas o básico de html e css, foram pelo menos 8 aulas apenas sobre fontes. Não sei se vai ser abordado aqui, mas no dia que chegar em flexbox ou grid por exemplo que são features importantíssimas e muito mais complexas que fontes, vão ser quantas aulas sobre? 20? 30? Não me leve a mal Guanabara, mas esse ritmo e o tempo gasto num mesmo assunto desanima qualquer um que queira aprender. E ainda tem as reclamações da galera que se tornou apoiador que não estão recebendo as aulas, e nenhum pronunciamento seu sobre isso, vacilo. Enfim, Abraços.
O curso alem de gratuito é muito bom, então não podemos exigir nada dele, mas concordo contigo. O curso de python demorou 3 anos e mais de 120 videos para demonstrar coisas basicas, agora imagina a galera que durante esses 3 anos teve que ficar esperando de uma em uma semana para ter videos novos. Grande parte da galera que tava acompanhado deixou de acompanhar pela demora dos videos, indo para outros canais, ou até mesmo esquecendo a programação.
Oq to fazendo é pegando esse básicão aqui e depois ver aqueles cursos full q uns gringos disponibilizam. Tipo uma revisão plus coisas q ele n passou. Já que aqui ainda havera + 3 modulos
Irmão, eu não sei se você percebeu mas esse curso além de ser gratuito pra nós ainda esta sendo custeado por ele (grande parte ou uma boa parcela). Então ele que faz as artes do pdf, trabalha com roteiros, com o material, seleciona fontes de conteúdo, etc (não preciso falar tudo). Isso faz com que seja um processo longo e demorado, quando o curso é 100% patrocinado as coisas saem rápido, assim como foi no de JavaScript (saiu o módulo inteiro em 1 dia). Então acredito que pedir/reclamar que as coisas andem mais rápido não vai ajudar em nada, o que a gente pode fazer é ter paciência e gratidão pelo trabalho feito ou patrocinar o curso em video caso você queira que saia rápido.
se as aulas fossem longas, até que era bom. Ainda nem terminei esse modulo, mas nem me imagino ficar esperando as aulas serem lançadas e quando ver, só ter 12 minutos
Se você está tendo problemas para alinhar não apenas o texto, mas também os números ou símbolos em uma lista, é importante saber que o alinhamento de listas em HTML e CSS pode variar dependendo do tipo de lista que você está usando (por exemplo, uma lista ordenada ou uma lista não ordenada ). Aqui estão algumas dicas para alinhar corretamente o conteúdo de listas: Listas Ordenadas : Se você está usando uma lista ordenada, como uma lista numerada, e deseja alinhar os números junto com o texto, pode aplicar estilos CSS para controlar o recuo e o alinhamento do conteúdo da lista. Você pode usar a propriedade list-style-position: inside; para alinhar os números ou símbolos à esquerda com o texto. Veja um exemplo: ol { list-style-position: inside; } Listas Não Ordenadas : Se você está usando uma lista não ordenada e deseja alinhar os símbolos (geralmente pontos ou outro símbolo) à esquerda com o texto, você pode aplicar um estilo semelhante. Use a propriedade list-style-position: inside; na lista não ordenada () para alinhar os símbolos com o texto. ul { list-style-position: inside; } Estilizando Listas Individualmente: Se você deseja aplicar o estilo apenas a listas específicas, você pode atribuir uma classe à lista e, em seguida, aplicar estilos CSS personalizados. Por exemplo: HTML: html Copy code Item 1 Item 2 Item 3 CSS: .minha-lista { list-style-position: inside; } Certifique-se de que seus estilos CSS estejam sendo aplicados corretamente ao elemento da lista que você deseja alinhar. Isso deve ajudar a alinhar o conteúdo da lista da maneira desejada, incluindo os números ou símbolos.
Se você deseja incluir uma menção breve centralizada após os três parágrafos justificados, você pode fazer isso com HTML e CSS. Aqui está um exemplo de como fazer isso: Texto Centralizado /* Estilos para centralizar o conteúdo */ html, body { height: 100%; margin: 0; display: flex; flex-direction: column; justify-content: space-between; } /* Estilos para os parágrafos justificados */ .paragrafos { text-align: justify; padding: 0 20px; } /* Estilos para a menção centralizada */ .mencao { text-align: center; margin-bottom: 20px; } Parágrafo 1. Lorem ipsum dolor sit amet... Parágrafo 2. consectetur adipiscing elit... Parágrafo 3. Vivamus ac justo in metus... Obrigado. Até mais! Neste exemplo, usamos CSS para centralizar o conteúdo da página verticalmente usando display: flex; e justify-content: space-between;. Os parágrafos estão alinhados justificados e têm algum espaço à esquerda e à direita para melhor legibilidade. A menção "Obrigado. Até mais!" é centralizada verticalmente usando text-align: center; e tem uma margem inferior para espaçamento. Você pode ajustar os estilos e conteúdo de acordo com suas necessidades específicas. Este exemplo demonstra como centralizar uma menção breve após três parágrafos justificados.