HTML λίστες - εικονες
Presentation
•
Computers
•
8th Grade
•
Practice Problem
•
Medium
Katerina Melissourgou
Used 28+ times
FREE Resource
9 Slides • 17 Questions
1
Μια μικρή επανάληψη
2
3
Multiple Choice
Κοιτάξτε τον παρακάτω κώδικα και προβλέψτε πώς θα εμφανίζονται οι επικεφαλίδες.
<h3> Eggs </h3>
<h1> Bacon </h1>
<h6> Waffles </h6>
4
Multiple Choice
HTML
<!DOCTYPE html>
<html>
<body>
<h2>My First Heading</h2>
<p>My first paragraph.</p>
</body>
</html>
Σύμφωνα με αυτό τον παραπάνω κώδικα τι κάνει η εντολή <!DOCTYPE html>
Δηλώνει ότι το έγγραφο είναι JavaScript.
Δηλώνει τη συμβατότητα του προγράμματος περιήγησης του εγγράφου.
Δηλώνει την έκδοση html που χρησιμοποιείται.
Καθορίζει την κωδικοποίηση χαρακτήρων για το έγγραφο HTML.
5
Multiple Choice
Ποια από τις παρακάτω ετικέτες δηλώνει ιστοσελίδα HTML 5
<DOCTYPE HTML>
<!DOCTYPE HTML>
<!HTML5>
<DOCTYPE !HTML5>
6
Multiple Choice
Η ετικέτα που χρησιμοποιείται για την έναρξη μιας νέας γραμμής είναι
br
hr
7
Html λίστες
Html εικόνες
8
Λίστες
Υπάρχουν δύο τύποι λιστών στην HTML,
οι ταξινομημένες <ol> και οι μη ταξινομημένες λίστες <ul>.
Μια μη ταξινομημένη λίστα είναι απλώς ένα σύνολο στοιχείων με κουκκίδες.
Κάθε στοιχείο στη λίστα επισημαίνεται με μια ετικέτα <li>.
Το <li> είναι θυγατρικό στοιχείο, που σημαίνει ότι εισέρχεται μέσα στο γονικό του στοιχείο, την ταξινομημένη <ol> ή την μη ταξινομημένη λίστα (<ul>) αντίστοιχα.
9
Παράδειγμα μη ταξινομημένης λίστας
10
Παράδειγμα ταξινομημένης λίστας
11
Multiple Choice
Ποια από αυτές τις ετικέτες δημιουργεί μια μη ταξινομημένη λίστα
<li>
<ol>
<ul>
<item>
12
Multiple Choice
Ποια από τις παρακάτω ετικέτες χρησιμοποιείται κατά τη δημιουργία λιστών με αρίθμηση και κουκκίδες;
<li>
<ol>
<ul>
<item>
13
Multiple Choice
Τι τύπος λίστας είναι ?
Ταξινομημένη
Μη ταξινομημένη
14
Multiple Choice
Ποια είναι η σωστή ετικέτα HTML για να ξεκινήσετε μια ταξινομημένη λίστα;
<list>
<or>
<ol>
<ordered>
15
Εικόνες
Οι ιστοσελίδες περιέχουν εικόνες
16
Η ετικέτα <img>
Η ετικέτα <img> στην HTML χρησιμοποιείται για την ενσωμάτωση μιας εικόνας σε μια ιστοσελίδα.
Οι εικόνες δεν εισάγονται τεχνικά σε μια ιστοσελίδα.
Οι εικόνες συνδέονται με ιστοσελίδες.
Η ετικέτα <img> δημιουργεί ένα κενό χώρο για την αναφερόμενη εικόνα και δεν έχει tag κλεισίματος.
Και έχει δύο απαιτούμενα χαρακτηριστικά:
src - Το οποίο καθορίζει τη διαδρομή προς την εικόνα
alt - Το οποίο καθορίζει ένα εναλλακτικό κείμενο για την εικόνα
17
Multiple Choice
src - Καθορίζει τη διαδρομή προς την εικόνα
ΣΩΣΤΟ
ΛΑΘΟΣ
18
Multiple Choice
alt - Καθορίζει μια εναλλακτική εικόνα σε περίπτωση που η εικόνα δεν μπορεί να διαβαστεί
ΣΩΣΤΟ
ΛΑΘΟΣ
19
Multiple Choice
Το <img> tag είναι κενό, περιέχει μόνο χαρακτηριστικά και δεν έχει tag κλεισίματος.
ΣΩΣΤΟ
ΛΑΘΟΣ
20
Multiple Choice
Καθορίστε ένα εναλλακτικό κείμενο για την εικόνα.
Το εναλλακτικό κείμενο πρέπει να λέει "Smiley".
Το εναλλακτικό κείμενο είναι χρήσιμο όταν δεν είναι δυνατή η εμφάνιση της εικόνας
<img src="smiley.gif" alt="Smiley">
<img src="smiley.gif" text="Smiley">
21
Multiple Choice
Γιατί πρέπει να χρησιμοποιείται το χαρακτηριστικό alt σε ένα στοιχείο εικόνας HTML;
Για να βρείτε μια εναλλακτική εικόνα εάν αυτή που θέλετε δεν λειτουργεί
Για να στείλετε το χρήστη σε άλλη ιστοσελίδα όπου μπορεί να βρει τη σωστή εικόνα
Είναι μια σύντομη περιγραφή μιας εικόνας εάν για κάποιο λόγο ο χρήστης δεν μπορεί να δει την εικόνα
22
Multiple Choice
Ποια ετικέτα πρέπει να χρησιμοποιηθεί για να συμπεριλάβει την ακόλουθη εικόνα: cat.jpeg;
<img src="cats.jpg" alt="cat"/>
<img src="cat.jpeg" alt="cat"/>
<img src="cat.JPG" alt="cat"/>
23
Multiple Choice
Τι πρέπει να αλλάξω σχετικά με αυτήν την ετικέτα για να αλλάξω την εικόνα που θα εμφανίζεται;
<img src="cat.jpeg" alt="cat jumping"/>
cat.jpeg
cat jumping
24
Fill in the Blanks
Type answer...
25
Μέγεθος εικόνας - πλάτος και ύψος
Μπορείτε να χρησιμοποιήσετε το χαρακτηριστικό style για να καθορίσετε το πλάτος και το ύψος μιας εικόνας.
<img src="img_girl.jpg" alt="εδώ ειναι μια εικόνα" style="width:500px;height:600px;">
ή
απλά τα χαρακτηριστικά width και height
<img src="img_girl.jpg" alt="εδώ ειναι μια εικόνα" width="500" height="600">
26
Fill in the Blanks
Type answer...
Μια μικρή επανάληψη
Show answer
Auto Play
Slide 1 / 26
SLIDE
Similar Resources on Wayground
19 questions
Cấu trúc rẽ nhánh (câu lệnh điều kiện, câu lệnh if)
Presentation
•
8th Grade
20 questions
Inequalities Intro
Presentation
•
8th Grade
20 questions
Post WWII and Modern Georgia DT #1 Remediation Lesson
Presentation
•
8th Grade
19 questions
Problem Solving in Class VIII
Presentation
•
8th Grade
23 questions
Reflection on the Coordinate Plane
Presentation
•
8th Grade
22 questions
Java 6
Presentation
•
8th Grade
17 questions
Past Continuous and Past Simple
Presentation
•
8th Grade
20 questions
Sắp xếp và lọc dữ liệu
Presentation
•
7th Grade
Popular Resources on Wayground
25 questions
The Ultimate College Knowledge Quiz
Quiz
•
8th Grade
20 questions
Math Review
Quiz
•
3rd Grade
15 questions
Fast food
Quiz
•
7th Grade
20 questions
Math Review
Quiz
•
6th Grade
20 questions
Context Clues
Quiz
•
6th Grade
20 questions
Inferences
Quiz
•
4th Grade
19 questions
Classifying Quadrilaterals
Quiz
•
3rd Grade
20 questions
Figurative Language Review
Quiz
•
6th Grade
Discover more resources for Computers
25 questions
The Ultimate College Knowledge Quiz
Quiz
•
8th Grade
17 questions
guess the logo
Quiz
•
8th Grade
10 questions
Candy
Quiz
•
4th - 8th Grade
10 questions
Fact Check Ice Breaker: Two truths and a lie
Quiz
•
5th - 12th Grade
20 questions
Summer Trivia
Quiz
•
8th Grade
20 questions
summer trivia
Quiz
•
8th Grade
15 questions
8th Unit 8 : Unit Review Game
Quiz
•
8th Grade
15 questions
Middle School Fun Trivia Questions
Quiz
•
7th - 8th Grade