Skocz do zawartości
PL
Szukaj na Pecetowiczu
  • Utwórz konto

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


Rekomendowane odpowiedzi

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? 

Odnośnik do komentarza
Udostępnij na innych stronach

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

Odnośnik do komentarza
Udostępnij na innych stronach

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

Odnośnik do komentarza
Udostępnij na innych stronach

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

Odnośnik do komentarza
Udostępnij na innych stronach

(edytowane)

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

Spoiler


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 😉

Edytowane przez Mativve
Odnośnik do komentarza
Udostępnij na innych stronach


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

Odnośnik do komentarza
Udostępnij na innych stronach

(edytowane)

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 😉)

Edytowane przez Mativve
Odnośnik do komentarza
Udostępnij na innych stronach

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 

Odnośnik do komentarza
Udostępnij na innych stronach

Przepraszam za dublowanie.

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

Odnośnik do komentarza
Udostępnij na innych stronach

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ę

Odnośnik do komentarza
Udostępnij na innych stronach

Dołącz do dyskusji

Gość
Niestety, Twoja zawartość zawiera warunki, na które nie zezwalamy. Edytuj zawartość, aby usunąć wyróżnione poniżej słowa.
Dodaj odpowiedź do tematu...

×   Wklejono zawartość z formatowaniem.   Przywróć formatowanie

  Dozwolonych jest tylko 75 emoji.

×   Odnośnik został automatycznie osadzony.   Przywróć wyświetlanie jako odnośnik

×   Przywrócono poprzednią zawartość.   Wyczyść edytor

×   Nie możesz bezpośrednio wkleić grafiki. Dodaj lub załącz grafiki z adresu URL.

  • Dodaj nową pozycję...
  • Dodaj nową pozycję...