Jump to content
Sign in to follow this  
adam2350

Co oznaczają znaki interpunkcyjne i specjalne w CSSie?

Recommended Posts

Siemka !

Czym się różnią te rzeczy w css 3 (, > ) ?

Przykład

Jest to przykład więc może być źle.

.pasek input[type=submit]{
    background-color: #4CAF50;
    border: 1px solid  #2A9D38;
    color: white;
    padding: 16px 32px;
    text-decoration: none;
    margin: 4px 2px;
    cursor: pointer;
}
.pasek > input[type=submit]{
    background-color: #4CAF50;
    border: 1px solid  #2A9D38;
    color: white;
    padding: 16px 32px;
    text-decoration: none;
    margin: 4px 2px;
    cursor: pointer;
}
.pasek, input[type=submit]{
    background-color: #4CAF50;
    border: 1px solid  #2A9D38;
    color: white;
    padding: 16px 32px;
    text-decoration: none;
    margin: 4px 2px;
    cursor: pointer;
}

 

Share this post


Link to post
.pasek input[type=submit] { ... }

Oznacza, że dla każdego elementu, który znajduje się w rodzicu .pasek należy nadać odpowiednie style. Struktura wtedy może wyglądać mniej więcej tak:

<div class="pasek">
  <div class="element_1">
    <div class="element_2">
      <input type="submit" value="" />
    </div>
  </div>
</div>

 

.pasek > input[type=submit] { ... }

Ten natomiast oznacza, że dla inputa, który bezpośrednio znajduje się po elemencie przed znakiem > należy nadać odpowiednie style. W tym przypadku struktura może wyglądać tylko tak:

<div class="pasek">
  <input type="submit" value="" />
</div>

 

.pasek, input[type=submit] { ... }

Natomiast ostatni oznacza, że dla każdego elementu .pasek a także input należy ustawić następujące style. Chodzi tutaj o to, że te dwa znaczniki mogą znajdować się w zupełnie różnym miejscu, ale w CSS będą nadane te same klasy.

  • Like 2

Share this post


Link to post
Guest
This topic is now closed to further replies.
Sign in to follow this  
×
×
  • Create New...