Egzamin z kwalifikacji E.14. Strona internetowa. HTML / CSS

Witam! Potrzebuje pomocy, próbuje się uczyć do egzaminów na Technika Informatyka z kwalifikacji E14 i mam problem z tym zadaniem:

Arkusz E.14-06-19.06 - Wykonaj aplikację internetową firmy zajmującej się usługami informatycznymi.

Wykorzystaj do tego celu edytor zaznaczający składnię oraz program do obróbki grafiki rastrowej. Przygotuj, przy pomocy programu do obróbki grafiki rastrowej i pliku mysz.jpg, dwa banery, według poniższych wytycznych [...]

chodzi mi oto zadanie z tą myszką, czy by ktoś mi pomogł ? I wytłumaczyć kod? 

Witaj Kamilu - a z czym masz dokładnie problem? Czego nie rozumiesz z tych poleceń? 😉

Zrobiłem kod HTML, ale nie potrafię zrobić w CSS 😕 Chciałbym zobaczyć kod, żeby był wytłumaczony :3 

Nie chce iść na łatwiznę, aczkolwiek nie poradziłem sobie z tym zadaniem ;# 

A więc tak Kamilu, styl.css może wyglądać następująco:

body{
      /* Kolor tła według tego co w arkuszu */
      background-color: #99FF66;
}

.kontener{
      /* Ustalamy szerokość */
      width: 1000px;
      
      /* marginesy zewnętrzne automatyczne */
      margin: 0 auto;
}

.baner{
      /* Tło */
      background-color: #99FFCC;

      /* Wysokość */
      height: 200px;
}

.menu{
      /* Kolor tła */
      background-color: #66CCFF;

      /* Wyrównanie do środka */
      text-align: center;

      /* Górny i dolny margines wewnętrzny */
      padding: 20px 0;
}

/* Odnośniki z bloku menu */
.menu a{
      /* Kolor */
      color: #006666;

      /* Margines wewnętrzny */
      padding: 50px;

      /* Rozmiar czcionki */
      font-size: 200%;

      /* Bez podkreślenia */
      text-decoration: none;
}

.kolumna{
      /* Szerokość */
      width: 310px;

      /* Margines wewnęrzny */
      padding: 10px;


      /* Nie wiem czy na to zezwalają ale żeby były obok siebie to trzeba użyć czegoś takiego*/
      display: inline-block;
      
      /* A to aby były "przyklejone" do góry */
      vertical-align: top;
}

.stopka{
      background-color: #66CCFF;
      color: #006666;
      text-align: right;
      height: 30px;
      padding: 20px;
}

h2, h3{
      text-align: center;
}

/* Przycisk reset w formularzu */
form button[type="reset"]{
      background-color: #ff0000;
}

/* Przycisk wysyłający formularz */
form button[type="submit"]{
      background-color: #00ff00;
}

Mam nadzieję, że o to chodziło. Niestety nie wiem jak was w szkole przygotowują więc polegam na swoim doświadczeniu gdy byłem w technikum i z czym nie było problemu na egzaminie. Podany kod musisz sobie dostosować pod siebie i swoje nazewnictwo dla danych klas bloków/sekcji.

Nie wiem też czy Cię te tematy z tworzeniem stron interesują ale tak na koniec napiszę - że to co się uczy w technikum na zajęciach odnośnie stron to ponad 70% rzeczy wyszło z użycia i w obecnym internecie stosuje się bardziej wygodniejsze techniki 😉

Pan zrobił to zadanie na dole, a ja potrzebuje to zadanie u góry. To zadanie z formularzem sobię poradziłem i mam HTML I CSS i jest podobny, aczkolwiek mi chodzi o HTML i CSS o zadanie wyżej http://egzamin-e14.blogspot.com/2019/10/arkusz-e14-06-1906.html

Chodzi o to:

https://1.bp.blogspot.com/-uPOC0vHCa60/XZiY9pU6wmI/AAAAAAAAEDc/ZrJjHwhb39gGVZtWvHacjykAF13J8gQogCLcBGAsYHQ/s400/z.png

Oj Kamilu to źle wytłumaczyłeś - chodzi Ci w takim razie o grafikę? O baner i favicon?

To musisz zrobić w programie graficznym takim jaki Twoja szkoła dostarcza (Gimp lub Photoshop)

PS: (Prosiłbym abyś nie dublował odpowiedzi 😉)

Tak o to chodzi co wyzej napisaleś. Tylko, że ja chce zrobić to zadanie bez użycia programu graficznego żeby bylo tak jak tam na zdjęciu 

Przepraszam za dublowanie.

Żeby wykorzystać te grafiki co są na tej stronie zeby było okej 

Okej to powiedz mi co z tych grafik tam masz?

Bo niestety favicon nie dasz rady zrobić bez grafiki (a na wyższym poziomie wiedzy mógłbyś to uzyskać przy pomocy base64 ale ta wiedza raczej nie jest Ci znana).

Jeśli chcesz zrobić ten baner w kodzie no to podobnie jak w przypadku kolumn tworzysz 3 tylko że boczne (1 i 3) robisz np.: na szerokość 100px a wiedząc że cała strona ma 1000px łatwo to obliczyć ile ma mieć środkowa część

100 + 100 = 200

1000 - 200 = 800

800px będzie miała środkowa część czyli kolumna 2 i do niej wsadzasz tekst a do bocznych grafikę

Możesz sprawdzić gotowe rozwiązane zadania które dodałem jakiś czas temu:

• E14 - Forum hobbistyczne. Gotowy skrypt.
• E14 - Sklep muzyczny z formularzem. Gotowy skrypt.
• E14 - Salon pielęgnacji kotów i psów. Gotowa strona.
• E14 - Usługi remontowe. Gotowy skrypt.