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
24 questions
PBIS-HGMS Day 10
Quiz
•
6th - 8th Grade
10 questions
HCS SCI 03 Summer School Review 3
Quiz
•
3rd Grade
11 questions
Home Scope
Quiz
•
7th - 8th Grade
15 questions
HCS SCI 05 Summer School Assessment 3 Review
Quiz
•
5th Grade
35 questions
Lufkin Road Middle School Student Handbook & Policies Assessment
Quiz
•
7th Grade
18 questions
Geo 11.3 Area of Circles and Sectors
Quiz
•
9th - 11th Grade