From 623aaae717223e6b8d738e02893afb8d7ac78619 Mon Sep 17 00:00:00 2001 From: orpos <58054927+orpos@users.noreply.github.com> Date: Thu, 21 Sep 2023 22:37:30 -0300 Subject: [PATCH 01/12] Updates "Learn/CSS/Building_blocks/Selectors/Attribute_selectors" content --- .../selectors/attribute_selectors/index.md | 28 +++++++++---------- .../css/building_blocks/selectors/index.md | 2 +- .../type_class_and_id_selectors/index.md | 2 +- 3 files changed, 16 insertions(+), 16 deletions(-) diff --git a/files/pt-br/learn/css/building_blocks/selectors/attribute_selectors/index.md b/files/pt-br/learn/css/building_blocks/selectors/attribute_selectors/index.md index 80f9a93278325e..f349e264a2ada7 100644 --- a/files/pt-br/learn/css/building_blocks/selectors/attribute_selectors/index.md +++ b/files/pt-br/learn/css/building_blocks/selectors/attribute_selectors/index.md @@ -1,5 +1,5 @@ --- -title: Attribute selectors +title: Seletores de atributo slug: Learn/CSS/Building_blocks/Selectors/Attribute_selectors --- @@ -10,26 +10,26 @@ Como você sabe de seu estudo de HTML, os elementos podem ter atributos que forn - + - - + +
Prerequisites:Pré-requisitos: - Basic computer literacy, + Conhecimentos básicos em informática, basic software installed, basic knowledge of + >software básico instalado, conhecimentos básicos de working with files, HTML basics (study + >trabalhando com arquivos, Basico de HTML (Estude Introduction to HTML), and an idea of how CSS works (study - CSS first steps.) + >Introdução para o HTML), e uma ideia de como CSS funciona (Estude + CSS primeiros paços.)
Objective:To learn what attribute selectors are and how to use them.Objetivo:Entender o que são seletores de atributo e como usa-los.
@@ -57,7 +57,7 @@ No exemplo abaixo você pode ver esses seletores sendo usados. Esses seletores permitem uma correspondência mais avançada de substrings dentro do valor do seu atributo. Por exemplo, se você tivesse classes de `box-warning` e `box-error` e quisesse combinar tudo que começou com a string "box-", você poderia usar `[class^="box-"]` para selecionar os dois (ou `[class|="box"]` como descrito abaixo). -| Selector | Example | Description | +| Selector | Exemplo | Descrição | | --------------- | ------------------- | ---------------------------------------------------------------------------------------------------------------- | | `[attr^=value]` | `li[class^="box-"]` | Corresponde a elementos com um atributo attr (cujo nome é o valor entre colchetes), cujo valor começa com valor. | | `[attr$=value]` | `li[class$="-box"]` | Corresponde a elementos com um atributo attr cujo valor termina com valor. | @@ -73,7 +73,7 @@ O próximo exemplo mostra o uso desses seletores: {{EmbedGHLiveSample("css-examples/learn/selectors/attribute-substring.html", '100%', 800)}} -## Case-sensitivity +## Sensibilidade a maiúsculas Se você deseja combinar valores de atributo sem distinção entre maiúsculas e minúsculas, você pode usar o valor i antes do colchete de fechamento. Este sinalizador informa ao navegador para corresponder caracteres ASCII sem distinção entre maiúsculas e minúsculas. Sem o sinalizador, os valores serão correspondidos de acordo com a distinção entre maiúsculas e minúsculas do idioma do documento - no caso do HTML, será sensível a maiúsculas e minúsculas. diff --git a/files/pt-br/learn/css/building_blocks/selectors/index.md b/files/pt-br/learn/css/building_blocks/selectors/index.md index e43c7368021849..d4e0fa7e02f423 100644 --- a/files/pt-br/learn/css/building_blocks/selectors/index.md +++ b/files/pt-br/learn/css/building_blocks/selectors/index.md @@ -186,7 +186,7 @@ Você pode dar uma olhada na tabela de referência de seletores abaixo para obte A tabela a seguir fornece uma visão geral dos seletores disponíveis para uso, juntamente com links para as páginas deste guia que mostram como usar cada tipo de seletor. Também incluí um link para a página MDN de cada seletor, onde você pode verificar as informações de suporte do navegador. Você pode usar isso como uma referência para voltar quando precisar consultar os seletores mais tarde no material, ou quando você experimentar CSS em geral. -| Selector | Example | Learn CSS tutorial | +| Seletor | Exemplo | Tutorial CSS | | ------------------------------------------------------------------------------ | ------------------- | ------------------------------------------------------------------------------------------------------------------------------ | | [Type selector](/pt-BR/docs/Web/CSS/Type_selectors) | `h1 { }` | [Type selectors](/pt-BR/docs/Learn/CSS/Building_blocks/Selectors/Type_Class_and_ID_Selectors#Type_selectors) | | [Universal selector](/pt-BR/docs/Web/CSS/Universal_selectors) | `* { }` | [The universal selector](/pt-BR/docs/Learn/CSS/Building_blocks/Selectors/Type_Class_and_ID_Selectors#The_universal_selector) | diff --git a/files/pt-br/learn/css/building_blocks/selectors/type_class_and_id_selectors/index.md b/files/pt-br/learn/css/building_blocks/selectors/type_class_and_id_selectors/index.md index ca58f881f5f04f..7271fadd32e927 100644 --- a/files/pt-br/learn/css/building_blocks/selectors/type_class_and_id_selectors/index.md +++ b/files/pt-br/learn/css/building_blocks/selectors/type_class_and_id_selectors/index.md @@ -10,7 +10,7 @@ Nesta lição, vamos analisar alguns dos seletores simples, o qual provavelmente - +
Pré-requistos:Pré-requisitos: Familiaridade básica com uso de computadores, Date: Thu, 21 Sep 2023 22:43:23 -0300 Subject: [PATCH 02/12] Update files/pt-br/learn/css/building_blocks/selectors/attribute_selectors/index.md Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com> --- .../css/building_blocks/selectors/attribute_selectors/index.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/files/pt-br/learn/css/building_blocks/selectors/attribute_selectors/index.md b/files/pt-br/learn/css/building_blocks/selectors/attribute_selectors/index.md index f349e264a2ada7..fe2345d53ebf52 100644 --- a/files/pt-br/learn/css/building_blocks/selectors/attribute_selectors/index.md +++ b/files/pt-br/learn/css/building_blocks/selectors/attribute_selectors/index.md @@ -16,7 +16,7 @@ Como você sabe de seu estudo de HTML, os elementos podem ter atributos que forn software básico instalado, conhecimentos básicos de + >, conhecimentos básicos de trabalhando com arquivos Date: Thu, 21 Sep 2023 22:44:00 -0300 Subject: [PATCH 03/12] Update files/pt-br/learn/css/building_blocks/selectors/attribute_selectors/index.md Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com> --- .../css/building_blocks/selectors/attribute_selectors/index.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/files/pt-br/learn/css/building_blocks/selectors/attribute_selectors/index.md b/files/pt-br/learn/css/building_blocks/selectors/attribute_selectors/index.md index fe2345d53ebf52..318465a8120aa0 100644 --- a/files/pt-br/learn/css/building_blocks/selectors/attribute_selectors/index.md +++ b/files/pt-br/learn/css/building_blocks/selectors/attribute_selectors/index.md @@ -57,7 +57,7 @@ No exemplo abaixo você pode ver esses seletores sendo usados. Esses seletores permitem uma correspondência mais avançada de substrings dentro do valor do seu atributo. Por exemplo, se você tivesse classes de `box-warning` e `box-error` e quisesse combinar tudo que começou com a string "box-", você poderia usar `[class^="box-"]` para selecionar os dois (ou `[class|="box"]` como descrito abaixo). -| Selector | Exemplo | Descrição | +| Selector | Exemplo | Descrição | | --------------- | ------------------- | ---------------------------------------------------------------------------------------------------------------- | | `[attr^=value]` | `li[class^="box-"]` | Corresponde a elementos com um atributo attr (cujo nome é o valor entre colchetes), cujo valor começa com valor. | | `[attr$=value]` | `li[class$="-box"]` | Corresponde a elementos com um atributo attr cujo valor termina com valor. | From d0d8c7bf97120650545c3075e65e5fb6ad7167be Mon Sep 17 00:00:00 2001 From: orpos <58054927+orpos@users.noreply.github.com> Date: Thu, 21 Sep 2023 22:44:23 -0300 Subject: [PATCH 04/12] Update files/pt-br/learn/css/building_blocks/selectors/index.md Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com> --- files/pt-br/learn/css/building_blocks/selectors/index.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/files/pt-br/learn/css/building_blocks/selectors/index.md b/files/pt-br/learn/css/building_blocks/selectors/index.md index d4e0fa7e02f423..9722de740ab10f 100644 --- a/files/pt-br/learn/css/building_blocks/selectors/index.md +++ b/files/pt-br/learn/css/building_blocks/selectors/index.md @@ -186,7 +186,7 @@ Você pode dar uma olhada na tabela de referência de seletores abaixo para obte A tabela a seguir fornece uma visão geral dos seletores disponíveis para uso, juntamente com links para as páginas deste guia que mostram como usar cada tipo de seletor. Também incluí um link para a página MDN de cada seletor, onde você pode verificar as informações de suporte do navegador. Você pode usar isso como uma referência para voltar quando precisar consultar os seletores mais tarde no material, ou quando você experimentar CSS em geral. -| Seletor | Exemplo | Tutorial CSS | +| Seletor | Exemplo | Tutorial CSS | | ------------------------------------------------------------------------------ | ------------------- | ------------------------------------------------------------------------------------------------------------------------------ | | [Type selector](/pt-BR/docs/Web/CSS/Type_selectors) | `h1 { }` | [Type selectors](/pt-BR/docs/Learn/CSS/Building_blocks/Selectors/Type_Class_and_ID_Selectors#Type_selectors) | | [Universal selector](/pt-BR/docs/Web/CSS/Universal_selectors) | `* { }` | [The universal selector](/pt-BR/docs/Learn/CSS/Building_blocks/Selectors/Type_Class_and_ID_Selectors#The_universal_selector) | From f6cf110034239ec3dfb08928c18e3df4846f7372 Mon Sep 17 00:00:00 2001 From: orpos <58054927+orpos@users.noreply.github.com> Date: Thu, 21 Sep 2023 22:54:03 -0300 Subject: [PATCH 05/12] updates selector text --- .../building_blocks/selectors/attribute_selectors/index.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/files/pt-br/learn/css/building_blocks/selectors/attribute_selectors/index.md b/files/pt-br/learn/css/building_blocks/selectors/attribute_selectors/index.md index 318465a8120aa0..1d7b38a202372f 100644 --- a/files/pt-br/learn/css/building_blocks/selectors/attribute_selectors/index.md +++ b/files/pt-br/learn/css/building_blocks/selectors/attribute_selectors/index.md @@ -38,7 +38,7 @@ Como você sabe de seu estudo de HTML, os elementos podem ter atributos que forn Esses seletores permitem a seleção de um elemento com base na presença de um atributo sozinho (por exemplo, href) ou em várias correspondências diferentes com o valor do atributo. -| Selector | Example | Description | +| Seletor | Example | Description | | ---------------- | ------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------- | | `[attr]` | `a[title]` | Corresponde a elementos com um atributo attr (cujo nome é o valor entre colchetes). | | `[attr=value]` | `a[href="https://example.com"]` | Corresponde a elementos com um atributo attr cujo valor é exatamente value - a string entre aspas. | @@ -57,7 +57,7 @@ No exemplo abaixo você pode ver esses seletores sendo usados. Esses seletores permitem uma correspondência mais avançada de substrings dentro do valor do seu atributo. Por exemplo, se você tivesse classes de `box-warning` e `box-error` e quisesse combinar tudo que começou com a string "box-", você poderia usar `[class^="box-"]` para selecionar os dois (ou `[class|="box"]` como descrito abaixo). -| Selector | Exemplo | Descrição | +| Seletor | Exemplo | Descrição | | --------------- | ------------------- | ---------------------------------------------------------------------------------------------------------------- | | `[attr^=value]` | `li[class^="box-"]` | Corresponde a elementos com um atributo attr (cujo nome é o valor entre colchetes), cujo valor começa com valor. | | `[attr$=value]` | `li[class$="-box"]` | Corresponde a elementos com um atributo attr cujo valor termina com valor. | From 3767290635a38e8385a5b4f67738271ccaffe3c3 Mon Sep 17 00:00:00 2001 From: orpos <58054927+orpos@users.noreply.github.com> Date: Fri, 22 Sep 2023 18:48:36 -0300 Subject: [PATCH 06/12] Update files/pt-br/learn/css/building_blocks/selectors/attribute_selectors/index.md Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com> --- .../css/building_blocks/selectors/attribute_selectors/index.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/files/pt-br/learn/css/building_blocks/selectors/attribute_selectors/index.md b/files/pt-br/learn/css/building_blocks/selectors/attribute_selectors/index.md index 1d7b38a202372f..73bdfaba5d7922 100644 --- a/files/pt-br/learn/css/building_blocks/selectors/attribute_selectors/index.md +++ b/files/pt-br/learn/css/building_blocks/selectors/attribute_selectors/index.md @@ -57,7 +57,7 @@ No exemplo abaixo você pode ver esses seletores sendo usados. Esses seletores permitem uma correspondência mais avançada de substrings dentro do valor do seu atributo. Por exemplo, se você tivesse classes de `box-warning` e `box-error` e quisesse combinar tudo que começou com a string "box-", você poderia usar `[class^="box-"]` para selecionar os dois (ou `[class|="box"]` como descrito abaixo). -| Seletor | Exemplo | Descrição | +| Seletor | Exemplo | Descrição | | --------------- | ------------------- | ---------------------------------------------------------------------------------------------------------------- | | `[attr^=value]` | `li[class^="box-"]` | Corresponde a elementos com um atributo attr (cujo nome é o valor entre colchetes), cujo valor começa com valor. | | `[attr$=value]` | `li[class$="-box"]` | Corresponde a elementos com um atributo attr cujo valor termina com valor. | From bc48924da9ae9a80209d933746f7f3ba930b5392 Mon Sep 17 00:00:00 2001 From: orpos <58054927+orpos@users.noreply.github.com> Date: Fri, 22 Sep 2023 18:48:43 -0300 Subject: [PATCH 07/12] Update files/pt-br/learn/css/building_blocks/selectors/attribute_selectors/index.md Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com> --- .../css/building_blocks/selectors/attribute_selectors/index.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/files/pt-br/learn/css/building_blocks/selectors/attribute_selectors/index.md b/files/pt-br/learn/css/building_blocks/selectors/attribute_selectors/index.md index 73bdfaba5d7922..2347d80d1c3b37 100644 --- a/files/pt-br/learn/css/building_blocks/selectors/attribute_selectors/index.md +++ b/files/pt-br/learn/css/building_blocks/selectors/attribute_selectors/index.md @@ -38,7 +38,7 @@ Como você sabe de seu estudo de HTML, os elementos podem ter atributos que forn Esses seletores permitem a seleção de um elemento com base na presença de um atributo sozinho (por exemplo, href) ou em várias correspondências diferentes com o valor do atributo. -| Seletor | Example | Description | +| Seletor | Example | Description | | ---------------- | ------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------- | | `[attr]` | `a[title]` | Corresponde a elementos com um atributo attr (cujo nome é o valor entre colchetes). | | `[attr=value]` | `a[href="https://example.com"]` | Corresponde a elementos com um atributo attr cujo valor é exatamente value - a string entre aspas. | From 6ccabc7b50ea15656e4f9c4f14afb49600a25609 Mon Sep 17 00:00:00 2001 From: orpos <58054927+orpos@users.noreply.github.com> Date: Mon, 2 Oct 2023 13:02:49 -0300 Subject: [PATCH 08/12] Update files/pt-br/learn/css/building_blocks/selectors/attribute_selectors/index.md Co-authored-by: Josiel Rocha <1158643+josielrocha@users.noreply.github.com> --- .../css/building_blocks/selectors/attribute_selectors/index.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/files/pt-br/learn/css/building_blocks/selectors/attribute_selectors/index.md b/files/pt-br/learn/css/building_blocks/selectors/attribute_selectors/index.md index 2347d80d1c3b37..a0413b9e46d14b 100644 --- a/files/pt-br/learn/css/building_blocks/selectors/attribute_selectors/index.md +++ b/files/pt-br/learn/css/building_blocks/selectors/attribute_selectors/index.md @@ -38,7 +38,7 @@ Como você sabe de seu estudo de HTML, os elementos podem ter atributos que forn Esses seletores permitem a seleção de um elemento com base na presença de um atributo sozinho (por exemplo, href) ou em várias correspondências diferentes com o valor do atributo. -| Seletor | Example | Description | +| Seletor | Exemplo | Descrição | | ---------------- | ------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------- | | `[attr]` | `a[title]` | Corresponde a elementos com um atributo attr (cujo nome é o valor entre colchetes). | | `[attr=value]` | `a[href="https://example.com"]` | Corresponde a elementos com um atributo attr cujo valor é exatamente value - a string entre aspas. | From b1f47fcceee260c359cb1e69d2d7639594f53a82 Mon Sep 17 00:00:00 2001 From: orpos <58054927+orpos@users.noreply.github.com> Date: Mon, 2 Oct 2023 18:21:32 -0300 Subject: [PATCH 09/12] Update files/pt-br/learn/css/building_blocks/selectors/attribute_selectors/index.md dont really see a change but ok Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com> --- .../css/building_blocks/selectors/attribute_selectors/index.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/files/pt-br/learn/css/building_blocks/selectors/attribute_selectors/index.md b/files/pt-br/learn/css/building_blocks/selectors/attribute_selectors/index.md index a0413b9e46d14b..5867da0c07e5fb 100644 --- a/files/pt-br/learn/css/building_blocks/selectors/attribute_selectors/index.md +++ b/files/pt-br/learn/css/building_blocks/selectors/attribute_selectors/index.md @@ -38,7 +38,7 @@ Como você sabe de seu estudo de HTML, os elementos podem ter atributos que forn Esses seletores permitem a seleção de um elemento com base na presença de um atributo sozinho (por exemplo, href) ou em várias correspondências diferentes com o valor do atributo. -| Seletor | Exemplo | Descrição | +| Seletor | Exemplo | Descrição | | ---------------- | ------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------- | | `[attr]` | `a[title]` | Corresponde a elementos com um atributo attr (cujo nome é o valor entre colchetes). | | `[attr=value]` | `a[href="https://example.com"]` | Corresponde a elementos com um atributo attr cujo valor é exatamente value - a string entre aspas. | From 29e137c42641bc339bf5dbe1dec70aef9ce46c14 Mon Sep 17 00:00:00 2001 From: Josiel Rocha <1158643+josielrocha@users.noreply.github.com> Date: Sat, 7 Oct 2023 19:00:40 -0300 Subject: [PATCH 10/12] Update files/pt-br/learn/css/building_blocks/selectors/attribute_selectors/index.md --- .../css/building_blocks/selectors/attribute_selectors/index.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/files/pt-br/learn/css/building_blocks/selectors/attribute_selectors/index.md b/files/pt-br/learn/css/building_blocks/selectors/attribute_selectors/index.md index 5867da0c07e5fb..b617bb49fafffb 100644 --- a/files/pt-br/learn/css/building_blocks/selectors/attribute_selectors/index.md +++ b/files/pt-br/learn/css/building_blocks/selectors/attribute_selectors/index.md @@ -14,7 +14,7 @@ Como você sabe de seu estudo de HTML, os elementos podem ter atributos que forn Conhecimentos básicos em informática, software básico instalado, conhecimentos básicos de Date: Sat, 7 Oct 2023 19:00:48 -0300 Subject: [PATCH 11/12] Update files/pt-br/learn/css/building_blocks/selectors/attribute_selectors/index.md --- .../css/building_blocks/selectors/attribute_selectors/index.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/files/pt-br/learn/css/building_blocks/selectors/attribute_selectors/index.md b/files/pt-br/learn/css/building_blocks/selectors/attribute_selectors/index.md index b617bb49fafffb..29f978e2d2668d 100644 --- a/files/pt-br/learn/css/building_blocks/selectors/attribute_selectors/index.md +++ b/files/pt-br/learn/css/building_blocks/selectors/attribute_selectors/index.md @@ -18,7 +18,7 @@ Como você sabe de seu estudo de HTML, os elementos podem ter atributos que forn >software básico instalado, conhecimentos básicos de trabalhando com arquivos, Basico de HTML (Estude Date: Sat, 7 Oct 2023 19:00:56 -0300 Subject: [PATCH 12/12] Update files/pt-br/learn/css/building_blocks/selectors/attribute_selectors/index.md --- .../css/building_blocks/selectors/attribute_selectors/index.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/files/pt-br/learn/css/building_blocks/selectors/attribute_selectors/index.md b/files/pt-br/learn/css/building_blocks/selectors/attribute_selectors/index.md index 29f978e2d2668d..fa629d45ee7b24 100644 --- a/files/pt-br/learn/css/building_blocks/selectors/attribute_selectors/index.md +++ b/files/pt-br/learn/css/building_blocks/selectors/attribute_selectors/index.md @@ -73,7 +73,7 @@ O próximo exemplo mostra o uso desses seletores: {{EmbedGHLiveSample("css-examples/learn/selectors/attribute-substring.html", '100%', 800)}} -## Sensibilidade a maiúsculas +## Sensibilidade à maiúsculas Se você deseja combinar valores de atributo sem distinção entre maiúsculas e minúsculas, você pode usar o valor i antes do colchete de fechamento. Este sinalizador informa ao navegador para corresponder caracteres ASCII sem distinção entre maiúsculas e minúsculas. Sem o sinalizador, os valores serão correspondidos de acordo com a distinção entre maiúsculas e minúsculas do idioma do documento - no caso do HTML, será sensível a maiúsculas e minúsculas.