Ενδεικτικές ερωτήσεις 1. Τι σημαίνουν τα αρχικά CSS 2. Τι σημαίνουν τα αρχικά HTML 3. Ποια η διαφορά μεταξύ Internet και Web; a. Είναι το ίδιο b. Το Web είναι μια υπηρεσία του διαδικτύου 4. Ποια η διαφορά μεταξύ HTML και HTTP; a. Είναι το ίδιο b. Το HTTP περιγράφει μια σελίδα ενώ η HTML επιτρέπει την επικοινωνία του χρήστη με τη σελίδα. c. Η HTML περιγράφει μια σελίδα ενώ το HTTP επιτρέπει την επικοινωνία του χρήστη με τη σελίδα. 5. Είναι δυνατόν μια ιστοσελίδα να έχει μόνο HTML και όχι CSS 6. Είναι δυνατόν μια ιστοσελίδα να έχει μόνο CSS και όχι HTML 7. Ποιο από τα παρακάτω είναι σωστό; a. < link type="javascript" href="styles.css" > b. < link style="styles.css" > c. < link rel="stylesheet" href="styles.css" > d. < style a href="styles.css" style > 8. Πώς βάζω σχόλια σε ένα αρχείο CSS; a. / comment text \ b. /* comment text */ c. /* comment text /* 9. Πώς βάζω σχόλια σε ένα αρχείο HTML; a. <!-- comment text -- > b. <* comment text *> c. /* comment text /* 10. Μπορούν τα σχόλια να εκτείνονται σε περισσότερες από μία γραμμές; 11. Ποια από τις παρακάτω CSS ρυθμίσεις αλλάζει το χρώμα του κειμένου σε μπλε; a. font color = blue b. text color blue c. color: blue; d. font-color-blue; 12. Ποια από τα παρακάτω είναι σωστές ρυθμίσεις για το border; a. border-weight b. border-color c. border-style d. border-height e. border-width 13. Δίνεται ο παρακάτω κώδικας 1. <body> 2. <header> 3. <h1> My Page </h1> 4. </header> 5. <section>
6. <h2> My Content </h2> 7. <p> This is where my page's content will be </p> 8. </section> 9. </body> Και το CSS: 1. body { 2. color: green; 3. 4. header { 5. background-color: blue; 6. 7. section { 8. font-weight: bold; 9. 10. p { 11. text-decoration: underline; 12. a. Ποια μορφοποίηση θα έχει το κείμενο της παραγράφου <p>; b. Ποια μορφοποίηση θα έχει το κείμενο της επικεφαλίδας 1 <h1> 14. Θέλω να καταχωρίσω ρυθμίσεις για κλάση με όνομα navlinks. Ποια είναι η σωστή δήλωση στο αρχείο CSS; a. *navlinks { b. :navlinks { c..navlinks { d. #navlinks { 15. Ποια ψευδοκλάση θα χρησιμοποιήσετε για να μορφοποιήσετε links όταν περνάει το ποντίκι πάνω από αυτά; a. visited b. hover c. active d. focus 16. Ποια είναι η διαφορά ανάμεσα στις δύο ρυθμίσεις; p a { color: red; p, a { color: red; a. Είναι ακριβώς οι ίδιες b. Η πρώτη ρύθμιση αλλάζει όλα τα links που βρίσκονται μέσα σε παραγράφους σε κόκκινα ενώ η δεύτερη αλλάζει όλες τα κείμενα των παραγράφων και τα links της σελίδας σε κόκκινα.
c. Η πρώτη ρύθμιση αλλάζει σε κόκκινα όλα τα κείμενα των παραγράφων και η δεύτερη όλα τα links. 17. Δίνεται ο παρακάτω κώδικας 1. <!DOCTYPE html> 2. <html lang="en"> 3. <head> 4. <meta charset="utf-8"> 5. <title>my HTML page</title> 6. <link rel="stylesheet" href="style.css"> 7. </head> 8. <body> 9. <p>paragraph 1</p> 10. <article> 11. <p id="paragraph1">paragraph 2</p> 12. <p>paragraph 3</p> 13. </article> 14. </body> 15. </html> 1. body { 2. color: red; 3. 4. article { 5. color: blue; 6. 7. #paragraph1 { 8. color: green; 9. a. Τι χρώμα θα έχει το κείμενο paragraph1; b. Τι χρώμα θα έχει το κείμενο paragraph2; c. Τι χρώμα θα έχει το κείμενο paragraph3; 18. Δίνεται ο παρακάτω κώδικας <article> <img src="images/mypic.jpg" alt="a boy raises his hand in a classroom" /> <p>this is the test I would like to surround my image. This text is sitting to the right of my image, and the image is touching the left of the window. </p> </article> Και το αποτέλεσμα
a. Ποια ρύθμιση έγινε στην εικόνα; i. p { float: left; ii. img { float: left; iii. p { float: right; iv. img { float: right; 19. Δίνεται ο παρακάτω κώδικας <ul> <li>amsterdam</li> <li>bangkok</li> <li>cairo</li> <li>dubai</li> </ul> Και η ρύθμιση li { float: left; a. Πώς θα εμφανιστεί στην οθόνη; i. Dubai Cairo Bangkok Amsterdam ii. Amsterdam Bangkok Cairo Dubai iii. Cairo Dubai Amsterdam Bangkok iv. Bangkok Cairo Dubai Amsterdam 20. Αν άλλαζε η ρύθμιση σε li { float: right; τι από τα παραπάνω θα εμφανιζόταν; 21. Ποια από τα παρακάτω είναι έγκυρα tag της HTML a. < html > b. < headers > c. < middle > d. < section > e. < img > f. < list > 22. Ποιο κείμενο θα γίνει πράσινο με τον παρακάτω κανόνα; article p a:hover { color: green; 23. Ποιο type είναι κατάλληλο σε μια εντολή INPUT έτσι ώστε ο χρήστης να μπορεί να φορτώσει μια φωτογραφία; a. type="file" b. type="upload" c. type="image" d. type="submit" 24. Με ποια CSS ιδιότητα αλλάζουμε τη γραμματοσειρά ενός κειμένου; a. font b. text c. font-family 25. Ποια είναι η σωστή σύνδεση μιας υπερσύνδεσης (link);
a. <a>http://www.website.com</a> b. <a href>http://www.website.com</a> c. <a url>http://www.website.com</a> d. <a name>http://www.website.com</a>