Förklara för mig i vilken ordning css-filerna körs

2018-07-25, 17:48 #1

Medlem

Reg: Mar 2018

Inlägg: 45

först har jag typ

HTML-kod:

<!-- Bootstrap CSS -->
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">

och sen, efter har jag lite egna css typ

HTML-kod:

<style>
td {
  border-width: 0;
}
</style>

Och då tror man ju att webbläsaren först läser in css-filen och skriver över den med efterkommande css. men så är ju itne fallet. däremot när jag anger

HTML-kod:

<table>
  <tbody>
    <tr>
      <td style="border-width:0">

så funkar det, kan ni förklara varför?

Citera

2018-07-25, 22:38 #2

Medlem

Reg: Jan 2012

Inlägg: 3 171

Det bör fungera.
Gör en https://jsfiddle.net/ eller liknande av det så vi kan se hur det ser ut och testa själva.

Citera

2018-07-25, 22:48 #3

Moderator

Reg: Sep 2010

Inlägg: 3 765

Det handler inte om ordning, det handlar om specificity. Alltså hur specifik en regel är. Bootstraps regler är mer specifika än din regel, då din regel endast agerar på td, medan bootstraps agerar på, t.ex. .table td, vilket är mer specifikt.
Regler i style-attributet på ett enskilt element får dock prioritet över allt, om jag inte missminner mig.

Citera

Förklara för mig i vilken ordning css-filerna körs

Stöd Flashback