Kod do pliku html:
<!DOCTYPE html> <html> <head> <title>Al-Sughari</title> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <!-- Alexander Al-Sughari 1P 23.04.2021 --> <link href="../css/zadanie63_alsu.css" rel="stylesheet" type="text/CSS"> </head> <body> <div id="pierwszy_al-sughari"> <p> Pierwszy akapit/pierwszy DIV → Al-Sughari <br> nazwa ID akapitu id="pierwszy_al-sughari" </p> <p> Drugi akapit/pierwszy DIV <br> pierwszy akapit → p:first-child {font-size: 7mm; font-style: italic;} <br> bo numer nieparzysty w dzienniku <br> pozostałe akapity → p {font-size: 11pt;} <br> bo numer nieparzysty <br> szerokośc bloku = 700+1*4=704pt <br> pierwszy DIV → kolor jasno zielony <br> <br> Trzeci apakit/pierwszy DIV <br> pierwszy DIV → obramowanie czarne DIV <br> pierwszy DIV → obramowanie grubość 3px, ciągłe <br> pierwszy DIV → r1=7px+9(Alexander)=16px </p> </div> <br> <div id="drugi_al-sughari"> <p> Pierwszy akapit/drugi DIV → Alexander <br> nazwa ID akapitu id="drugi_al-sughari" </p> <p> Drugi akapit/drugi DIV <br> drugi DIV → kolor jasno niebieski </p> <p> trzeci akapit/drugi DIV <br> drugi DIV → obramowanie granatowy DIV <br> drugi DIV → obramowanie grubość 5px, ciągłe <br> drugi DIV → r2=7px+10(Al-Sughari)=17px </p> </div> <br> <div id="trzeci_al-sughari"> <p> Pierwszy akapit/trzeci DIV → 1P <br> nazwa ID akapitu id="trzeci_al-sughari" </p> <p> Drugi akapit/trzeci DIV <br> trzeci DIV → różowy </p> <p> trzeci akapit/trzeci DIV(solid) <br> trzeci DIV → obramowanie fioletowy DIV <br> trzeci DIV → obramowanie grubość 7px <br> trzeci DIV → r3=7px+9(wrzesień)=16px </p> </div> </body> </html>
Kod do pliku css:
/* Alexander Al-Sughari 1P 23.04.2020 */ body { background-color: #C0C0C0; } p { font-size: 11pt; } p:first-child { font-size: 7mm; font-style: italic; } div#pierwszy_al-sughari { width: 704pt; margin-left: auto; margin-right: auto; background-color: rgb(170,255,0); border-top-right-radius: 16px; border-top-left-radius: 16px; border-bottom-right-radius: 16px; border-bottom-left-radius: 16px; border: 3px solid rgb(0,0,0); } div#drugi_al-sughari { width: 904pt; margin-left: auto; margin-right: auto; background-color: rgb(0,150,255); border-top-right-radius: 17px; border-top-left-radius: 17px; border-bottom-right-radius: 17px; border-bottom-left-radius: 17px; border: 5px solid rgb(0,0,205); } div#trzeci_al-sughari { width: 1104pt; background-color: rgb(248,131,121); border-top-right-radius: 16px; border-top-left-radius: 16px; border-bottom-right-radius: 16px; border-bottom-left-radius: 16px; border: 7px solid rgb(148,0,211); }
Darmowy hosting
zapewnia PRV.PL