Czy trzeba dopisać coś do kodu HTML żeby się wyświetlało dobrze?

pytanie zadane 10 grudnia 2021 w HTML i CSS przez Kamissa Nowicjusz (120 p.)

Pomimo tego że, wpisałam prawidłowy link do pliku CSS nie wyświetla się grafika zapisana w pliku z kodem CSS, na przeglądarce po sprawdzeniu jak to będzie wyglądać na przeglądarce

 <DOCTYPE!html>
 <HTML>
   <head>
    <html lang="pl-PL">
	
     <meta charset="UTF-8">
     <meta name="description" content="dysortografia, dysgrafia, dyskalkulia polegają na myleniu liter albo cyfr ze sobą">
    <title>Bez dyskalkulii</title>
    <meta name "keywords": "dysleksja, dyskalkulia, dysortografia, dysgrafia, rodzaje dysleksji, rodzaje dyskalkulii, rodzaje dysortografii, bez dyskalkulii, bez dysgrafii, bez dysortografii, sposoby na dyskalkulię, sposoby na dysortografię, sposoby na dysgrafię">
    <link rel= "stylesheet" href= "stronawyglada.css" type= "text/css">
     </head>
     <body>
       <div id="main">
	     
        <div id="article-1">
		 <dl>
		  <p>
          <dt>Dyskalkulia</dt>
          <dd>polega na błędnym zauważaniu (postrzeganiu) cyfr przed liczeniem,</dd>
      <ul>czyli po prostu na myleniu cyfr przykładowo:
        <li>Kiedy patrzę  na 3 odbieram to jako 6 i tak ją później traktuję</li>
        <li>kiedy patrzę  na 9 odbieram to jako 9 i tak ją później traktuję</li>
        <li>kiedy patrzę  na 6 odbieram to jako 3 i tak ją później traktuję</li>
      </ul> 
        </dl>
    <p>                                                           
    <dl>                                                  
     <h1>Istnieje wiele rodzajów dyskalkulii, jednym z nich jest - dyskalkulia leksykalna.</h1> 
       <dt>Ten rodzaj dyskalkulii</dt>
        <dd>Polega na myleniu cyfr przed liczeniem na kartkówkach z działań  na liczbach, to daje się zauważyć  przez wszystkich przy liczeniu czegokolwiek, co daje się  też  zauważyć nauczycielom matamatyki przy spradzaniu kartkówek są tam pomylone zawsze przykładowo wielokrotności trzech na przykład: 3 z 6, 3 z 9, 6 z 9, 6 z 3, 9 z 3, 9 z 6, bądź wielokrotności innej od tej cyfry; Po prostu jakaś  osoba patrzy na trzy, jak na którąś z jej wielokrotności np: sześć, i tak właśnie ją  traktuje,  że wychodzi wynik z wielokrotności tej cyfry, to samo dotyczy szóstki i dziewiątki, osoba z dyskalkulią  postrzega ją błędnie jako jakąś   z ich wielokrotności i tak je później traktuje przy liczeniu. Dzieje się  tak przez to  że w przeszłości zlekceważyła różnice pomiędzy nimi. Uznała  że to prawie to samo dlatego  że, liczenie jest dla niej niby "głupie" czy "bez sensu"  i wzięło się  to z jej z  tego lekceważenia różnicy pomiędzy nimi. 
        Dlatego  że od wszystkich wokół  słyszała,  że to "bez sensu" czy też  "głupie" i uznała  że, mają  rację. Przez to w jej  życiu działo się  tak,  że później nawet przy jej staraniu w liczeniu  błędy  pojawiają  przy dzieleniu skomplikowanych ułamków dziesiętnych przez jakieś  liczby.  Żeby pozbyć  się  tego problemu trzeba sobie przede wszystkim uświadomić,  której wielokrotności on dotyczy i kilka razy potwierdzać  swojej podświadomości, która jest - którą, afirmacjami. W Japoni problem dyskalkulii nie istnieje dlatego  że, mają  swój oryginalny sposób na liczenie - dzielenie przez rysowanie linii do każdej cyfry ilorazu i dzielnika.<dt/><dl/>
                                                            
      
        <div id="article-2">
		 <dt>Dysortografia - </dt>                                                                                                           
          <dd>polega na myleniu poszczególnych liter ze sobą  w piśmie na przykład: L z Ł zmianie nie ulegają  raczej inne litery, chociaż to jest bardzo możliwe poprzez zamienianie głosek, które tak samo się  prawieże pisze, a trochę  inaczej brzmią i są  to te same zbiory głosek Z może być  zamienione na Ż  lub Rz bądź    albo Dz, jak też  Dż  w najtrudniejszych kompilacjach. Dzieje się  tak dlatego  że, dawniej nie było to dla nas w ogóle ważne, a nawet wydawało się  "beznadziejne", dlatego  że albo nikt tego nie chciał  ze starszych mądrością,  żeby tak było prawidłowo odbierane przez ich mózg, która głoska jest którą. Najczęśiej spotyka się chyba zamianę kombinację L na Ł   na terenach pojezierza brodnickiego.</dd>
        <div id="article-3">
            <dt>Dysgrafia</dt> 
                  <dd>dotyka najczęściej osób które, nie zmieniały niczego na lepsze w swojej osobowości  w ciągu  życia ale też ludzi, którzy zmieniali się na gorsze w czasie w rzeczywistości, ale też nie rowijali się  prawidłowo.<dd/>
          <ul>
	         Ludzie którzy się nie rozwijają:
              <li>mają szmat czasu,</li>
              <li>ten sam charakter pisma, co wcześniej,</li> 
              <li>ale osoby , które się nie rozwijają prawidłowo mają częstsze zmiany osobowości pisma, poprzez zmianę też swojego otoczenia, a nie tylko swojej osobowości, jak też zmian  warunków  życiaSS a to wszystko w charakterze pisma. Wszystkie zmiany charakteru pisma  świadczą o rozwoju duchowym człowieka, ich brak o jego stagnacji. Lekarstwem na dysgrafię jest terapeutyczna kaligrafia, czyli po prostu pisanie czegokollwiek na papierze albo na innej płaskiej powierzchni, albo wolne pisanie, które polega na opisywaniu wszystkiego co, dzieje się w naszym życiu duchowym. Marnowanie czasu na bezsensowne pisanie kciukami na klawiaturze qwerty znajduje swoje odzwierciedlenie w charakterze pisma i dlatego wymaga uważności. Marnowanie czasu na pisanie bez sensu kciukami opóźnia rozwój charakteru.</ul>
             </main>
         </body>

            <footer>
             bezdyskalkulii.net 2021 
			 copy&
            </footer>
          
</HTML>

#main
{        
          font-family: 'helvetica', 'garamond', 'arial','sans-serif';
		  font-size: 25px;
          }
             .article-1;
             .article-2;
             .article-3;			 
			 font-family: "garamond", sans-serif;
			 
			 
			 
          {
          display: inline-block;
          
		   text-decoration: none;
		   text-shadow: 1 px 1 px 5 px #cc0066; 
           background-color: midnight blue;
		   color: 9000cc;
           background-image: url(dysortografia.jpg); 
           background-repeat: round;
           background-position: right-top;
		   
		  
         
          margin-top: 20px;
          margin-right: 20px;
          margin-bottom: 20px;
          margin-left: 20px;

             border-width: 2px;
             border-style: ridge, double;
             border-color: #FF7043;
     
            padding-top: 20 px;
            padding-right: 20 px;
            padding-bottom: 20 px;
            padding-left: 20 px;
			 outline-style: ridge;
			 outline-color: cc0066;
			 outline-width: medium;
			 outline-offset: 15 px;
              text-align: justify;
              }

. Czy coś trzeba dopisać do kodu żeby się wyświetlało prawidłowo?

komentarz 10 grudnia 2021 przez Snejki Stary wyjadacz (14,520 p.)

Sprawdź sobie w którym miejscu powinny się znajdować nawiasy, ponieważ są umieszczone w złym miejscu. To samo dotyczy średników przy klasach .article-1, .article-2 i .article-3

2 odpowiedzi

odpowiedź 10 grudnia 2021 przez Comandeer Guru (600,810 p.)

Kod CSS jest niepoprawny składniowo.

Ten fragment

}
             .article-1;
             .article-2;
             .article-3;             
             font-family: "garamond", sans-serif;
              
              
              
          {

powinien raczej wyglądać tak:

font-family: "garamond", sans-serif;
}
             .article-1,
             .article-2,
             .article-3 {

Definicja fontu powinna być w bloku dla jakiegoś selektora, nie osobno. Wrzuciłem ją więc do bloku od #main.
Selektory oddzielamy przecinkiem, nie średnikiem.

odpowiedź 10 grudnia 2021 przez toko Dyskutant (7,670 p.)
edycja 10 grudnia 2021 przez toko

nieźle nachrzaniłaś w tym kodzie, więc nic dziwnego, że nie działa.

Po pierwsze:

<DOCTYPE!html>

co to jest? Chyba miało być tak:

<!DOCTYPE html>

Po drugie:

    <html lang="pl-PL">

co robi ta linijka w headzie? lang="pl-PL" powininnaś dopisać do linijki 2:

<HTML lang="pl-PL">

Po trzecie:

    <meta name "keywords": "dysleksja, dyskalkulia, dysortografia, dysgrafia, rodzaje dysleksji, rodzaje dyskalkulii, rodzaje dysortografii, bez dyskalkulii, bez dysgrafii, bez dysortografii, sposoby na dyskalkulię, sposoby na dysortografię, sposoby na dysgrafię">

pochrzaniłaś atrybuty. Powinno byc tak:

    <meta name="keywords" content="dysleksja, dyskalkulia, dysortografia, dysgrafia, rodzaje dysleksji, rodzaje dyskalkulii, rodzaje dysortografii, bez dyskalkulii, bez dysgrafii, bez dysortografii, sposoby na dyskalkulię, sposoby na dysortografię, sposoby na dysgrafię">

Po czwarte:

    <link rel= "stylesheet" href= "stronawyglada.css" type= "text/css">

Możnaby usunąć spacje.

Dużo tego, jednak zmieniam podejście. Zajrzyj sobie na kursy HTML i CSS, a kod wrzuć do walidatora, na przykład tego, lub tego, a dla CSS-a tego, który ci wytknie wszystkie błędy, bo jest po przynajmniej jednym w każdej linijce.

Po wrzuceniu tego pliku do walidatora, wyskoczyło w pierwszych 4 linikkach 6 błędów, 1 ostrzerzenie, i 1 błąd fatalny po którym przerwał sprawdzanie.

Zachowanie przeglądarki dla tak zepsutej strony nie jest zdefiniowane, może z nią zrobić cokolwiek. Większość przeglądarek domyśli się pewnie co chciałaś napisać, np. przeniesie footer do body, tam gdzie powinien być, ale nie możesz na to liczyć, bo inna zrobi coś zupełnie odwrotnego

Nie znasz nawet podstawowej struktury strony html:

<!doctype html>
<html lang="tunaszjezyk-tuwariantjezyka">
<head>
<meta charset="tutajnaszekodowanie">
tutaj treść niewidoczna strony, np. skrypty javascript, style css, metadane, tytuł, ikona, kodowanie
</head>
<body>
tutaj widoczna treść strony np. paragrafy, zdjęcia, menu
</body>
</html>

Proponuję najpierw to zrozumieć, a dopiero potem brać się za pisanie strony (nawet prostej).