CSS i html? Co jest nie tak?

pytanie zadane 12 czerwca 2018 w HTML i CSS przez qarq Początkujący (330 p.)

Witam Was, rozpocząłem naukę HTML i CSS i mam pewien problem. Mianowicie chodzi o połączenie html i pliku CSS. Pliki są w tym samym folderze, wszystko niby zgadza się z książką z której się uczę a jednak coś nie działa. Jeśli chodzi o przeglądarki próbowałem zarówno Safari jak i Chrome.

<!DOCTYPE html>
<html>
<head>
<link href="style.css"
type="text/css"
rel="stylesheet" />

</head>
<body>


<h1>Próbne arkusze styli</h1>

<h2>zobaczmy jak to działa</h2>

<p class="one">Arkusz numer 1(zielone tło i białe litery) </p>
<p class="two">Arkusz numer 2(czerwone tło i czarne litery</p>









</body>
</html>




a tutaj plik CSS


body {
background-color: rgb(82, 68, 68)
color white
padding 20px
font-family Arial

}


h1 {

    background-color:rgb(44, 138, 102) 
    color white
    padding 20px
}
h2{
    background-color: rgb(116, 86, 95)
    padding inherit
}
p.one{
    background-color: rgb(48, 179, 48)
    color white

}
p.two{
    background-color: rgb(185, 84, 84)
    color black
}

efekt jest taki (czyli żaden)

4 odpowiedzi

odpowiedź 12 czerwca 2018 przez Tomek Sochacki Ekspert (227,510 p.)
wybrane 13 czerwca 2018 przez qarq

Najlepsza

color white
padding 20px
font-family Arial

tyczy się to generalnie całego pliku ze stylami.

komentarz 13 czerwca 2018 przez qarq Początkujący (330 p.)

Poprawiłem średniki, wyczyściłem cache,sprawdziłem rozszerzenie.

body {
background-color: rgb(82, 68, 68);
color: white;
padding: 20px;
font-family: Arial;

}


h1 {

    background-color:rgb(44, 138, 102); 
    color: white;
    padding: 20px;
}
h2{
    background-color: rgb(116, 86, 95);
    padding: inherit;
}
p.one{
    background-color: rgb(48, 179, 48);
    color: white;

}
p.two{
    background-color: rgb(185, 84, 84);
    color: black;
}

Kod wygląda teraz tak jak powyżej; tym razem pokazuje się po prostu pusta strona; bez tekstu.

komentarz 13 czerwca 2018 przez Tomek Sochacki Ekspert (227,510 p.)

wstawiłem na codepena Twój html i css ten co poprawiłeś i wszystko działa jak należy:

https://codepen.io/anon/pen/WyOvrw

komentarz 13 czerwca 2018 przez qarq Początkujący (330 p.)

Skopiowałem cały folder na komputer z windowsem i przeglądarką Chrome. Efekt taki sam.

Możliwe jest że podaje gdzieś złą ścieżkę do pliku .css?(chociaż w visual code studio, kiedy kombinacją cmd+kliknięcie próbuje przejść do arkusza, wszystko działa). A może to kwestia kodowania? Wybrane mam "UTF-8 with BOM".

komentarz 13 czerwca 2018 przez Tomek Sochacki Ekspert (227,510 p.)

nie pracuj z BOM, ustaw bez bom i przekoneertuj pkik zeby to usunac.

komentarz 13 czerwca 2018 przez qarq Początkujący (330 p.)

Ogromne dzięki! Problem był właśnie chyba w kodowaniu, bo zrobiłem od nowa wszystko (bez BOM) i wszystko działa.

odpowiedź 12 czerwca 2018 przez Mariusz08 Maniak (62,300 p.)

1. Spróbuj CTRL + F5 (usuń cache)

2. Mamy HTML5; nie musimy dopisywać type="text/css"

3. Sprawdź, czy plik css nie ma rozszerzenia .css.txt

1	komentarz 12 czerwca 2018 przez Mariusz08 Maniak (62,300 p.) 4. Pomiędzy właściwościami CSS nie masz średników (;) dodaj je tam; prawdopodobnie to one powodują błąd.