Ετικέτα: άσκηση

Σας δίνεται ο παρακάτω κώδικας HTML που εμφανίζει κάποιες πληροφορίες από την Βικιπαιδεία.

Να κάνετε τις κατάλληλες αλλαγές στον κώδικα και να προσθέσετε τον κώδικα CSS ώστε:

1. Οι εικόνες να εμφανίζονται στο πλάι του κειμένου, αριστερά και δεξιά εναλλάξ.
2. Όλες οι εικόνες να έχουν άσπρη κορνίζα 10px με χρωματιστό πλαίσιο.
3. Η πρώτη παράγραφος (“Από τη Βικιπαίδεια, την ελεύθερη εγκυκλοπαίδεια”) να εμφανίζεται με μικρότερα, πλάγια γράμματα.
4. Οι παράγραφοι και οι επικεφαλίδες να έχουν αριστερό περιθώριο 20px.

Μπορείτε να χρησιμοποιήσετε κάποιο από τα ακόλουθα εργαλεία δοκιμής κώδικα:

• https://jsfiddle.net/
• http://www.cssdesk.com/
• https://codepen.io/pen/

<h1>Πρωτεύοντα</h1>
 <p>Από τη Βικιπαίδεια, την ελεύθερη εγκυκλοπαίδεια</p>
 <img src="https://upload.wikimedia.org/wikipedia/commons/thumb/9/9a/Olive_baboon1.jpg/300px-Olive_baboon1.jpg">
 <p>Πρωτεύον ονομάζεται κάθε μέλος της βιολογικής τάξης Πρωτεύοντα (Primates), της ομάδας που περιλαμβάνει τους προσιμιίδες (στους οποίους συγκαταλέγονται οι λεμούριοι, οι λόρις, οι γαλάγοι και οι τάρσιοι) και τους σιμιίδες (μαϊμούδες και πίθηκοι). Με εξαίρεση τους ανθρώπους, οι οποίοι κατοικούν σε όλες τις ηπείρους της Γης, τα περισσότερα πρωτεύοντα ζουν σε τροπικές ή υποτροπικές περιοχές της Αμερικής, της Αφρικής και της Ασίας. Ορισμένα από τα πρωτεύοντα που έχουν εξαφανιστεί είναι ο Αρχαιοΐντρις (ένας λεμούριος μεγαλύτερος από τον ασημόρραχο γορίλα) και οι οικογένειες Παλαιοπροπιθηκίδες και Αρχαιολεμουρίδες. </p>
 <p>Τα πρωτεύοντα ποικίλουν σε μέγεθος, από τον λεμούριο ποντικό της Μαντάμ Μπερθ των 30 γραμμαρίων, μέχρι τον Ορεινό Γορίλα των 200 κιλών. Σύμφωνα με απολιθώματα που έχουν εντοπιστεί, πρόγονοι των πρωτευόντων πιθανότατα έζησαν 65 εκατομμύρια χρόνια πριν κατά την ύστερη Κρητιδική περίοδο. Το παλαιότερο γνωστό πρωτεύον βάσει των απολιθωμάτων που έχουν βρεθεί μέχρι σήμερα ήταν ο Πλησιαδάπης που έζησε 55-58 εκατομμύρια χρόνια πριν, κατά την ύστερη Παλαιόκαινο εποχή. Έρευνες πάνω στο μοριακό ρολόι, υποδεικνύουν πως ο διαχωρισμός των πρωτευόντων ίσως έγινε πολύ παλαιότερα, πιθανότατα κατά τη μέση-Κρητιδική, 85 εκατομμύρια χρόνια πριν. </p>
 <h2>Εξελικτική ιστορία</h2>
 <img src="https://upload.wikimedia.org/wikipedia/commons/thumb/9/90/Katta_Lemur_catta.jpg/170px-Katta_Lemur_catta.jpg">
 <p>Η τάξη των Πρωτευόντων είμαι τμήμα του κλάδου Ευαρχοντομυωξοί, ο οποίος ανήκει στον κλάδο Ευθήρια, μέρος της ομοταξίας των Θηλαστικών. Πρόσφατη μοριακή γενετική έρευνα στα πρωτεύοντα, τα δερμόπτερα και τις δενδρομυγαλές έδειξε πως τα δερμόπτερα συγγενεύουν περισσότερο με τα πρωτεύοντα απ' ό,τι με τις δενδρομυγαλές, παρόλο που τα τελευταία θεωρούνταν για ένα διάστημα στο παρελθόν μέλη των πρωτευόντων. Αυτές οι τρεις τάξεις σχηματίζουν τον κλάδο των Ευάρχοντων. Ο κλάδος ολοκληρώνεται με τους Μυωξούς (ο οποίος περιλαμβάνει τα Τρωκτικά και τα Λαγόμορφα) σχηματίζοντας τον κλάδο των Ευαρχοντομυωξών. Τα Ευάρχοντα και οι Ευαρχοντομυωξοί αποκαλούνται μερικές φορές υπερτάξεις. Πολλοί επιστήμονες θεωρούν τα δερμόπτερα υποτάξη των πρωτευόντων και αποκαλούν την υπόταξη με τα «πραγματικά» πρωτεύοντα ευπρωτεύοντα. </p>
 <h2>Εξέλιξη</h2>
 <p>Η εξελικτική πορεία των πρωτευόντων εκτιμάται πως άρχισε 65 εκατομμύρια χρόνια πριν, παρόλο που το παλαιότερο γνωστό πρωτεύον, ο Πλησιαδάπης, (π. 55–58 εκ. χρόνια πριν) έζησε κατά την Ύστερη Παλαιόκαινο. Άλλες έρευνες, όπως αυτές στο μοριακό ρολόι των πρωτευόντων, υποστηρίζουν πως ο κλάδος των πρωτευόντων εμφανίστηκε 85 εκατομμύρια χρόνια πριν, κατά τη Μέση Κρητιδική. </p>
 <img src=" https://upload.wikimedia.org/wikipedia/commons/thumb/5/54/Primates-drawing.jpg/170px-Primates-drawing.jpg">
 <p>Σύμφωνα με τη σύγχρονη κλαδιστική, η τάξη των Πρωτευόντων είναι μονοφυλετική. Η υποτάξη Στρεψίρρινοι, πιστεύεται πως διαχωρίστηκε από την πρωτόγονη εξελικτική πορεία των Πρωτευόντων 63 εκατομμύρια χρόνια πριν, παρόλο που παλαιότερες χρονολογίες έχουν επίσης προταθεί. Από τις επτά οικογένειες των στρεψίρρινων, οι πέντε συσχετίζονται με τους λεμούριους, ενώ οι δύο οικογένειες που απομένουν περιλαμβάνουν τις λορισίδες και τους γαλάγους. Παλαιότερα συστήματα ταξινόμησης, τοποθετούσαν τους Λεπιλεμουρίδες στους Λεμουρίδες και τους Γαλαγίδες στους Λορισίδες, δημιουργώντας έτσι μία διαίρεση τρία-δύο των οικογενειών σε αντίθεση με τη διαίρεση πέντε-δύο που παρουσιάζεται εδώ. </p>
 <p>Κατά την Ηώκαινο, στις περισσότερες βόρειες ηπείρους κυριαρχούσαν δύο ομάδες, τα αδαπίμορφα και οι ομομυΐδες. Τα πρώτα θεωρούνται μέλη των Στρεψίρρινων, αλλά δεν έχουν κτενωτά δόντια (toothcomb) όπως οι σύγχρονοι λεμούριοι (πρόσφατες έρευνες ταξινομούν τον Darwinius masillae σε αυτή την ομάδα). Τα τελευταία συσχετίζονται στενά με τους τάρσιους, τις μαϊμούδες και τους πιθήκους. Δεν είναι ακόμα ξεκάθαρο πως συνδέονται αυτές οι δύο ομάδες με τα σωζόμενα πρωτεύοντα. Οι Ομομυΐδες εξαφανίστηκαν περίπου 30 εκατομμύρια χρόνια πριν, ενώ οι Αδαπίδες επιβίωσαν μέχρι περίπου 10 εκατομμύρια χρόνια πριν. </p>
 <h2>Υβρίδια</h2>
 <img src="https://upload.wikimedia.org/wikipedia/commons/thumb/8/85/Tamarin_portrait_2_edit3.jpg/220px-Tamarin_portrait_2_edit3.jpg">
 <p>Αν και τα υβρίδια των πρωτευόντων εμφανίζονται συχνά σε αιχμαλωσία, υπάρχουν παραδείγματα υβριδισμού των πρωτευόντων και στη φύση. Ο υβριδισμός συμβαίνει όταν συμπίπτει το φάσμα δύο ειδών και προκύπτουν ζώνες υβριδισμού. Τα υβρίδια συνήθως δημιουργούνται όταν οι άνθρωποι τοποθετούν τα ζώα στους ζωολογικούς κήπους ή λόγω πιέσεων από το περιβάλλον όπως είναι το κυνήγι των αρπακτικών. Διαγενετικοί υβριδισμοί, δηλαδή υβρίδια διαφορετικών γενών, συναντώνται επίσης στη φύση. Παρόλο που ανήκουν σε γένη τα οποία είχαν διαχωριστεί εκατομμύρια χρόνια πριν, η διασταύρωση εξακολουθεί να είναι δυνατή μεταξύ των γελάδας και των μπαμπουίνων χαμαντρίας.</p>

Ακολουθήστε τα παρακάτω βήματα:

1. Μπείτε στoν πίνακα ελέγχου του ιστότοπου που έχετε στο wp.w3schools.gr.
2. Εάν δεν έχετε φτιάξει κανένα άρθρο ακόμα, δημιουργήστε ένα νέο άρθρο και βάλτε του μερικές παραγράφους τυχαίου κειμένου.
3. Ανοίξτε τον ιστότοπό σας σε μία δεύτερη καρτέλα, από το μενού στην κορυφή της σελίδας.
4. Στον πίνακα ελέγχου, επιλέξτε το μενού Εμφάνιση >> Custom CSS. Στη σελίδα που θα ανοίξει, μπορείτε να προσθέσετε κώδικα CSS.
5. Γράψτε τον κανόνα body {font-family:cursive;} και αποθηκεύστε τις αλλαγές.
6. Γυρίστε στη σελίδα σας και πατήστε “ανανέωση”. Τι συνέβη; Χρησιμοποιήστε τα εργαλεία διαχείρισης του φυλλομετρητή (browser) που ανοίγουν με το F12 για να εντοπίσετε τον κώδικα που μόλις προσθέσατε στη σελίδα.
7. Κάντε το ίδιο για τους 3 παρακάτω κανόνες:

• div#content {background-color: yellow;}
• div {border: 1px solid #0000FF;}
• p {
padding-left: 30px;
color: #FF0000;
background-color: rgba(50,10,90,0.7);
}