W3docs

Propriedade CSS all

all é uma propriedade CSS que repõe todas as propriedades nos seus valores initial e inherit. Veja os exemplos.

A propriedade all repõe todas as propriedades do elemento selecionado, exceto unicode-bidi e direction, que controlam a direção do texto.

Esta propriedade é considerada uma abreviada (shorthand) de reposição. Ao contrário das abreviadas de vários valores, como margin ou background, não tem uma versão longhand nem subpropriedades.

Valor inicialnormal
Aplica-se aTodos os elementos.
HerdadaNão.
AnimávelNão.
VersãoCSS3
Sintaxe DOMobject.style.all = "inherit";

Sintaxe

Sintaxe da propriedade CSS all

all: initial | inherit | unset | revert | revert-layer;

Exemplo da propriedade all com o valor revert:

Exemplo da propriedade CSS all com o valor revert

<!DOCTYPE html>
<html>
  <head>
    <title>Title of the document</title>
    <style>
      .example {
        background-color: #8ebf42;
        color: #666;
        all: revert;
      }
    </style>
  </head>
  <body>
    <h2>All property example</h2>
    <p>Here the all: revert; is set.</p>
    <div class="example"> An extrovert is a friendly person who enjoys talking to and being with other people. Extroverts love parties, talking on the phone, and meeting new people. </div>
  </body>
</html>

Resultado

Propriedade CSS all

Exemplo da propriedade all com os valores inherit, initial e unset:

Exemplo da propriedade CSS all com os valores inherit, initial e unset

<!DOCTYPE html>
<html>
  <head>
    <title>Title of the document</title>
    <style>
      body {
        font-size: 15px;
        color: #1c87c9;
      }
      .example1 {
        background-color: #8ebf42;
        color: #666;
      }
      .example2 {
        background-color: #8ebf42;
        color: #666;
        all: inherit;
      }
      .example3 {
        background-color: #8ebf42;
        color: #666;
        all: initial;
      }
      .example4 {
        background-color: #8ebf42;
        color: #666;
        all: unset;
      }
    </style>
  </head>
  <body>
    <h2>All property example</h2>
    <hr />
    <p>No all property:</p>
    <div class="example1"> An extrovert is a friendly person who enjoys talking to and being with other people. Extroverts love parties, talking on the phone, and meeting new people. </div>
    <hr />
    <p>all: inherit:</p>
    <div class="example2"> An extrovert is a friendly person who enjoys talking to and being with other people. Extroverts love parties, talking on the phone, and meeting new people. </div>
    <hr />
    <p>all: initial:</p>
    <div class="example3"> An extrovert is a friendly person who enjoys talking to and being with other people. Extroverts love parties, talking on the phone, and meeting new people. </div>
    <hr />
    <p>all: unset:</p>
    <div class="example4"> An extrovert is a friendly person who enjoys talking to and being with other people. Extroverts love parties, talking on the phone, and meeting new people. </div>
    <hr /> 
  </body>
</html>

Valores

ValorDescrição
initialDefine a propriedade com o seu valor inicial.
inheritHerda a propriedade do seu elemento pai.
unsetFunciona como inherit para as propriedades herdáveis e como initial para as não herdáveis.
revertEspecifica um comportamento que depende da origem da folha de estilo à qual a declaração pertence.
revert-layerRepõe a propriedade no valor definido na cascade layer anterior.

Prática

Prática
According to the site w3docs, which of the following statements about CSS are true?
According to the site w3docs, which of the following statements about CSS are true?
Was this page helpful?