Σημαίες-εντολές για την εισαγωγή αντικειμένων πληροφοριών εκτός κειμένου σε κείμενο

ή — εντολή για εισαγωγή γραφικής εικόνας

— εντολή για εισαγωγή θραύσματος ήχου

— εντολή για την εισαγωγή ενός τμήματος βίντεο

Επιλογές γραφικών

WIDHT - πλάτος εικόνας σε pixel

HEIGHT - ύψος εικόνας σε pixel

ALIGN - στοίχιση (ALIGN=LEFT - στοίχιση στο αριστερό περιθώριο, ALIGN=RIGHT - στο δεξί περιθώριο, ALIGN=TOP - στο επάνω περίγραμμα, ALIGN=BOTTOM - στο κάτω περίγραμμα, ALIGN=MIDDLE ή CENTER - στο κέντρο )

HSPACE - οριζόντιος χώρος από τη γραφική εικόνα

VSPACE - κατακόρυφος χώρος

ALT - εναλλακτικό κείμενο, που χρησιμοποιείται για την ένδειξη μιας εικόνας

Εντολές για υπερσύνδεση με άλλα έγγραφα HTML και πόρους του Διαδικτύου

Καιή Και- υπερσυνδέσμους

 … 

ΚΑΙ

στοίχιση - χρησιμοποιείται για τον καθορισμό του τρόπου με τον οποίο τα δεδομένα μέσα στα κελιά μορφοποιούνται οριζόντια: μπορούν να ευθυγραμμιστούν προς τα δεξιά, αριστερά ή κεντραρισμένα άκρα.

valign - χρησιμοποιείται για τον καθορισμό του τρόπου με τον οποίο τα δεδομένα μέσα στα κελιά μορφοποιούνται κατακόρυφα: μπορούν να χωρέσουν στο επάνω, κάτω, στη μέση ή να έχουν μια κοινή γραμμή βάσης.

Τα συγκεκριμένα κελιά καθορίζονται χρησιμοποιώντας μια ετικέτα

πλάτος — ορίζει το πλάτος του κελιού.

colspan - καθορίζει πόσες στήλες πίνακα θα εκτείνεται το κελί.

rowspan - καθορίζει πόσες σειρές πίνακα θα εκτείνεται το κελί.

nowrap - Εάν έχει καθοριστεί αυτή η παράμετρος, τα περιεχόμενα των κελιών δεν θα τυλίγονται ώστε να χωρούν στο πλάτος του κελιού.

Το bgcolor είναι μια παράμετρος που υποστηρίζεται από τα σύγχρονα προγράμματα περιήγησης: καθορίζει το χρώμα φόντου του κελιού με τη μορφή μιας τριπλέτας rgb ή ενός συμβολικού ονόματος.

Μια άλλη ετικέτα για το σχεδιασμό κελιών πίνακα είναι η

align - υποδεικνύει τη θέση της κεφαλίδας: μπορεί να βρίσκεται στην κορυφή ή στο κάτω μέρος του πίνακα.

Κορνίζες (κορνίζες)

Ένα ισχυρό οπτικό βοήθημα είναι τα λεγόμενα κάδρα. Με τη βοήθεια πλαισίων, η περιοχή εμφάνισης του προγράμματος περιήγησης μπορεί να χωριστεί σε ξεχωριστά μέρη που περιέχουν διαφορετικά έγγραφα. Σε αυτήν την περίπτωση, είναι δυνατό να ορίσετε συνδέσεις μεταξύ πλαισίων, έτσι ώστε η επιλογή μιας σύνδεσης σε ένα πλαίσιο να οδηγεί στην εμφάνιση του ζητούμενου εγγράφου σε άλλο. Αυτό σας επιτρέπει να δημιουργείτε έγγραφα που είναι πολύ εύχρηστα (εάν χρησιμοποιηθούν λανθασμένα, μπορείτε επίσης να δημιουργήσετε πολύ άβολα). Επί του παρόντος, τα πλαίσια υποστηρίζονται στις πιο πρόσφατες εκδόσεις προγραμμάτων περιήγησης, όπως το netscape navigator (από την έκδοση 2.0) και το ms internet explorer (εκδόσεις 3.0 και νεότερες), αλλά η χρήση των πλαισίων αυξάνεται σε δημοτικότητα και φαίνεται ότι θα προστεθούν περισσότερα σε αυτά προγράμματα περιήγησης σύντομα.

Τα πλαίσια περιγράφονται σε ένα ειδικό έγγραφο HTML που ονομάζεται Έγγραφο Περιγραφής Πλαισίου. Αυτό το έγγραφο περιέχει μια περιγραφή του αριθμού, του μεγέθους και της θέσης των πλαισίων, καθώς και των διευθύνσεων URL των περιεχομένων τους. Δεν μπορείτε να προσπαθήσετε να χωρέσετε τα περιεχόμενα των πλαισίων στην περιγραφή, πρέπει να βρίσκονται σε ξεχωριστά έγγραφα.

Κατά την περιγραφή των πλαισίων, η ετικέτα αντικαταστάθηκε από ετικέτα

περιγραφές των περιεχομένων των πλαισίων

Η ετικέτα θα αγνοηθεί από το πρόγραμμα περιήγησης εάν προηγείται από τυχόν ετικέτες που κανονικά θα βρίσκονταν μέσα στην ετικέτα . Ετικέτες μπορεί να είναι ένθετα, γεγονός που επιτρέπει, όπως θα δει αργότερα ο Αναγνώστης, να δημιουργήσει πολύ περίπλοκες δομές. Επιλογές ετικέτας μπορεί να είναι ως εξής:

rows="x1,x2,... ή x1%,x2%,... ή x1*,x2*,..." - αυτή η παράμετρος περιγράφει τα πλαίσια ως σειρές διαφορετικών υψών. Τα ύψη καρέ καθορίζονται από μια λίστα τιμών διαχωρισμένων με κόμματα. Τα ύψη μετρώνται σε σημεία, ως ποσοστό του συνολικού ύψους της περιοχής προβολής ή ως σχετικές τιμές. Το άθροισμα των υψών όλων των πλαισίων πρέπει να είναι ίσο με το ύψος ολόκληρης της περιοχής προβολής. Εάν αυτό δεν συμβεί, τα ίδια τα προγράμματα περιήγησης προσαρμόζουν τις τιμές.

cols="x1,x2,... ή x1%,x2%,... ή *" - χρησιμοποιείται για να περιγράψει τα πλαίσια ως στήλες διαφορετικού πλάτους. Χρησιμοποιείται με τον ίδιο τρόπο όπως η παράμετρος σειρές.

θα ορίσει δύο οριζόντια πλαίσια, με το πρώτο (πάνω) να είναι τρεις φορές υψηλότερο από το δεύτερο (κάτω).

θα ορίσει τρία οριζόντια πλαίσια, με το πρώτο (πάνω) να έχει ύψος 100 πόντους, το τρίτο (κάτω) να έχει ύψος 50 πόντους και το δεύτερο (μεσαίο) να καταλαμβάνει όλο τον υπόλοιπο χώρο.

θα ορίσει δύο κατακόρυφα πλαίσια, με το πρώτο (αριστερά) να έχει πλάτος 70% του συνολικού πλάτους της περιοχής προβολής και το δεύτερο (δεξιά) - 30%.

Η ετικέτα χρησιμοποιείται για να ορίσετε τα περιεχόμενα του πλαισίου . Οι παράμετροι μπορεί να είναι οι εξής:

src - καθορίζει τη διεύθυνση url του εγγράφου που πρέπει να εμφανίζεται στο πλαίσιο. Εάν η παράμετρος δεν έχει καθοριστεί, το πλαίσιο θα παραμείνει κενό.

όνομα - η τιμή αυτής της παραμέτρου καθορίζει το όνομα για το πλαίσιο. Στη συνέχεια, το πλαίσιο μπορεί να αναφέρεται με αυτό το όνομα χρησιμοποιώντας την παράμετρο ετικέτας στόχου .

κύλιση - δείχνει εάν είναι δυνατή η κύλιση των περιεχομένων του εγγράφου στο πλαίσιο. Μπορεί να λάβει τις ακόλουθες τιμές:

ναι—Μπορείτε να κάνετε κύλιση στα περιεχόμενα του πλαισίου.

όχι—δεν είναι δυνατή η κύλιση των περιεχομένων του πλαισίου.

auto - το πρόγραμμα περιήγησης αποφασίζει εάν θα εμφανίσει τη γραμμή κύλισης ή όχι (με βάση το μήκος του εγγράφου). Αυτή η τιμή χρησιμοποιείται από προεπιλογή.

noresize - εάν έχει καθοριστεί αυτή η παράμετρος, ο χρήστης δεν θα μπορεί να αλλάξει το μέγεθος του πλαισίου. Από προεπιλογή, ο χρήστης ΜΠΟΡΕΙ να αλλάξει το μέγεθος των εμφανιζόμενων πλαισίων (π.χ. σύροντας το περίγραμμα του πλαισίου με μια συσκευή κατάδειξης).

marginwiph - υποδεικνύει την ποσότητα του οριζόντιου περιθωρίου μέσα στο πλαίσιο.

marginheight - υποδηλώνει την ποσότητα του κατακόρυφου περιθωρίου μέσα στο πλαίσιο.

marginwidth=5>

ονομάζει το πλαίσιο myframe1 και εμφανίζει το αρχείο1.html σε αυτό, χωρίς να εμφανίζεται γραμμή κύλισης, το πλάτος της οριζόντιας επένδυσης έχει οριστεί σε 5 σημεία και ο χρήστης είναι ελεύθερος να αλλάξει το μέγεθος του πλαισίου.

Πιο πλήρες παράδειγμα:

αντιστοιχεί περίπου στην ακόλουθη διάταξη πλαισίων στην περιοχή εμφάνισης:

Παράδειγμα διάταξης πλαισίου

Τι συμβαίνει εάν το πρόγραμμα περιήγησης δεν κατανοεί το πλαίσιο; Ο χρήστης βλέπει μια εντελώς κενή οθόνη και δεν μπορεί να φτάσει στις πληροφορίες που χρειάζεται. Πώς να βεβαιωθείτε ότι δεν θα προκύψει μια τέτοια κατάσταση; Οι προγραμματιστές επεκτάσεων περίμεναν αυτήν την κατάσταση και κατέληξαν σε μια ετικέτα της οποίας τα περιεχόμενα δεν εμφανίζονται ποτέ σε πρόγραμμα περιήγησης που κατανοεί το πλαίσιο, ενώ ένα "ηλίθιο" πρόγραμμα περιήγησης, βλέποντας μια άγνωστη ετικέτα, θα εμφανίσει ειλικρινά το περιεχόμενό της χωρίς να χρησιμοποιήσει κανένα κόλπο. Αυτή η ετικέτα ονομάζεται

Για την οργάνωση των συνδέσεων μεταξύ πλαισίων, οι προγραμματιστές έχουν παράσχει την παράμετρο στόχο για την ετικέτα . Μπορεί επίσης να χρησιμοποιηθεί σε ετικέτες , Και

.

Χαρτογραφημένες εικόνες

Ένα πολύ ισχυρό μέσο οργάνωσης συνδέσμων υπερκειμένου είναι οι λεγόμενες «χαρτογραφημένες εικόνες» (imagemaps). Είναι εικόνες με ευαίσθητες περιοχές, δηλαδή η ανάδειξη διαφορετικών τμημάτων της εικόνας με συσκευή κατάδειξης έχει ως αποτέλεσμα την κίνηση μέσω του υπερκειμένου προς διαφορετικές «κατευθύνσεις».

Οι αντιστοιχισμένες εικόνες διατίθενται σε δύο τύπους: υποβάλλονται σε επεξεργασία στον διακομιστή (από την πλευρά του διακομιστή) ή στον πελάτη (από την πλευρά του πελάτη).

Για να δημιουργήσετε χάρτες στην πλευρά του πελάτη, καλείται μια ετικέτα html

πού είναι οι παράμετροι της ετικέτας μπορεί να είναι έτσι:

shape - Καθορίζει το σχήμα της ενεργής περιοχής για τον χάρτη. Μπορεί να λάβει τις τιμές ορθογώνιο, κύκλο, πολυ, προεπιλογή, που αντιστοιχούν σε ορθογώνιες, κυκλικές, πολυγωνικές και προεπιλεγμένες περιοχές, αντίστοιχα. Όλοι οι τύποι περιοχών, εκτός από την προεπιλογή, απαιτούν τον καθορισμό συντεταγμένων στο χαρακτηριστικό coords.

συντεταγμένες - καθορίζει τις συντεταγμένες των περιοχών. Ανάλογα με τον τύπο της περιοχής, μπορεί να έχει την ακόλουθη μορφή: για ορθογώνιο—οι τιμές συντεταγμένων της επάνω αριστερής και της κάτω δεξιάς γωνίας, ("x1,y1,x2,y2"). για ένα κυκλικό ένα-κεντρικές συντεταγμένες και ακτίνα (“x,y,r”). για ένα πολυγωνικό—μια λίστα συντεταγμένων κορυφής ("x1,y1,x2,y2,x3,y3,...");

href - ορίζει τη διεύθυνση url στην οποία αναφέρεται αυτή η περιοχή.

noref - υποδηλώνει ότι η περιοχή είναι "νεκρή", δηλαδή δεν υπάρχει σύνδεσμος κρυμμένος πίσω από αυτήν.

Για να χρησιμοποιήσετε έναν τοπικό χάρτη σε μια εικόνα στην παράμετρο usemap της ετικέτας πρέπει να καθορίσετε το όνομα της κάρτας. Για παράδειγμα:

"http://www.yaxy.ru/rect/">

"http://www.yaxy.ru/circle">

href="http://www.yaxy.ru/poly">

height=”480″ usemap=”#mymap”>

θα δώσει περίπου τον παρακάτω χάρτη στην εικόνα:

Παράδειγμα χάρτη στην εικόνα

Προκειμένου να δημιουργηθεί μια κάρτα που υποβάλλεται σε επεξεργασία στον διακομιστή, απαιτείται διοικητική παρέμβαση, καθώς το αρχείο διαμόρφωσης στον διακομιστή θα πρέπει να αλλάξει για τη μονάδα cgi για την επεξεργασία πληροφοριών από την κάρτα.

Όταν χρησιμοποιείτε διαφορετικούς διακομιστές Ιστού, η μορφή της περιγραφής του χάρτη στον διακομιστή ενδέχεται να διαφέρει. Οι δύο πιο κοινές μορφές προέρχονται από τους διακομιστές ncsa και cern http. Ας δώσουμε ένα παράδειγμα χρήσης κάρτας με τον διακομιστή ncsa httpd.

Στην πλευρά του διακομιστή, το αρχείο (για παράδειγμα) /usr/local/etc/httpd/conf/imagemap.conf:

# αυτός είναι ένας χάρτης για διακομιστή ncsa

test_map: /home/joe/public_html/maps/test.map

Μπορείτε να χρησιμοποιήσετε αυτήν την κάρτα κάπως έτσι:

ύψος=200 ismap>

Έντυπα

Σε τι χρησιμεύουν τα έντυπα;

Μια φόρμα είναι ένα εργαλείο με το οποίο ένα έγγραφο HTML μπορεί να στείλει κάποιες πληροφορίες σε κάποιο προκαθορισμένο σημείο στον έξω κόσμο, όπου οι πληροφορίες θα υποβληθούν σε επεξεργασία με κάποιο τρόπο.

Είναι πολύ πιο εύκολο να δημιουργήσετε μια φόρμα από εκείνο το «σημείο στον έξω κόσμο» στο οποίο η φόρμα θα στείλει πληροφορίες. Στις περισσότερες περιπτώσεις, ένα τέτοιο "σημείο" είναι ένα πρόγραμμα γραμμένο σε Perl ή C. Τα προγράμματα που επεξεργάζονται δεδομένα που υποβάλλονται από φόρμες ονομάζονται συχνά σενάρια CGI. Το ακρωνύμιο CGI σημαίνει Common Gateways Interface. Η σύνταξη σεναρίων CGI στις περισσότερες περιπτώσεις απαιτεί καλή γνώση της κατάλληλης γλώσσας προγραμματισμού και των δυνατοτήτων του λειτουργικού συστήματος Unix.

Πρόσφατα, η γλώσσα PHP/FI έχει αποκτήσει κάποια δημοτικότητα, οι οδηγίες της οποίας μπορούν να ενσωματωθούν απευθείας σε έγγραφα HTML (τα έγγραφα αποθηκεύονται ως αρχεία με την επέκταση *.pht ή *.php).

Οι φόρμες μεταβιβάζουν πληροφορίες στα προγράμματα χειριστή με τη μορφή ζευγών [όνομα μεταβλητής]=[τιμή μεταβλητής]. Τα ονόματα των μεταβλητών πρέπει να προσδιορίζονται με λατινικά γράμματα. Οι μεταβλητές τιμές αντιμετωπίζονται ως συμβολοσειρές από τους χειριστές, ακόμα κι αν περιέχουν μόνο αριθμούς.

Πώς λειτουργεί η φόρμα

Η φόρμα ανοίγει με μια ετικέτα και τελειώνει με ένα σημάδι. Ένα έγγραφο HTML μπορεί να περιέχει πολλές φόρμες, αλλά οι φόρμες δεν πρέπει να βρίσκονται η μία μέσα στην άλλη. Το κείμενο HTML, συμπεριλαμβανομένων των ετικετών, μπορεί να τοποθετηθεί μέσα σε φόρμες χωρίς περιορισμούς.

Επιγραφή

μπορεί να περιέχει τρία χαρακτηριστικά, ένα από τα οποία απαιτείται. Αυτά είναι τα χαρακτηριστικά:

Απαιτούμενο χαρακτηριστικό. Καθορίζει πού βρίσκεται ο χειριστής φόρμας.

Καθορίζει τον τρόπο (με άλλα λόγια, χρησιμοποιώντας ποια μέθοδο πρωτοκόλλου μεταφοράς υπερκειμένου) τα δεδομένα από τη φόρμα θα μεταφερθούν στον χειριστή. Οι έγκυρες τιμές είναι METHOD=POST και METHOD=GET. Εάν η τιμή του χαρακτηριστικού δεν έχει οριστεί, η METHOD=GET θεωρείται από προεπιλογή.

Καθορίζει τον τρόπο με τον οποίο θα κωδικοποιηθούν τα δεδομένα από τη φόρμα για μετάδοση στον χειριστή. Εάν η τιμή του χαρακτηριστικού δεν έχει οριστεί, η προεπιλογή είναι ENCTYPE=application/x-www-form-urlencoded.

Η πιο απλή μορφή

Για να ξεκινήσει η διαδικασία μεταφοράς δεδομένων από τη φόρμα στον χειριστή, χρειάζεται κάποιο είδος ελέγχου. Η δημιουργία ενός τέτοιου σώματος ελέγχου είναι πολύ απλή:

Έχοντας συναντήσει μια τέτοια γραμμή μέσα στη φόρμα, το πρόγραμμα περιήγησης θα σχεδιάσει ένα κουμπί στην οθόνη με την επιγραφή Υποβολή (διαβάστε "υποβολή" με έμφαση στη δεύτερη συλλαβή, από το αγγλικό "submit"), όταν κάνετε κλικ, όλα τα δεδομένα είναι διαθέσιμα σε η φόρμα θα μεταφερθεί στον χειριστή που ορίζεται στην ετικέτα .

Η επιγραφή στο κουμπί μπορεί να ρυθμιστεί όπως θέλετε εισάγοντας το χαρακτηριστικό VALUE=”[Επιγραφή]” (διαβάστε το “value” με έμφαση στην πρώτη συλλαβή, από το αγγλικό “value”), για παράδειγμα:

Τώρα γνωρίζουμε αρκετά για να γράψουμε την απλούστερη φόρμα. Δεν θα συλλέξει δεδομένα, αλλά απλώς θα σας επιστρέψει στην κορυφή της σελίδας.

Η πιο απλή μορφή

Η επιγραφή που τοποθετείται στο κουμπί μπορεί, εάν είναι απαραίτητο, να μεταβιβαστεί στον χειριστή εισάγοντας το χαρακτηριστικό NAME=[όνομα] στον ορισμό του κουμπιού (διαβάστε "όνομα", από τα αγγλικά "όνομα"), για παράδειγμα:

Όταν κάνετε κλικ σε ένα τέτοιο κουμπί, ο χειριστής, μαζί με όλα τα άλλα δεδομένα, θα λάβει μια μεταβλητή κουμπιού με την τιμή Let's go!.

Μια φόρμα μπορεί να έχει πολλά κουμπιά υποβολής με διαφορετικά ονόματα ή/και τιμές. Ο χειριστής μπορεί έτσι να ενεργήσει διαφορετικά ανάλογα με το κουμπί υποβολής που έκανε ο χρήστης.

Πώς η φόρμα συλλέγει δεδομένα

Υπάρχουν και άλλα είδη στοιχείων . Κάθε στοιχείο πρέπει να περιλαμβάνει το χαρακτηριστικό NAME=[όνομα], το οποίο καθορίζει το όνομα του στοιχείου (και, κατά συνέπεια, το όνομα της μεταβλητής που θα μεταβιβαστεί στον χειριστή). Το όνομα πρέπει να δηλώνεται μόνο με λατινικά γράμματα. Τα περισσότερα είδη πρέπει να περιλαμβάνει ένα χαρακτηριστικό VALUE="[value]" που καθορίζει την τιμή που θα μεταβιβαστεί στον χειριστή με αυτό το όνομα. Για στοιχεία Και , ωστόσο, αυτό το χαρακτηριστικό είναι προαιρετικό επειδή η τιμή της αντίστοιχης μεταβλητής μπορεί να εισαχθεί από τον χρήστη χρησιμοποιώντας το πληκτρολόγιο.

Βασικοί τύποι στοιχείων :

Ορίζει ένα παράθυρο για την εισαγωγή μιας γραμμής κειμένου. Μπορεί να περιέχει πρόσθετα χαρακτηριστικά SIZE=[αριθμός] (πλάτος του παραθύρου εισαγωγής σε χαρακτήρες) και MAXLENGTH=[αριθμός] (μέγιστο επιτρεπόμενο μήκος της συμβολοσειράς εισαγωγής σε χαρακτήρες). Παράδειγμα:

Ορίζει ένα παράθυρο 20 χαρακτήρων για την εισαγωγή κειμένου. Από προεπιλογή, το παράθυρο περιέχει το κείμενο Ivan, το οποίο μπορεί να επεξεργαστεί ο χρήστης. Το επεξεργασμένο (ή μη επεξεργασμένο) κείμενο μεταβιβάζεται στον χειριστή στη μεταβλητή χρήστη.

Ορίζει ένα παράθυρο για την εισαγωγή κωδικού πρόσβασης. Απολύτως παρόμοιο με τον τύπο κειμένου, μόνο που αντί για σύμβολα του εισαγόμενου κειμένου εμφανίζει αστερίσκους (*) στην οθόνη. Παράδειγμα:

Ορίζει ένα παράθυρο 20 χαρακτήρων για την εισαγωγή κωδικού πρόσβασης. Το μέγιστο επιτρεπόμενο μήκος κωδικού πρόσβασης είναι 10 χαρακτήρες. Ο εισαγόμενος κωδικός πρόσβασης μεταβιβάζεται στον χειριστή στη μεταβλητή pw.

Ορίζει ένα κουμπί επιλογής. Μπορεί να περιέχει ένα πρόσθετο επιλεγμένο χαρακτηριστικό (υποδεικνύει ότι το κουμπί είναι επιλεγμένο). Σε μια ομάδα κουμπιών επιλογής με τα ίδια ονόματα, μπορεί να υπάρχει μόνο ένα κουμπί επιλογής με ετικέτα. Παράδειγμα:

9600 bps

14400 bps

28800 bps

Καθορίζει μια ομάδα τριών κουμπιών επιλογής με την ένδειξη 9600 bps, 14400 bps και 28800 bps. Το πρώτο από τα κουμπιά φέρει αρχικά ετικέτα. Εάν ο χρήστης δεν ελέγξει ένα άλλο κουμπί, μια μεταβλητή μόντεμ με τιμή 9600 θα μεταβιβαστεί στον χειριστή.

Ορίζει ένα τετράγωνο στο οποίο μπορεί να γίνει ένα σημάδι. Μπορεί να περιέχει ένα επιπλέον επιλεγμένο χαρακτηριστικό (υποδεικνύει ότι το τετράγωνο είναι επιλεγμένο). Σε αντίθεση με τα κουμπιά επιλογής, μια ομάδα τετραγώνων με το ίδιο όνομα μπορεί να έχει πολλαπλά τετράγωνα με ετικέτα. Παράδειγμα:

Προσωπικοί υπολογιστές

Σταθμοί εργασίας

Διακομιστές τοπικών δικτύων

Διακομιστές Διαδικτύου

Ορίζει μια ομάδα τεσσάρων τετραγώνων. Το δεύτερο και το τέταρτο τετράγωνο σημειώνονται αρχικά. Εάν ο χρήστης δεν κάνει αλλαγές, δύο μεταβλητές θα περάσουν στον χειριστή: comp=WS και comp=IS.

Καθορίζει ένα κρυφό στοιχείο δεδομένων που δεν είναι ορατό στον χρήστη κατά τη συμπλήρωση της φόρμας και μεταβιβάζεται στο πρόγραμμα χειρισμού αμετάβλητο. Μερικές φορές είναι χρήσιμο να υπάρχει ένα τέτοιο στοιχείο σε μια φόρμα που επανασχεδιάζεται από καιρό σε καιρό, έτσι ώστε ο χειριστής να γνωρίζει με ποια έκδοση της φόρμας ασχολείται. Μπορείτε εύκολα να καταλήξετε σε άλλες πιθανές χρήσεις μόνοι σας. Παράδειγμα:

Καθορίζει μια κρυφή μεταβλητή έκδοσης που μεταβιβάζεται στον χειριστή με την τιμή 1.1.

Ορίζει ένα κουμπί που, όταν πατηθεί, επιστρέφει τη φόρμα στην αρχική της κατάσταση. Δεδομένου ότι δεν διαβιβάζονται δεδομένα στον χειριστή κατά τη χρήση αυτού του κουμπιού, ένα κουμπί επαναφοράς ενδέχεται να μην έχει χαρακτηριστικό όνομα. Παράδειγμα:

Καθορίζει το κουμπί Εκκαθάριση πεδίων φόρμας, το οποίο, όταν κάνετε κλικ, επιστρέφει τη φόρμα στην αρχική της κατάσταση.

Εκτός από τα στοιχεία , οι φόρμες μπορούν να περιέχουν μενού και πεδία εισαγωγής κειμένου .</p> <p>Μενού <SELECT>των n στοιχείων μοιάζει κάπως έτσι:</p> <p><SELECT NAME=»[имя]»></p> <p><OPTION VALUE=»[значение 1]»>[κείμενο 1]</p> <p><OPTION VALUE=»[значение 2]»>[κείμενο 2]</p> <p><OPTION VALUE=»[значение n]»>[κείμενο ν]</p> <p>Όπως μπορείτε να δείτε, το μενού ξεκινά με την ετικέτα <SELECT>και τελειώνει με ένα σημάδι</SELECT>. Επιγραφή <SELECT>περιέχει ένα απαιτούμενο χαρακτηριστικό NAME που καθορίζει το όνομα της μεταβλητής που δημιουργεί το μενού.</p> <p>Επιγραφή <SELECT>μπορεί επίσης να περιέχει ένα χαρακτηριστικό MULTIPLE, η παρουσία του οποίου υποδεικνύει ότι μπορούν να επιλεγούν πολλά στοιχεία από το μενού. Τα περισσότερα προγράμματα περιήγησης εμφανίζουν ένα μενού <SELECT MULTIPLE>με τη μορφή παραθύρου στο οποίο βρίσκονται τα στοιχεία μενού (το ύψος του παραθύρου σε γραμμές μπορεί να οριστεί με το χαρακτηριστικό SIZE=[number]). Μενού <SELECT>στις περισσότερες περιπτώσεις εμφανίζεται ως αναπτυσσόμενο μενού.</p> <p>Επιγραφή <OPTION>ορίζει ένα στοιχείο μενού. Το απαιτούμενο χαρακτηριστικό VALUE ορίζει την τιμή που θα μεταβιβαστεί στον χειριστή εάν επιλεγεί αυτό το στοιχείο μενού. Επιγραφή <OPTION>μπορεί να περιλαμβάνει ένα επιλεγμένο χαρακτηριστικό που υποδεικνύει ότι το στοιχείο ελέγχεται από προεπιλογή.</p> <p>Ας δούμε ένα μικρό παράδειγμα.</p> <p><SELECT NAME=»selection»></p> <p><OPTION VALUE=»option1″ checked>Επιλογή 1</p> <p><OPTION VALUE=»option2″>Επιλογή 2</p> <p><OPTION VALUE=»option3″>Επιλογή 3</p> <p>Αυτό το τμήμα ορίζει ένα μενού τριών στοιχείων: Επιλογή 1, Επιλογή 2 και Επιλογή 3. Από προεπιλογή, είναι επιλεγμένο το στοιχείο Επιλογή 1 Στο πρόγραμμα χειρισμού θα μεταβιβαστεί μια μεταβλητή επιλογής της οποίας η τιμή μπορεί να είναι η επιλογή 1 (προεπιλογή), η επιλογή 2 ή η επιλογή 3.</p> <p>Μετά από όλα όσα έχουμε ήδη μάθει, το στοιχείο <TEXTAREA>μπορεί να φαίνεται αρκετά απλό. Για παράδειγμα:</p> <p><TEXTAREA NAME=address ROWS=5 COLS=50></p> <p>Και εδώ είναι η διεύθυνσή σου...</p> <p>

Απαιτούνται όλα τα χαρακτηριστικά. Το χαρακτηριστικό NAME ορίζει το όνομα με το οποίο θα μεταφερθούν τα περιεχόμενα του παραθύρου στον χειριστή (στο παράδειγμα - διεύθυνση). Το χαρακτηριστικό ROWS ορίζει το ύψος του παραθύρου σε σειρές (5 στο παράδειγμα). Το χαρακτηριστικό COLS ορίζει το πλάτος του παραθύρου σε χαρακτήρες (50 στο παράδειγμα).

Το κείμενο τοποθετείται ανάμεσα σε ετικέτες Και, αντιπροσωπεύει τα προεπιλεγμένα περιεχόμενα του παραθύρου. Ο χρήστης μπορεί να το επεξεργαστεί ή απλά να το σβήσει.

Είναι σημαντικό να γνωρίζετε ότι τα ρωσικά γράμματα βρίσκονται στο παράθυρο όταν περάσουν στον χειριστή, μπορούν να μετατραπούν στα αντίστοιχα αντικείμενα χαρακτήρων τους.</p> <p><b>Ειδικοί χαρακτήρες και σχόλια</b></p> <p>Ειδικοί χαρακτήρες</p> <p>Ορισμένα σύμβολα που χρησιμοποιούνται συνήθως δεν έχουν τη δική τους θέση στο πληκτρολόγιο, όπως το εικονίδιο ©. Άλλα ερμηνεύονται από τα προγράμματα περιήγησης ως ακολουθίες εντολών, όπως οι γωνιακές αγκύλες που περικλείουν ετικέτες γλώσσας HTML. Προφανώς, πρέπει να υπάρχει τρόπος να πληκτρολογήσετε τέτοιους χαρακτήρες σε κείμενο. Στην html υπάρχει ένα σύνολο από ακολουθίες μακροεντολών που μετατρέπονται από τα προγράμματα περιήγησης στους αντίστοιχους χαρακτήρες «μη εκτυπωτικούς». Προφανώς, δεν έχουν όλες οι γραμματοσειρές το πλήρες σύνολο χαρακτήρων και το πρόγραμμα περιήγησης δεν θα μπορεί να τις εμφανίσει σωστά σε όλες τις περιπτώσεις. Αλλά για να περιγραφεί πλήρως το έγγραφο, όλοι οι ειδικοί χαρακτήρες πρέπει να κωδικοποιηθούν σωστά. Ακολουθεί μια λίστα με ειδικούς χαρακτήρες και τις μακροεντολές γλώσσας που αντιστοιχούν σε αυτούς.</p> <p>Ειδικοί χαρακτήρες</p> <p>Σχόλια</p> <p>Όπως κάθε γλώσσα προγραμματισμού, η html έχει έναν τρόπο να σχολιάζει μέρος του κειμένου έτσι ώστε να μην υποβάλλεται σε επεξεργασία από προγράμματα περιήγησης. Τα σχόλια περικλείονται μεταξύ των ακολουθιών< ! — — и — — >. Παράδειγμα σχολίου:</p> <p><!— этот текст закомментирован —></p> <p><b>Συμβουλές για την ανάπτυξη και τη φιλοξενία σελίδων HTML</b></p> <p>Κανόνες καλών τρόπων κατά την ανάπτυξη εγγράφων HTML</p> <p>Οι κατασκευαστές προγραμμάτων περιήγησης συχνά προσθέτουν υποστήριξη για ετικέτες στις δημιουργίες τους που δεν περιλαμβάνονται στην τρέχουσα προδιαγραφή HTML. Αυτός είναι ο λόγος για τον οποίο μερικές φορές μπορείτε να βρείτε σελίδες βελτιστοποιημένες για ένα συγκεκριμένο πρόγραμμα περιήγησης. Κατά τη γνώμη μου, αυτή απέχει πολύ από την καλύτερη προσέγγιση. Ωστόσο, όπως είπε ο Ray Bradbury, ο μόνος τρόπος για να κάνεις έναν συγγραφέα να μην γράφει είναι με ένα Colt .45. Και οι συγγραφείς γράφουν...</p> <p>Μην έχετε απόλυτη εμπιστοσύνη στους οπτικούς επεξεργαστές HTML</p> <p>Να θυμάστε ότι οι περισσότεροι οπτικοί επεξεργαστές HTML, αν και γενικά λειτουργούν σωστά, έχουν μικρά (και μερικές φορές σημαντικά) ελαττώματα. Αυτό οφείλεται εν μέρει στο γεγονός ότι η HTML δεν σχεδιάστηκε για αυτοματοποιημένη ανάπτυξη από την αρχή.</p> <p>Μην εισάγετε χαρακτηριστικά των οποίων η τιμή θέλετε να είναι ίδια με την προεπιλεγμένη</p> <p>Αυτό αυξάνει το μέγεθος του αρχείου σας και προκαλεί έναν τόνο επιπλέον εργασίας.</p> <p>Χρησιμοποιήστε το χαρακτηριστικό πρόσωπο μόνο όταν χρειάζεστε μια ειδική γραμματοσειρά.</p> <p>Χρησιμοποιήστε μια προσεκτική ιεραρχία επικεφαλίδων</p> <p>Θυμηθείτε ότι το έγγραφό σας θα διαβαστεί πολύ καλύτερα εάν έχει σαφή διαίρεση σε ενότητες και υποενότητες. Η HTML παρέχει έξι επίπεδα επικεφαλίδων στη διάθεσή σας. Επωφεληθείτε από αυτόν τον πλούτο δημιουργώντας ένα ευανάγνωστο έγγραφο με διαισθητική δομή.</p> <p>Παρακολουθήστε την ένθεση ετικετών</p> <p>Τα σύγχρονα προγράμματα περιήγησης είναι σε θέση να χειρίζονται σωστά τις ένθετες ετικέτες. Για παράδειγμα, εδώ είναι ένα τμήμα κειμένου HTML</p> <p><B><I>έντονη πλάγια γραμματοσειρά</I></B></p> <p>Τα περισσότερα προγράμματα περιήγησης θα το αποδώσουν αρκετά καλά ως μια έντονη πλάγια γραμματοσειρά. Παρακαλώ σημειώστε - ετικέτες <I>…</I>σε αυτό το κομμάτι βρίσκονται μέσα στις ετικέτες <B>…</B>. Με άλλα λόγια, τα σημάδια είναι φωλιασμένα το ένα μέσα στο άλλο.</p> <p>Ωστόσο, το πρόγραμμα περιήγησης θα γίνει πολύ δύσκολο να λειτουργήσει εάν η ένθεση είναι σπασμένη, για παράδειγμα:</p> <p><B><I>η φωλίτσα της ετικέτας έχει σπάσει</B></I></p> <p>Η συμμόρφωση με την ένθεση είναι ένα πολύ σημαντικό μέρος της γενικής κουλτούρας της σύνταξης κειμένου HTML.</p> <p>Παρέχετε εναλλακτικό κείμενο όταν συμπεριλαμβάνετε εικόνες σε ένα έγγραφο</p> <p>Λάβετε υπόψη ότι οι χρήστες μπορούν να απενεργοποιήσουν την αυτόματη φόρτωση εικόνων. Μην τεμπελιάζετε να πείτε στον χρήστη τι ακριβώς δεν βλέπει. Αυτό είναι ιδιαίτερα σημαντικό όταν οι εικόνες είναι σύνδεσμοι υπερκειμένου.</p> <p>Κατά την ανάπτυξη μεγάλων εγγράφων, δημιουργήστε πίνακες περιεχομένων</p> <p>Όταν γράφετε ένα μεγάλο έγγραφο, είναι πολύ χρήσιμο να τοποθετείτε έναν πίνακα περιεχομένων στην αρχή του εγγράφου με συνδέσμους υπερκειμένου σε ενότητες. Αυτό μπορεί να διευκολύνει τον χρήστη να εργαστεί με το έγγραφο, ειδικά εάν το έγγραφο προορίζεται για λόγους αναφοράς.</p> <p>Σκεφτείτε καλά την πλοήγησή σας</p> <p>Προσπαθήστε να φανταστείτε ότι ο χρήστης δεν έχει κουμπί Πίσω στη διάθεσή του. Σκεφτείτε πώς να παρέχετε στον χρήστη την απαραίτητη ελευθερία κινήσεων σε αυτήν την περίπτωση. Αυτό θα σας βοηθήσει να σχεδιάσετε μια εύχρηστη συλλογή εγγράφων HTML.</p> <p><b>Συνήθη σφάλματα HTML</b></p> <p>Τα τυπικά σφάλματα θα συζητηθούν χρησιμοποιώντας αυτόν τον κώδικα σελίδας ως παράδειγμα:</p> <p><meta http-equiv=»Content-Type» content=»text/html; charset=KOI8″></p> <p><title>Αρχική Σελίδα</title></p> <p><body background=c:\..\..\images\buttonweb.gif bgproperties=»fixed» topmargin=»1″ leftmargin=»1″></p> <p><divalign=center><center></p> <p> <p><big><big><em></p> <p>"Γειά σου!"</p> <p></big></big></p> <p></em></font></p> <p><p>Αυτή είναι μια φωτογραφία μου στα 15 μου.</p> <p><ahref=»myfacebig.htm»><img src='/life-hacks-wi-fi/znachenie-tegov-v-html-osnovnye-tegi-html.html' loading=lazy loading=lazy></p> <p><p>Οι σύνδεσμοί μου.</p> <p><li><b><font face=»AdverGothic»>Ρωγμές</font></b></p> <p><li><b><font face=»AdverGothic»>Υπάρχει κάποιο ωραίο λογισμικό εδώ!</font></b> <li><b><font face=»AdverGothic»>MP-3 - rulezz!</font></b></p> <p><li><b><font face=»AdverGothic»>Λοσιόν για το mastday!</font></b></p> <p></center></div></p> <p><b>Σφάλματα στα χαρακτηριστικά της ετικέτας <body> </b></p> <p>Σε αυτήν τη σελίδα, ένα εξωτερικό GIF θα πρέπει να χρησιμοποιείται ως φόντο. Σφάλμα στην περιγραφή διαδρομής. Η διαδρομή προς το αρχείο περιγράφεται σε σχέση με τη μονάδα c:\ στο τοπικό μηχάνημα. Ένα τέτοιο φόντο δεν θα εμφανίζεται στον πελάτη. Σωστός κωδικός:</p> <p>background="../../images/buttonweb.gif"</p> <p>Μη συμβατά χαρακτηριστικά.</p> <p>Μη συμβατός κωδικός: bgproperties=»fixed» topmargin=»1″ leftmargin=»1″</p> <p>Το NN δεν κατανοεί αυτές τις επεκτάσεις για συμβατότητα κώδικα, πρέπει επιπλέον να καθορίσετε MARGINWIDTH=”1″ MARGINHEIGHT=”1″.</p> <p>Για να εμφανιστεί σωστά η σελίδα σε προγράμματα περιήγησης με απενεργοποιημένα γραφικά, συνιστάται επίσης να καθορίσετε το χρώμα του φόντου. bgcolor=""</p> <p>Υπερβολική μορφοποίηση</p> <p>Χαρακτηριστικό του επεξεργαστή HTML Front Page. Αρκεί να χρησιμοποιήσετε μία από τις ετικέτες, ή <div align=»center»>ή απολύτως πανομοιότυπο με αυτό <center></p> <p>Υπερβολική μορφοποίηση σε μια ετικέτα <p>Σε αυτήν την περίπτωση, το κείμενο είναι ήδη κεντραρισμένο και δεν χρειάζεται να προσθέσετε χαρακτηριστικά για το σκοπό αυτό. Έχει νόημα μόνο να χρησιμοποιήσετε το Align="αριστερά(δεξιά)".</p> <p>Ετικέτα <p>Αυτές οι γραμμές δεν είναι κλειστές (</p>), το οποίο θα οδηγήσει σε ανεπαρκή εμφάνιση του διαστήματος παραγράφων στα NN και IE. Το καλό στυλ απαιτεί μια ετικέτα κλεισίματος <p>Χρήση του Font Face.</p> <p>Η χρήση μη τυπικών γραμματοσειρών σε σελίδες θα έχει ως αποτέλεσμα η σελίδα να είναι είτε δυσανάγνωστη είτε καθόλου αναγνώσιμη. Για συμβατότητα με προγράμματα περιήγησης από άλλες πλατφόρμες, πρέπει να χρησιμοποιήσετε αυτό το σχέδιο:</p> <p><font face=»Arial, Arial Cur, Helvetica»></p> <p>Υπερβολική μορφοποίηση στυλ γραμματοσειράς</p> <p>Σχέδιο <big><big>περιττός. Κατά προτίμηση χρησιμοποιείται για την επισήμανση επικεφαλίδων <H2></H2>, ή ένας συνδυασμός <base font=»2″ >- αμέσως μετά <body>και σχετικό μέγεθος γραμματοσειράς <font size=»+3″>.</p> <p>Ποσοστώσεις στο κείμενο περιεχομένου.</p> <p>Η χρήση εισαγωγικών σε αυτή τη μορφή (“”) στο περιεχόμενο δεν είναι αποδεκτή. Πρέπει να καθοριστεί Γεια σας Άνθρωποι! .</p> <p>Παραβίαση της σειράς κλεισίματος ετικετών</p> <p>Οι ετικέτες πρέπει να είναι κλειστές με βάση τη σειρά με την οποία είναι ένθετες. Σωστός σχεδιασμός</p> <p><font><b><em>...περιεχόμενο...</em></b></font></p> <p>Για να περιγράψετε τις εικόνες στη σελίδα, πρέπει να χρησιμοποιήσετε τα ακόλουθα χαρακτηριστικά:</p> <p>πλάτος="", ύψος=""</p> <p>Εάν δεν τα καθορίσετε, η σελίδα δεν θα φορτωθεί έως ότου φορτωθεί πλήρως η εικόνα.</p> <p>Η απουσία αυτού του χαρακτηριστικού θα οδηγήσει στο γεγονός ότι γύρω από την εικόνα, εάν "κρεμάσετε" μια υπερ-σύνδεση σε αυτήν, θα εμφανιστεί ένα περίγραμμα με το χρώμα της υπερ-σύνδεσης</p> <p>Η απουσία αυτού του χαρακτηριστικού θα κάνει τις πληροφορίες σχετικά με την εικόνα απρόσιτες σε προγράμματα περιήγησης με απενεργοποιημένα γραφικά.</p> <p>Ο σωστός κώδικας περιγραφής εικόνας μοιάζει με αυτό:</p> <p><img src='/life-hacks-wi-fi/znachenie-tegov-v-html-osnovnye-tegi-html.html' loading=lazy loading=lazy></p> <p>Ακάλυπτη άγκυρα και χαρακτηριστικά αγκύρωσης.</p> <p>Η άγκυρα πρέπει να είναι κλειστή. Ένα καλό στυλ προγραμματισμού περιλαμβάνει την ακόλουθη δομή:</p> <p><a href=»mybigfase.htm» target=»_self»>...περιεχόμενο...</a></p> <p>Σημείωμα.</p> <p>Καθορισμός ετικέτας <base target=»»>θα σας επιτρέψει να μην καθορίσετε την άγκυρα TARGET στην επέκταση στο μέλλον.</p> <p>Εάν η άγκυρα είναι κλειστή με τροφοδοσία γραμμής ή δεν είναι καθόλου κλειστή, τότε το NN θα αποδώσει έναν τέτοιο κώδικα με μια μικρή παύλα, η οποία είναι πολύ αισθητή σε σελίδες με ανοιχτό φόντο.</p> <p>Μορφοποίηση λιστών.</p> <p>Κατά τη μορφοποίηση λιστών, πρέπει να κλείσετε την ετικέτα <li>, η μορφοποίηση του κειμένου σε κάθε γραμμή της λίστας έχει νόημα μόνο εάν οι γραμμές είναι τονισμένες. Σωστός κωδικός.</p> <p><ul><font color=»» size=»»></p> <p><li>...περιεχόμενο...</li></p> <p><li>...περιεχόμενο...</li></p> <p><li>...περιεχόμενο...</li></p> <p></font></ul></p> <p><b>Χρωματολόγιο:</b></p> <table width="100%"><tbody><tr><td width="23%"><b>Τίτλος σε CSS</b> </td> <td width="10%"><b>Δείγμα</b> </td> <td width="30%"><b>Χρώμα</b> </td> <td width="11%"><b>Εννοια</b> </td> <td width="24%"><b>Τίτλος σε IE4</b> </td> </tr><tr><td width="23%">aliceblue</td> <td width="10%"> </td> <td width="30%">ξεθωριασμένο μπλε</td> <td width="11%">#F0F8FF</td> <td width="24%">htmlAliceBlue</td> </tr><tr><td width="23%">αντίκαΛευκό</td> <td width="10%"> </td> <td width="30%">αντίκα λευκό</td> <td width="11%">#FAEBD7</td> <td width="24%">htmlAntiqueWhite</td> </tr><tr><td width="23%">aqua</td> <td width="10%"> </td> <td width="30%">γαλάζιο νερό</td> <td width="11%">#00FFFF</td> <td width="24%">htmlAqua</td> </tr><tr><td width="23%">ακουαμαρίνης</td> <td width="10%"> </td> <td width="30%">ακουαμαρίνης</td> <td width="11%">#7FFFD4</td> <td width="24%">htmlΑκουαμαρίνα</td> </tr><tr><td width="23%">γαλανός</td> <td width="10%"> </td> <td width="30%">γαλανός</td> <td width="11%">#F0FFFF</td> <td width="24%">htmlAzure</td> </tr><tr><td width="23%">μπεζ</td> <td width="10%"> </td> <td width="30%">μπεζ</td> <td width="11%">#F5F5DC</td> <td width="24%">htmlΜπεζ</td> </tr><tr><td width="23%">είδος πυκνής σούπας</td> <td width="10%"> </td> <td width="30%">μπισκότο</td> <td width="11%">#FFE4C4</td> <td width="24%">htmlBisque</td> </tr><tr><td width="23%">μαύρος</td> <td width="10%"> </td> <td width="30%">μαύρος</td> <td width="11%">#000000 </td> <td width="24%">htmlΜαύρο</td> </tr><tr><td width="23%">blanchedalmond</td> <td width="10%"> </td> <td width="30%">ελαφριά κρέμα</td> <td width="11%">#FFECD</td> <td width="24%">htmlBlanched Almond</td> </tr><tr><td width="23%">μπλε</td> <td width="10%"> </td> <td width="30%">μπλε</td> <td width="11%">#0000FF</td> <td width="24%">htmlΜπλε</td> </tr><tr><td width="23%">μπλε βιολετί</td> <td width="10%"> </td> <td width="30%">μπλε-βιολετί</td> <td width="11%">#8A2BE2</td> <td width="24%">htmlΜπλε βιολετί</td> </tr><tr><td width="23%">καστανός</td> <td width="10%"> </td> <td width="30%">καστανός</td> <td width="11%">#A52A2A</td> <td width="24%">htmlΚαφέ</td> </tr><tr><td width="23%">ξυλόξυλο</td> <td width="10%"> </td> <td width="30%">παλιό δέντρο</td> <td width="11%">#DEB887</td> <td width="24%">htmlBurlyWood</td> </tr><tr><td width="23%">καντμπλου</td> <td width="10%"> </td> <td width="30%">ξεθωριασμένο γκρι-μπλε</td> <td width="11%">#5F9EA0</td> <td width="24%">htmlCadetBlue</td> </tr><tr><td width="23%">κιτρινοπράσινος</td> <td width="10%"> </td> <td width="30%">φυστίκι αιγίνης</td> <td width="11%">#7FFF00</td> <td width="24%">htmlChartreuse</td> </tr><tr><td width="23%">σοκολάτα</td> <td width="10%"> </td> <td width="30%">σοκολάτα</td> <td width="11%">#D2691E</td> <td width="24%">htmlΣοκολάτα</td> </tr><tr><td width="23%">κοράλλι</td> <td width="10%"> </td> <td width="30%">κοράλλι</td> <td width="11%">#FF7F50</td> <td width="24%">htmlΚοράλι</td> </tr><tr><td width="23%">αραβοσίτου</td> <td width="10%"> </td> <td width="30%">κυανός</td> <td width="11%">#6495ΕΔ</td> <td width="24%">htmlΚορνάνθος Μπλε</td> </tr><tr><td width="23%">καλαμποκάλευρο</td> <td width="10%"> </td> <td width="30%">σκούρο μετάξι</td> <td width="11%">#FFF8DC</td> <td width="24%">htmlΜετάξι</td> </tr><tr><td width="23%">βυσσινί</td> <td width="10%"> </td> <td width="30%">βυσσινί</td> <td width="11%">#DC143C</td> <td width="24%">htmlΒυσσινί</td> </tr><tr><td width="23%">κυανό</td> <td width="10%"> </td> <td width="30%">Κυανόγονο</td> <td width="11%">#00FFFF</td> <td width="24%">htmlΚυανό</td> </tr><tr><td width="23%">σκούρο μπλε</td> <td width="10%"> </td> <td width="30%">σκούρο μπλε</td> <td width="11%">#00008B</td> <td width="24%">htmlΣκούρο Μπλε</td> </tr><tr><td width="23%">μελαχρινός</td> <td width="10%"> </td> <td width="30%">σκούρο κυανό</td> <td width="11%">#008B8B</td> <td width="24%">htmlΣκούρο κυανό</td> </tr><tr><td width="23%">σκοτεινόχρυσο ραβδί</td> <td width="10%"> </td> <td width="30%">σκούρο κόκκινο-χρυσό</td> <td width="11%">#B8860B</td> <td width="24%">htmlDarkGoldenRod</td> </tr><tr><td width="23%">σκούρο γκρι</td> <td width="10%"> </td> <td width="30%">σκούρο γκρι</td> <td width="11%">#A9A9A9</td> <td width="24%">htmlΣκούρο Γκρι</td> </tr><tr><td width="23%">σκούρο πράσινο</td> <td width="10%"> </td> <td width="30%">σκούρο πράσινο</td> <td width="11%">#006400 </td> <td width="24%">htmlΣκούρο Πράσινο</td> </tr><tr><td width="23%">σκοτεινός</td> <td width="10%"> </td> <td width="30%">σκούρο χακί</td> <td width="11%">#BDB76B</td> <td width="24%">htmlΣκοτεινό Χακί</td> </tr><tr><td width="23%">darkmagenta</td> <td width="10%"> </td> <td width="30%">σκούρο ματζέντα (κόκκινο)</td> <td width="11%">#8B008B</td> <td width="24%">htmlDarkMagenta</td> </tr><tr><td width="23%">σκούρο πράσινο</td> <td width="10%"> </td> <td width="30%">μαύρη ελιά</td> <td width="11%">#556B2F</td> <td width="24%">htmlDarkOliveGreen</td> </tr><tr><td width="23%">σκούρο πορτοκαλί</td> <td width="10%"> </td> <td width="30%">σκούρο πορτοκαλί</td> <td width="11%">#FF8C00</td> <td width="24%">htmlΣκούρο Πορτοκαλί</td> </tr><tr><td width="23%">σκουρόχορδα</td> <td width="10%"> </td> <td width="30%">σκούρα ορχιδέα</td> <td width="11%">#9932CC</td> <td width="24%">htmlΣκοτεινήΟρχιδέα</td> </tr><tr><td width="23%">σκούρο</td> <td width="10%"> </td> <td width="30%">σκούρο κόκκινο</td> <td width="11%">#8B0000</td> <td width="24%">htmlΣκούρο κόκκινο</td> </tr><tr><td width="23%">σκοτεινός σολομός</td> <td width="10%"> </td> <td width="30%">σκούρο πορτοκαλί ροζ</td> <td width="11%">#E9967A</td> <td width="24%">htmlDarkSalmon</td> </tr><tr><td width="23%">σκούρο πράσινο</td> <td width="10%"> </td> <td width="30%">σκοτεινό κύμα θάλασσας</td> <td width="11%">#8FBC8F</td> <td width="24%">htmlDarkSeaGreen</td> </tr><tr><td width="23%">σκούρο πλάκα</td> <td width="10%"> </td> <td width="30%">σκούρο γκριζωπό μπλε</td> <td width="11%">#483D8B</td> <td width="24%">htmlDarkSlateBlue</td> </tr><tr><td width="23%">σκούρο γκρι</td> <td width="10%"> </td> <td width="30%">σκούρο γαλαζωπό γκρι</td> <td width="11%">#2F4F4F</td> <td width="24%">htmlDarkSlateGrey</td> </tr><tr><td width="23%">σκούρο τιρκουάζ</td> <td width="10%"> </td> <td width="30%">σκούρο τιρκουάζ</td> <td width="11%">#00CED1</td> <td width="24%">htmlΣκούροΤυρκουάζ</td> </tr><tr><td width="23%">σκούρο βιολετί</td> <td width="10%"> </td> <td width="30%">σκούρο μωβ</td> <td width="11%">#9400D3</td> <td width="24%">htmlDarkViolet</td> </tr><tr><td width="23%">βαθύ ροζ</td> <td width="10%"> </td> <td width="30%">σκούρο ροζ</td> <td width="11%">#FF1493</td> <td width="24%">htmlDeepPink</td> </tr><tr><td width="23%">βαθύ μπλε</td> <td width="10%"> </td> <td width="30%">σκούρο μπλε του ουρανού</td> <td width="11%">#00BFFF</td> <td width="24%">htmlDeepSkyBlue</td> </tr><tr><td width="23%">αμυδρός</td> <td width="10%"> </td> <td width="30%">θαμπό γκρι</td> <td width="11%">#696969 </td> <td width="24%">htmlDimGrey</td> </tr><tr><td width="23%">νταμπλε</td> <td width="10%"> </td> <td width="30%">θαμπό μπλε του αραβοσίτου</td> <td width="11%">#1E90FF</td> <td width="24%">htmlDodgerBlue</td> </tr><tr><td width="23%">πυρίμαχο τούβλο</td> <td width="10%"> </td> <td width="30%">πυρότουβλα</td> <td width="11%">#B22222</td> <td width="24%">htmlFireBrick</td> </tr><tr><td width="23%">λουλουδένιο</td> <td width="10%"> </td> <td width="30%">λουλουδάτο λευκό</td> <td width="11%">#FFFAF0</td> <td width="24%">htmlΛευκό λουλούδι</td> </tr><tr><td width="23%">δασοπράσινο</td> <td width="10%"> </td> <td width="30%">πράσινο του δάσους</td> <td width="11%">#228B22</td> <td width="24%">htmlForestGreen</td> </tr><tr><td width="23%">φουξία</td> <td width="10%"> </td> <td width="30%">φουξία</td> <td width="11%">#FF00FF</td> <td width="24%">htmlΦούξια</td> </tr><tr><td width="23%">gainsboro</td> <td width="10%"> </td> <td width="30%">ανοιχτό γκρι-βιολετί</td> <td width="11%">#DCDCDC</td> <td width="24%">htmlGainsboro</td> </tr><tr><td width="23%">ghostwhite</td> <td width="10%"> </td> <td width="30%">μουντό λευκό</td> <td width="11%">#F8F8FF</td> <td width="24%">htmlGhostWhite</td> </tr><tr><td width="23%">χρυσός</td> <td width="10%"> </td> <td width="30%">χρυσός</td> <td width="11%">#FFD700</td> <td width="24%">htmlΧρυσός</td> </tr><tr><td width="23%">χρυσαυγίτης</td> <td width="10%"> </td> <td width="30%">κόκκινος χρυσός</td> <td width="11%">#DAA520</td> <td width="24%">htmlGoldenRod</td> </tr><tr><td width="23%">γκρί</td> <td width="10%"> </td> <td width="30%">γκρί</td> <td width="11%">#808080 </td> <td width="24%">htmlΓκρι</td> </tr><tr><td width="23%">πράσινος</td> <td width="10%"> </td> <td width="30%">πράσινος</td> <td width="11%">#008000 </td> <td width="24%">htmlΠράσινο</td> </tr><tr><td width="23%">πρασινοκίτρινο</td> <td width="10%"> </td> <td width="30%">πράσινο-κίτρινο</td> <td width="11%">#ADFF2F</td> <td width="24%">htmlΠράσινοΚίτρινο</td> </tr><tr><td width="23%">μελίτωμα</td> <td width="10%"> </td> <td width="30%">φρέσκο ​​μέλι</td> <td width="11%">#F0FFF0</td> <td width="24%">htmlΜελίτωμα</td> </tr><tr><td width="23%">hotpink</td> <td width="10%"> </td> <td width="30%">ζεστό ροζ</td> <td width="11%">#FF69B4</td> <td width="24%">htmlHotPink</td> </tr><tr><td width="23%">ινδιάνικος</td> <td width="10%"> </td> <td width="30%">θαμπό κόκκινο</td> <td width="11%">#CD5C5C</td> <td width="24%">htmlIndianRed</td> </tr><tr><td width="23%">ινδικό</td> <td width="10%"> </td> <td width="30%">ινδικό</td> <td width="11%">#4B0082</td> <td width="24%">htmlΛουκά</td> </tr><tr><td width="23%">ελεφαντόδοντο</td> <td width="10%"> </td> <td width="30%">ελεφαντόδοντο</td> <td width="11%">#FFFFFF0</td> <td width="24%">htmlΕλεφαντόδοντο</td> </tr><tr><td width="23%">χακί</td> <td width="10%"> </td> <td width="30%">χακί</td> <td width="11%">#F0E68C</td> <td width="24%">htmlΧακί</td> </tr><tr><td width="23%">λεβάντα</td> <td width="10%"> </td> <td width="30%">λεβάντα</td> <td width="11%">#E6E6FA</td> <td width="24%">htmlΛεβάντα</td> </tr><tr><td width="23%">κοκκινί λεβάντας</td> <td width="10%"> </td> <td width="30%">απαλό μοβ</td> <td width="11%">#FFF0F5</td> <td width="24%">htmlΚουζ λεβάντας</td> </tr><tr><td width="23%">γκαζόν</td> <td width="10%"> </td> <td width="30%">πράσινο γρασίδι</td> <td width="11%">#7CFC00</td> <td width="24%">htmlΠράσινο γκαζόν</td> </tr><tr><td width="23%">λεμονσιφόν</td> <td width="10%"> </td> <td width="30%">κιτρικός</td> <td width="11%">#FFFACD</td> <td width="24%">htmlLemonChiffon</td> </tr><tr><td width="23%">γαλάζιο</td> <td width="10%"> </td> <td width="30%">γαλάζιο</td> <td width="11%">#ADD8E6</td> <td width="24%">htmlΜπλε</td> </tr><tr><td width="23%">φωτοκοράλ</td> <td width="10%"> </td> <td width="30%">ελαφρύ κοράλλι</td> <td width="11%">#F08080</td> <td width="24%">htmlLightCoral</td> </tr><tr><td width="23%">ανοιχτόχρωμος</td> <td width="10%"> </td> <td width="30%">ανοιχτό κυανό</td> <td width="11%">#E0FFFF</td> <td width="24%">htmlΑνοιχτό κυανό</td> </tr><tr><td width="23%">ανοιχτό γκρι</td> <td width="10%"> </td> <td width="30%">ανοιχτό γκρι</td> <td width="11%">#D3D3D3</td> <td width="24%">htmlΑνοιχτό Γκρι</td> </tr><tr><td width="23%">ανοιχτό πράσινο</td> <td width="10%"> </td> <td width="30%">ανοιχτό πράσινο</td> <td width="11%">#90EE90</td> <td width="24%">htmlΑνοιχτό Πράσινο</td> </tr><tr><td width="23%">ανοιχτό ροζ</td> <td width="10%"> </td> <td width="30%">ανοιχτό ροζ</td> <td width="11%">#FFB6C1</td> <td width="24%">htmlΑνοιχτό ροζ</td> </tr><tr><td width="23%">σολομός</td> <td width="10%"> </td> <td width="30%">ανοιχτό πορτοκαλί-ροζ</td> <td width="11%">#FFA07A</td> <td width="24%">htmlLightSalmon</td> </tr><tr><td width="23%">lightseagreen</td> <td width="10%"> </td> <td width="30%">ελαφρύ κύμα θάλασσας</td> <td width="11%">#20B2AA</td> <td width="24%">htmlLightSeaGreen</td> </tr><tr><td width="23%">ανοιχτό μπλε</td> <td width="10%"> </td> <td width="30%">γαλάζιο του ουρανού</td> <td width="11%">#87 CEFA</td> <td width="24%">htmlΜπλε μπλε</td> </tr><tr><td width="23%">lightslategrey</td> <td width="10%"> </td> <td width="30%">ανοιχτό γαλαζωπό γκρι</td> <td width="11%">#778899 </td> <td width="24%">htmlLightSlateGrey</td> </tr><tr><td width="23%">ανοιχτό μπλε</td> <td width="10%"> </td> <td width="30%">ελαφρύ χάλυβα</td> <td width="11%">#B0C4DE</td> <td width="24%">htmlΜπλε Ατσάλι</td> </tr><tr><td width="23%">ανοιχτοκίτρινο</td> <td width="10%"> </td> <td width="30%">ανοιχτό κίτρινο</td> <td width="11%">#FFFFE0</td> <td width="24%">htmlΑνοικτό κίτρινο</td> </tr><tr><td width="23%">άσβεστος</td> <td width="10%"> </td> <td width="30%">ασβέστη χρώμα</td> <td width="11%">#00FF00</td> <td width="24%">htmlΑσβέστη</td> </tr><tr><td width="23%">ασβέστη</td> <td width="10%"> </td> <td width="30%">πρασινωπό-ασβεστώδης</td> <td width="11%">#32CD32</td> <td width="24%">htmlLimeGreen</td> </tr><tr><td width="23%">λινό</td> <td width="10%"> </td> <td width="30%">λινό</td> <td width="11%">#FAF0E6</td> <td width="24%">htmlΓραμμή</td> </tr><tr><td width="23%">πορφύρα βαφή</td> <td width="10%"> </td> <td width="30%">πορφύρα βαφή</td> <td width="11%">#FF00FF</td> <td width="24%">htmlΜατζέντα</td> </tr><tr><td width="23%">μαρόν</td> <td width="10%"> </td> <td width="30%">πορτοκαλοροζ</td> <td width="11%">#800000 </td> <td width="24%">htmlΜαρούν</td> </tr><tr><td width="23%">μέτρια ακουαμαρίνα</td> <td width="10%"> </td> <td width="30%">μέτρια ακουαμαρίνα</td> <td width="11%">#66CDAA</td> <td width="24%">htmlMediumAquamarine</td> </tr><tr><td width="23%">μεσαίο μπλε</td> <td width="10%"> </td> <td width="30%">μέτριο μπλε</td> <td width="11%">#0000CD</td> <td width="24%">htmlΜεσαίο Μπλε</td> </tr><tr><td width="23%">μέτρια ορχιδέα</td> <td width="10%"> </td> <td width="30%">μέτρια ορχιδέα</td> <td width="11%">#BA55D3</td> <td width="24%">htmlMediumOrchid</td> </tr><tr><td width="23%">μέτριο μωβ</td> <td width="10%"> </td> <td width="30%">μέτριο μωβ</td> <td width="11%">#9370DB</td> <td width="24%">htmlMediumPurple</td> </tr><tr><td width="23%">mediumseagreen</td> <td width="10%"> </td> <td width="30%">μέτριο θαλάσσιο κύμα</td> <td width="11%">#3CB371</td> <td width="24%">htmlMediumSeaGreen</td> </tr><tr><td width="23%">mediumslateblue</td> <td width="10%"> </td> <td width="30%">μέτρια γκριζωπό μπλε</td> <td width="11%">#7B68EE</td> <td width="24%">htmlMediumSlateBlue</td> </tr><tr><td width="23%">mediumspringgreen</td> <td width="10%"> </td> <td width="30%">μέτρια πρασινωπό γκρι</td> <td width="11%">#00FA9A</td> <td width="24%">htmlMediumSpringGreen</td> </tr><tr><td width="23%">μεσαίο τιρκουάζ</td> <td width="10%"> </td> <td width="30%">μέτριο τιρκουάζ</td> <td width="11%">#48D1CC</td> <td width="24%">htmlMediumTurquoise</td> </tr><tr><td width="23%">μεσαίο βιολετί κόκκινο</td> <td width="10%"> </td> <td width="30%">μέτριο κόκκινο-ιώδες</td> <td width="11%">#C71585</td> <td width="24%">htmlMediumVioletRed</td> </tr><tr><td width="23%">μεσάνυχτα μπλε</td> <td width="10%"> </td> <td width="30%">μπλε της νύχτας</td> <td width="11%">#191970 </td> <td width="24%">htmlMidnightBlue</td> </tr><tr><td width="23%">κρέμα μέντας</td> <td width="10%"> </td> <td width="30%">κρέμα μέντας</td> <td width="11%">#F5FFFA</td> <td width="24%">htmlMintCream</td> </tr><tr><td width="23%">mistyrose</td> <td width="10%"> </td> <td width="30%">μουντό ροζ</td> <td width="11%">#FFE4E1</td> <td width="24%">htmlMistyRose</td> </tr><tr><td width="23%">είδος φιδιού</td> <td width="10%"> </td> <td width="30%">τέλμα</td> <td width="11%">#FFE4B5</td> <td width="24%">htmlΜοκασίνη</td> </tr><tr><td width="23%">navjowhite</td> <td width="10%"> </td> <td width="30%">βρώμικο γκρι</td> <td width="11%">#FFDEAD</td> <td width="24%">htmlNavajoWhite</td> </tr><tr><td width="23%">ναυτικό</td> <td width="10%"> </td> <td width="30%">σκούρο μπλε</td> <td width="11%">#000080 </td> <td width="24%">htmlΝαυτικό</td> </tr><tr><td width="23%">oldlace</td> <td width="10%"> </td> <td width="30%">παλιό κονιάκ</td> <td width="11%">#FDF5E6</td> <td width="24%">htmlOldLace</td> </tr><tr><td width="23%">ελιά</td> <td width="10%"> </td> <td width="30%">ελιά</td> <td width="11%">#808000 </td> <td width="24%">htmlΕλιά</td> </tr><tr><td width="23%">ελαιόλαδο</td> <td width="10%"> </td> <td width="30%">θαμπή ελιά</td> <td width="11%">#6B8E23</td> <td width="24%">htmlOliveDrab</td> </tr><tr><td width="23%">πορτοκάλι</td> <td width="10%"> </td> <td width="30%">πορτοκάλι</td> <td width="11%">#FFA500</td> <td width="24%">htmlΠορτοκαλί</td> </tr><tr><td width="23%">πορτοκαλιασμένος</td> <td width="10%"> </td> <td width="30%">κόκκινο-πορτοκαλί</td> <td width="11%">#FF4500</td> <td width="24%">htmlΠορτοκαλόκόκκινο</td> </tr><tr><td width="23%">ορχιδέα</td> <td width="10%"> </td> <td width="30%">ορχεοειδής</td> <td width="11%">#DA70D6</td> <td width="24%">htmlΟρχιδέα</td> </tr><tr><td width="23%">palegoldenrod</td> <td width="10%"> </td> <td width="30%">απαλό χρυσό</td> <td width="11%">#EEE8AA</td> <td width="24%">htmlPaleGoldenRod</td> </tr><tr><td width="23%">παλαιπράσινο</td> <td width="10%"> </td> <td width="30%">απαλό πράσινο</td> <td width="11%">#98FB98</td> <td width="24%">htmlPaleGreen</td> </tr><tr><td width="23%">παλετουρκουάζ</td> <td width="10%"> </td> <td width="30%">απαλό τιρκουάζ</td> <td width="11%">#ΑΦΕΕΕΕ</td> <td width="24%">htmlPaleTurquoise</td> </tr><tr><td width="23%">παλαιοιώδες</td> <td width="10%"> </td> <td width="30%">απαλό κόκκινο-ιώδες</td> <td width="11%">#DB7093</td> <td width="24%">htmlPaleVioletRed</td> </tr><tr><td width="23%">μαστίγιο παπάγια</td> <td width="10%"> </td> <td width="30%">πεπόνια</td> <td width="11%">#FFFD5</td> <td width="24%">htmlPapayaWhip</td> </tr><tr><td width="23%">ροδάκινο</td> <td width="10%"> </td> <td width="30%">ροδάκινο</td> <td width="11%">#FFDAB9</td> <td width="24%">htmlPeachPuff</td> </tr><tr><td width="23%">Περού</td> <td width="10%"> </td> <td width="30%">καστανός</td> <td width="11%">#CD853F</td> <td width="24%">htmlΠερού</td> </tr><tr><td width="23%">ροζ</td> <td width="10%"> </td> <td width="30%">ροζ</td> <td width="11%">#FFC0CB</td> <td width="24%">htmlΡοζ</td> </tr><tr><td width="23%">δαμάσκηνο</td> <td width="10%"> </td> <td width="30%">δαμάσκηνο</td> <td width="11%">#DDA0DD</td> <td width="24%">htmlΔαμάσκηνο</td> </tr><tr><td width="23%">μπλε πούδρα</td> <td width="10%"> </td> <td width="30%">μουντό μπλε</td> <td width="11%">#B0E0E6</td> <td width="24%">htmlΜπλε σε σκόνη</td> </tr><tr><td width="23%">μωβ</td> <td width="10%"> </td> <td width="30%">μωβ</td> <td width="11%">#800080 </td> <td width="24%">htmlΜωβ</td> </tr><tr><td width="23%">κόκκινος</td> <td width="10%"> </td> <td width="30%">κόκκινος</td> <td width="11%">#FF0000</td> <td width="24%">htmlΚόκκινο</td> </tr><tr><td width="23%">ροζ καστανή</td> <td width="10%"> </td> <td width="30%">ροζ-καφέ</td> <td width="11%">#BC8F8F</td> <td width="24%">htmlΚαφέ Ροζ</td> </tr><tr><td width="23%">βασιλικό μπλε</td> <td width="10%"> </td> <td width="30%">βασιλικό μπλε</td> <td width="11%">#4169E1</td> <td width="24%">htmlRoyalBlue</td> </tr><tr><td width="23%">καστανή σέλα</td> <td width="10%"> </td> <td width="30%">παλιό δέρμα</td> <td width="11%">#8B4513</td> <td width="24%">htmlSaddleBrown</td> </tr><tr><td width="23%">σολομός</td> <td width="10%"> </td> <td width="30%">πορτοκαλοροζ</td> <td width="11%">#FA8072</td> <td width="24%">htmlΣολομός</td> </tr><tr><td width="23%">αμμοκαφέ</td> <td width="10%"> </td> <td width="30%">κόκκινο-καφέ</td> <td width="11%">#F4A460</td> <td width="24%">htmlSandyBrown</td> </tr><tr><td width="23%">θαλάσσιο πράσινο</td> <td width="10%"> </td> <td width="30%">κύμα της θάλασσας</td> <td width="11%">#2E8B57</td> <td width="24%">htmlSeaGreen</td> </tr><tr><td width="23%">κοχύλι</td> <td width="10%"> </td> <td width="30%">θαλασσινός αφρός</td> <td width="11%">#FFF5EE</td> <td width="24%">htmlSeaShell</td> </tr><tr><td width="23%">χώμα σιένης</td> <td width="10%"> </td> <td width="30%">ώχρα</td> <td width="11%">#A0522D</td> <td width="24%">htmlΣιένα</td> </tr><tr><td width="23%">ασήμι</td> <td width="10%"> </td> <td width="30%">ασήμι</td> <td width="11%">#C0C0C0</td> <td width="24%">htmlΑσημί</td> </tr><tr><td width="23%">μπλε του ουρανού</td> <td width="10%"> </td> <td width="30%">μπλε του ουρανού</td> <td width="11%">#87CEEB</td> <td width="24%">htmlSkyBlue</td> </tr><tr><td width="23%">σχιστόλιθος</td> <td width="10%"> </td> <td width="30%">γκριζωπό μπλε</td> <td width="11%">#6A5ACD</td> <td width="24%">htmlSlateBlue</td> </tr><tr><td width="23%">σχιστόλιθος γκρι</td> <td width="10%"> </td> <td width="30%">γαλαζωπό γκρι</td> <td width="11%">#708090 </td> <td width="24%">htmlSlateGrey</td> </tr><tr><td width="23%">χιόνι</td> <td width="10%"> </td> <td width="30%">χιόνι</td> <td width="11%">#FFFAFA</td> <td width="24%">htmlΧιόνι</td> </tr><tr><td width="23%">ανοιξιάτικο</td> <td width="10%"> </td> <td width="30%">ανοιξιάτικο πράσινο</td> <td width="11%">#00FF7F</td> <td width="24%">htmlSpringGreen</td> </tr><tr><td width="23%">ατσάλι μπλε</td> <td width="10%"> </td> <td width="30%">ατσάλι μπλε</td> <td width="11%">#4682B4</td> <td width="24%">htmlSteelBlue</td> </tr><tr><td width="23%">βυρσοδέψω</td> <td width="10%"> </td> <td width="30%">βυρσοδέψω</td> <td width="11%">#D2B48C</td> <td width="24%">htmlΤαν</td> </tr><tr><td width="23%">βάσκας</td> <td width="10%"> </td> <td width="30%">τσάι</td> <td width="11%">#008080 </td> <td width="24%">htmlΤεσάνι</td> </tr><tr><td width="23%">γαϊδουράγκαθο</td> <td width="10%"> </td> <td width="30%">γαϊδουράγκαθο</td> <td width="11%">#D8BFD8</td> <td width="24%">htmlΓαϊδουράγκαθο</td> </tr><tr><td width="23%">ντομάτα</td> <td width="10%"> </td> <td width="30%">ντομάτα</td> <td width="11%">#FF6347</td> <td width="24%">htmlΝτομάτα</td> </tr><tr><td width="23%">τουρκουάζ</td> <td width="10%"> </td> <td width="30%">τουρκουάζ</td> <td width="11%">#40E0D0</td> <td width="24%">htmlΤυρκουάζ</td> </tr><tr><td width="23%">βιολέτα</td> <td width="10%"> </td> <td width="30%">βιολέτα</td> <td width="11%">#EE82EE</td> <td width="24%">htmlΒιολετί</td> </tr><tr><td width="23%">σιτάρι</td> <td width="10%"> </td> <td width="30%">σιτάρι</td> <td width="11%">#F5DEB3</td> <td width="24%">htmlΣιτάρι</td> </tr><tr><td width="23%">λευκό</td> <td width="10%"> </td> <td width="30%">λευκό</td> <td width="11%">#FFFFFF</td> <td width="24%">htmlΛευκό</td> </tr><tr><td width="23%">ασπροκαπνός</td> <td width="10%"> </td> <td width="30%">λευκή καπνιστή</td> <td width="11%">#F5F5F5</td> <td width="24%">htmlWhiteSmoke</td> </tr><tr><td width="23%">κίτρινος</td> <td width="10%"> </td> <td width="30%">κίτρινος</td> <td width="11%">#FFFF00</td> <td width="24%">htmlΚίτρινο</td> </tr><tr><td width="23%">κιτρινοπράσινο</td> <td width="10%"> </td> <td width="30%">κιτρινοπράσινο</td> <td width="11%">#9ACD32</td> <td width="24%">htmlΚίτρινο Πράσινο</td> </tr></tbody></table> <p>Σε HTML, όλα όσα γράφετε σε ένα έγγραφο HTML θα εμφανίζονται στην οθόνη του προγράμματος περιήγησης ως συμπαγές κείμενο, δηλαδή, το πρόγραμμα περιήγησης αγνοεί αλλαγές γραμμής και πολλά κενά που πληκτρολογείτε στη σειρά αντικαθίστανται από ένα.</p> <p>Οι ετικέτες είναι εντολές ελέγχου που επινοήθηκαν για να μορφοποιήσουν κείμενο, δηλ. Οι ετικέτες λένε στο πρόγραμμα περιήγησης ακριβώς πώς να εμφανίζει το τμήμα του κειμένου που περικλείεται στις ετικέτες. Για να δημιουργήσετε μια ετικέτα, εισάγετε κώδικα HTML ανάμεσα στις αγκύλες, ο οποίος προορίζεται μόνο για προγράμματα περιήγησης. Οι επισκέπτες του ιστότοπου δεν βλέπουν ετικέτες.</p> <p>Όπως σημειώθηκε παραπάνω, όλες οι ετικέτες ξεκινούν με γωνιακό βραχίονα< и заканчиваются угловой скобкой >. Το στήριγμα γωνίας ανοίγματος ακολουθείται από το όνομα της ετικέτας (εντολή).</p> <p>Για παράδειγμα, tag <b><em> </b>Σχεδιασμένα για να τονίζουν το κείμενο, τα προγράμματα περιήγησης εμφανίζουν αυτό το κείμενο με πλάγιους χαρακτήρες. Όταν το πρόγραμμα περιήγησης συναντήσει αυτήν την ετικέτα, αλλάζει στη μορφοποίηση του κειμένου που ακολουθεί την ετικέτα με πλάγια γραμματοσειρά.</p> <p>Ας δούμε ένα παράδειγμα:</p><p>Αυτό το κείμενο είναι φυσιολογικό. <em><i>Αυτό το κείμενο είναι με πλάγιους χαρακτήρες.</i> </p><p>Ετικέτα <b><em> </b>ονομάζεται ετικέτα έναρξης ή ανοίγματος, που σημαίνει ότι το πρόγραμμα περιήγησης έχει συμπεριλάβει μια συγκεκριμένη εντολή (σε αυτήν την περίπτωση, γράφοντάς την με πλάγιους χαρακτήρες). Οι περισσότερες ετικέτες έχουν ένα ζεύγος με τη μορφή ετικέτας κλεισίματος που απενεργοποιεί την εντολή.</p> <p>Η ετικέτα κλεισίματος μοιάζει με την αρχική ετικέτα, αλλά ξεκινά με κάθετο. Έτσι, η ετικέτα τέλους για τους πλάγιους χαρακτήρες είναι - <b></em> </b>.</p> <p>Ας δούμε ένα παράδειγμα:</p><p>Αυτό το κείμενο είναι φυσιολογικό. <em><i>Προσοχή! Κυρτά γράμματα.</i> </em>Αυτή είναι και πάλι μια κανονική γραμματοσειρά.</p><p>Όπως ίσως έχετε παρατηρήσει, το πρόγραμμα περιήγησης αναλύει διαδοχικά το έγγραφο HTML αναζητώντας εντολές (tags) και εφαρμόζει ή απενεργοποιεί διάφορες επιλογές μορφοποίησης κειμένου. Το πρόγραμμα περιήγησης εμφανίζει μορφοποιημένο κείμενο (ό,τι δεν είναι ετικέτα) στο παράθυρό του.</p> <table class="notice example"><tr><th><i> </i> </th> <td>Η διαδικασία εισαγωγής ετικετών σε απλό, μη μορφοποιημένο κείμενο ονομάζεται σήμανση σε ένα έγγραφο HTML και οι ετικέτες ονομάζονται χαρακτήρες σήμανσης. Κατά τη σύνταξη ετικετών, δεν λαμβάνεται υπόψη η κεφαλαία και η πεζή ετικέτα.</td> </tr></table><p>Ακολουθούν παραδείγματα βασικών ετικετών HTML, με επεξήγηση της χρήσης τους, καθώς και παραδείγματα για το πώς μπορούν να χρησιμοποιηθούν σε ένα έγγραφο HTML.</p> <h2>Επικεφαλίδες</h2> <p>Υπάρχει μια ειδική ετικέτα για τον καθορισμό επικεφαλίδων σε HTML. Υπάρχουν 6 επίπεδα επικεφαλίδων σε HTML, που κυμαίνονται από εκείνα για τις πιο σημαντικές ανακοινώσεις έως εκείνα για τις λιγότερο σημαντικές.</p> <p>Το έχουμε ήδη καταλάβει. Διαπιστώσαμε ότι έχουν περιεχόμενο. Ωστόσο, δεν είναι μόνο αυτό. Οι ετικέτες έχουν επίσης χαρακτηριστικά που ενισχύουν τις δυνατότητές τους και τα χαρακτηριστικά με τη σειρά τους έχουν τιμές. Με τη βοήθειά τους, μπορείτε να ορίσετε παραμέτρους για ένα στοιχείο και να καθορίσετε το στυλ σχεδίασης. Για παράδειγμα, με την ετικέτα</p> <p>σημειώσατε την παράγραφο. Αλλά πώς να το κάνετε ευθυγραμμισμένο προς τα δεξιά; Για να γίνει αυτό, θα χρειαστείτε ένα συγκεκριμένο χαρακτηριστικό με την αντίστοιχη τιμή. Ακριβώς όπως ορισμένες ετικέτες δεν έχουν ζεύγος, ορισμένα χαρακτηριστικά μπορούν να χρησιμοποιηθούν χωρίς τιμές.</p> <h2>Πώς να γράψετε ιδιότητες;</h2> <p>Τα χαρακτηριστικά είναι δεσμευμένες λέξεις (όπως ετικέτες, μόνο χωρίς αγκύλες), αλλά η σημασία τους μπορεί να είναι διαφορετική. Ακριβώς όπως οι ετικέτες, συνιστάται να γράφετε χαρακτηριστικά με τιμές με μικρά γράμματα, αν και τα προγράμματα περιήγησης, γενικά, δεν ενδιαφέρονται - αυτός είναι απλώς ένας κανόνας καλών τρόπων: στα ρωσικά, ΕΠΙΣΗΣ ΔΕΝ ΕΙΝΑΙ ΑΠΟΔΕΚΤΟ ΝΑ ΓΡΑΨΕΤΕ ΤΟ CAPS LOCK ΕΙΝΑΙ ΕΝΕΡΓΟΠΟΙΗΜΕΝΟ. Γιατί η HTML είναι χειρότερη;</p> <p>Οι τιμές των χαρακτηριστικών γράφονται με την ακόλουθη μορφή:</p><p>Χαρακτηριστικό=”value” lang=”en”</p> <p>Θα πρέπει πάντα να γράφετε χαρακτηριστικά μέσα στην αρχική ετικέτα, μετά τη δεσμευμένη λέξη.</p> <p> <p align=”center”>Παράγραφος</p></p> <p>Συνήθως υπάρχουν πολλά διαθέσιμα χαρακτηριστικά για μια μεμονωμένη ετικέτα. Δεν έχει σημασία με ποια σειρά αναφέρονται.</p> <h2>Καθολικές ιδιότητες</h2> <p>Κάθε ετικέτα HTML έχει το δικό της σύνολο χαρακτηριστικών. Ορισμένα χαρακτηριστικά μπορεί να είναι διαθέσιμα για πολλές ετικέτες, ενώ άλλα μπορεί να λειτουργούν μόνο με μία. Υπάρχει επίσης μια ομάδα καθολικών (καθολικών) χαρακτηριστικών που μπορούν να χρησιμοποιηθούν με οποιαδήποτε ετικέτα. Ας δούμε εν συντομία τα χαρακτηριστικά αυτής της κατηγορίας.</p> <ul><li><b>κλειδί πρόσβασης</b>σας επιτρέπει να ορίσετε μια συντόμευση πληκτρολογίου για πρόσβαση σε ένα συγκεκριμένο αντικείμενο σελίδας. Για παράδειγμα, μπορείτε να χρησιμοποιήσετε τη συντόμευση πληκτρολογίου για να <b>Alt+1</b>ο χρήστης ακολούθησε έναν συγκεκριμένο σύνδεσμο. Έτσι, αναπτύξτε ένα βασικό σύστημα πλοήγησης.</li> </ul><p>Η τιμή του χαρακτηριστικού μπορεί να είναι αριθμοί 0-9 ή γράμματα του λατινικού αλφαβήτου:</p> <p> <a acceskey=”1” href=”https://youtube.com”>Ο σύνδεσμος θα ανοίξει πατώντας το συνδυασμό πλήκτρων με ένα</a></p> <ul><li><b>τάξη</b>σας επιτρέπει να συσχετίσετε μια ετικέτα με μια προκαθορισμένη σχεδίαση χρησιμοποιώντας CSS. Η χρήση ενός χαρακτηριστικού σάς επιτρέπει να μειώσετε σημαντικά τον κώδικα, επειδή αντί να επαναλάβετε το ίδιο μπλοκ CSS, μπορείτε απλώς να εισαγάγετε το όνομα της αντίστοιχης κλάσης.</li> <li>Με τη χρήση <b>ικανοποιητικός επεξεργάσιμος</b>μπορείτε να επιτρέψετε στον χρήστη να επεξεργαστεί οποιοδήποτε στοιχείο της σελίδας HTML: διαγραφή, εισαγωγή, αλλαγή κειμένου. Το ίδιο χαρακτηριστικό καθιστά δυνατή την επεξεργασία και την απενεργοποίηση. Έχει μόνο δύο έννοιες: <b>αληθής</b>- να επιτρέπεται η επεξεργασία, <b>ψευδής</b>- απαγόρευση.</li> <li>Χρησιμοποιώντας το χαρακτηριστικό <b>μενού περιβάλλοντος</b>Μπορείτε να αντιστοιχίσετε οποιοδήποτε στοιχείο του εγγράφου με μοναδικά στοιχεία μενού περιβάλλοντος κατά την κρίση σας. Το ίδιο το μενού δημιουργείται στην ετικέτα <b><menu> </b>, και στο χαρακτηριστικό μενού περιβάλλοντος δίνεται το αναγνωριστικό του.</li> <li><b>σκην</b>καθορίζει την κατεύθυνση του κειμένου: από αριστερά προς τα δεξιά <b>(ltr)</b>ή από δεξιά προς τα αριστερά <b>(rtl)</b>.</li> <li><b>σύρσιμο</b>σας επιτρέπει να απαγορεύσετε <b>(ψευδής)</b>ή επιτρέψτε <b>(αληθής)</b>ο χρήστης μπορεί να σύρει και να αποθέσει ένα στοιχείο σελίδας που διαθέτει αυτό το χαρακτηριστικό.</li> <li><b>dropzone</b>λέει στο πρόγραμμα περιήγησης τι να κάνει με το στοιχείο που έχει συρθεί: copy(value <b>αντίγραφο</b>), μετακίνηση ( <b>κίνηση</b>) ή δημιουργήστε έναν σύνδεσμο προς αυτό <b>(σύνδεσμος)</b>.</li> <li><b>κεκρυμμένος</b>- ένα χαρακτηριστικό που σας επιτρέπει να αποκρύψετε το περιεχόμενο ενός στοιχείου έτσι ώστε να μην εμφανίζεται στο πρόγραμμα περιήγησης. Εάν το χαρακτηριστικό οριστεί σε false, το αντικείμενο εμφανίζεται, true - είναι κρυφό.</li> <li><b>ταυτότητα</b>καθορίζει το αναγνωριστικό στοιχείου - ένα είδος ονόματος που απαιτείται για την απλή αλλαγή του στυλ του αντικειμένου, καθώς και για την πρόσβαση σε σενάρια. Η τιμή του χαρακτηριστικού θα είναι το όνομά του. Πρέπει να ξεκινά με λατινικό γράμμα και μπορεί να περιέχει αριθμούς, γράμματα του ίδιου λατινικού αλφαβήτου (μεγάλο και μικρό), καθώς και παύλες <b>(-) </b>και υπογραμμίζει <b>(_) </b>. Δεν μπορεί να περιέχει ρωσικά γράμματα.</li> <li><b>lang</b>βοηθά το πρόγραμμα περιήγησης να καταλάβει σε ποια γλώσσα είναι γραμμένο το περιεχόμενο και να το διαμορφώσει ανάλογα (για παράδειγμα, οι γλώσσες μπορεί να χρησιμοποιούν διαφορετικά εισαγωγικά). Οι τιμές είναι κωδικοί γλώσσας (Ρωσικά - <b>ru</b>, αγγλικά - <b>en</b>και τα λοιπά.).</li> <li><b>ορθογραφικός έλεγχος</b>περιλαμβάνει <b>(αληθής)</b>ή απενεργοποιεί <b>(ψευδής)</b>ορθογραφικός έλεγχος. Είναι ιδιαίτερα χρήσιμο να χρησιμοποιείτε το χαρακτηριστικό σε ετικέτες πεδίων φόρμας όπου ο χρήστης θα εισάγει κείμενο.</li> <li><b>στυλ</b>σας επιτρέπει να ορίσετε τη σχεδίαση ενός στοιχείου χρησιμοποιώντας κώδικα CSS.</li> <li><b>ευρετήριο καρτελών</b>καθιστά δυνατό τον προσδιορισμό πόσες φορές ο χρήστης θα πρέπει να πατήσει το πλήκτρο Tab για να εστιάζει ένα αντικείμενο με αυτό το χαρακτηριστικό. Ο αριθμός των κλικ καθορίζει την τιμή του χαρακτηριστικού - ένας θετικός ακέραιος αριθμός.</li> <li><b>τίτλος</b>- μια επεξήγηση εργαλείου που εμφανίζεται αν μετακινήσετε το ποντίκι σε ένα στοιχείο και το αφήσετε ακίνητο για λίγο. Η γραμμή στο νόημα θα είναι μια υπόδειξη.</li> </ul> <ul><li><b>μεταφράζω</b>επιτρέπει <b>(Ναί)</b>ή απαγορεύει <b>(Όχι)</b>μετάφραση των περιεχομένων της ετικέτας.</li> <li><b>ευθυγραμμίζω</b>ορίζει την ευθυγράμμιση του στοιχείου. Για παράδειγμα, μπορείτε να το χρησιμοποιήσετε για να στοιχίσετε το κείμενο προς τα αριστερά (τιμή <b>αριστερά</b>), κατά μήκος της δεξιάς άκρης ( <b>δικαίωμα</b>), στο κέντρο <b>(κέντρο)</b>ή πλάτος <b>(δικαιολογώ)</b>. Για εικόνες (ετικέτα <b><img> </b>) είναι επίσης διαθέσιμη η στοίχιση στο επάνω περίγραμμα του ψηλότερου στοιχείου στη γραμμή ( <b>κορυφή</b>), κατά μήκος του κάτω ορίου <b>(κάτω μέρος)</b>, και η τιμή μέση κάνει τη μεσαία γραμμή της εικόνας να συμπίπτει με τη γραμμή βάσης της σειράς.</li> </ul><p>Αξίζει να έχετε κατά νου ότι χρησιμοποιώντας το χαρακτηριστικό <b>ευθυγραμμίζω</b>Δεν συνιστάται και είναι καλύτερο να στοιχίσετε το κείμενο χρησιμοποιώντας CSS.</p> <h2>Παράδειγμα χρήσης χαρακτηριστικών</h2> <p>Για παράδειγμα, λάβετε υπόψη τη γραμμή του κώδικα HTML:</p> <p> <p contenteditable=”true”>Αυτό το κείμενο μπορεί να επεξεργαστεί</p></p> <p>Ολόκληρη η γραμμή δημιουργεί μια παράγραφο κειμένου που ο χρήστης μπορεί να επεξεργαστεί στο πρόγραμμα περιήγησης.</p> <p>Ας δούμε κάθε στοιχείο της γραμμής.</p> <p><b><p> </b>- την ετικέτα ανοίγματος του δοχείου που αποθηκεύει την παράγραφο.</p> </b>- ετικέτα κλεισίματος.</p> <p>Ανάμεσα σε χαρακτήρες <b>> </b>Και <b>< </b>Το κείμενο βρίσκεται Αυτό το κείμενο μπορεί να επεξεργαστεί. Αυτή είναι μια επιγραφή έξω από τις ετικέτες (μεταξύ τους), που σημαίνει ότι θα είναι ορατή στον χρήστη που ανοίγει τη σελίδα. Το πρόγραμμα περιήγησης το αντιλαμβάνεται ως απλό κείμενο που πρέπει να εμφανίζεται στην οθόνη.</p> <p><b>ικανοποιητικός επεξεργάσιμος</b>=”<b>αληθής</b>” - αυτό είναι το χαρακτηριστικό και το νόημά του. Θυμηθείτε πώς στο σχολείο: x=3. Το ίδιο και εδώ: <b>ικανοποιητικός επεξεργάσιμος</b>=”<b>αληθής</b>" Ιδιότης <b>ικανοποιητικός επεξεργάσιμος</b>καθορίζει εάν ο χρήστης μπορεί να επεξεργαστεί τα περιεχόμενα του στοιχείου, την τιμή <b>αληθής</b>, γραμμένο σε εισαγωγικά χωρισμένα με σύμβολο ίσου, η επεξεργασία επιτρέπει:</p> <p>Χαρακτηριστικό=”value” contenteditable=”true”</p> <p>Οι βασικές ετικέτες html είναι η βάση πάνω στην οποία χτίζεται σχεδόν κάθε ιστότοπος/ιστολόγιο. Από αυτό το άρθρο θα μάθετε ακριβώς εκείνο το 20% των ετικετών που θα χρειάζεστε πάντα.</p> <p>Όπως σε κάθε γλώσσα, ακόμα και εδώ, ισχύει ο κανόνας Pareto του 20/80 (το 20% των πραγμάτων είναι 80% σημαντικό για την επίτευξη του επιθυμητού αποτελέσματος), που σημαίνει ότι αρκεί να γνωρίζεις μόνο το 20% των κωδικών για να πετύχεις με σιγουριά τους στόχους σας στην κατασκευή ιστοσελίδων.</p><p>Η HTML δεν είναι γλώσσα προγραμματισμού, επειδή είναι μια γλώσσα σήμανσης υπερκειμένου, η οποία μιλάει από μόνη της, σας επιτρέπει να επισημαίνετε μπλοκ σε σελίδες για σωστή εμφάνιση και να επισημαίνετε κείμενο για ιστοσελίδες. Χρησιμοποιείται επίσης για τη δημιουργία συνδέσμων από τη μια σελίδα του ιστότοπου σε μια άλλη. Όλοι οι σύνδεσμοι στο Διαδίκτυο δημιουργούνται χρησιμοποιώντας το τμήμα υπερκειμένου του κώδικα html.</p> <p>- αυτή είναι η πιο απλή γλώσσα! Εάν αποφασίσετε να το μελετήσετε, τότε είναι σημαντικό να καταλάβετε από την αρχή ότι δεν υπάρχει καμία δυσκολία σε αυτό. Μπορούμε να πούμε με σιγουριά ότι στο σχολείο τα παιδιά περνούν πολύ πιο δύσκολα στα μαθήματα πληροφορικής.</p> <p>Ας ξεκινήσουμε λοιπόν. Είναι καλύτερο να γράφετε κωδικούς σε ένα σημειωματάριο, το οποίο περιλαμβάνεται στα τυπικά προγράμματα του λειτουργικού συστήματος Windows ή στο δωρεάν πρόγραμμα "Notepad + +".</p> <p>Αρχικά, ας ορίσουμε τι είναι μια ετικέτα. Μια ετικέτα είναι ένα κελί της ίδιας της γλώσσας HTML, από το οποίο είναι γενικά κατασκευασμένο. Χρησιμοποιώντας ετικέτες, τα προγράμματα περιήγησης κατανοούν πώς να εμφανίζουν κείμενο και πού να εισάγουν εικόνες. Οι ετικέτες είναι τα ίδια τα στοιχεία σήμανσης.</p> <h2>Ετικέτες HTML για τη δημιουργία πλαισίου ιστότοπου</h2> <p>Οι ετικέτες μπορούν να αντιστοιχιστούν ή να αποσυνδεθούν. Τα ζευγαρωμένα ανοίγουν και κλείνουν, δηλ. αυτά που κλείνουν περιέχουν ανάστροφη κάθετο "/".</p> <p>Το πρώτο πράγμα που πρέπει να υπάρχει σε οποιοδήποτε έγγραφο html κατά τη δημιουργία μιας σελίδας ιστολογίου είναι:</p> <ul><li><!DOCTYPE HTML PUBLIC «-//w3c//DTD HTML 4.01 Transitional//EN»- указание версии</li> <li><html> </html>— πείτε στο πρόγραμμα περιήγησης ότι ό,τι υπάρχει μεταξύ τους είναι κώδικας html.</li> <li><head> </head>- από τα αγγλικά Το "head", περιέχει το όνομα, την κωδικοποίηση, τις μετα-ετικέτες για τις μηχανές αναζήτησης.</li> <li><title>ΟΝΟΜΑ</title>— μια μετα-ετικέτα, κυρίως για μηχανές αναζήτησης, περιέχει το όνομα του εγγράφου μέσα και εμφανίζεται στο επάνω μέρος του προγράμματος περιήγησης.</li> <li><meta http-eguiv=»Content-Type» content=»text/html; charset=windows-1251″>- μια μεμονωμένη ετικέτα που υποδεικνύει τη γλώσσα που κωδικοποιεί το πρόγραμμα περιήγησης, όπου windows-1251 - υποδεικνύει ότι το κείμενο αυτής της σελίδας είναι στα Ρωσικά (windows-1252 - για Αγγλικά).</li> <li><meta name=»keywords» content=»КЛЮЧЕВЫЕ СЛОВА»>— για λέξεις-κλειδιά ιστότοπου·</li> <li><meta name=»description» content=»ОПИСАНИЕ»>— περίληψη της σελίδας·</li> <li><body>ΣΩΜΑ ΤΟΥ ΕΓΓΡΑΦΟΥ<script type="text/javascript"> <!-- var _acic={dataProvider:10};(function(){var e=document.createElement("script");e.type="text/javascript";e.async=true;e.src="https://www.acint.net/aci.js";var t=document.getElementsByTagName("script")[0];t.parentNode.insertBefore(e,t)})() //--> </script><br> <br> </body>- από τα αγγλικά Το "body" περιέχει ολόκληρη τη σελίδα του ιστότοπου.</li> </ul><p>Αυτά ήταν <b>τυπικές ετικέτες κώδικα html</b>, από το οποίο, χωρίς αλλαγές, όλες οι σελίδες του ιστότοπου/ιστολογίου θα πρέπει να ξεκινούν με αυτήν τη μορφή:</p> <p><!DOCTYPE HTML PUBLIC «-//w3c//DTD HTML 4.01 Transitional//EN» «http://www.w3.org/TR/html4/loose.dtd»></p> <p><html><br> <head><br> <title></title><br> <meta http-eguiv=»Content-Type» content=»text/html; charset=windows-1251″><br> <meta name=»keywords» content=»»><br> <meta name=»description» content=»»><br> </head><br> <body><script type="text/javascript"> <!-- var _acic={dataProvider:10};(function(){var e=document.createElement("script");e.type="text/javascript";e.async=true;e.src="https://www.acint.net/aci.js";var t=document.getElementsByTagName("script")[0];t.parentNode.insertBefore(e,t)})() //--> </script><br> <br> </body><br> </html></p> <h3>Λίστα ετικετών html που βρίσκονται στο σώμα της σελίδας</h3> <p>Ανάμεσα σε ετικέτες <body><script type="text/javascript"> <!-- var _acic={dataProvider:10};(function(){var e=document.createElement("script");e.type="text/javascript";e.async=true;e.src="https://www.acint.net/aci.js";var t=document.getElementsByTagName("script")[0];t.parentNode.insertBefore(e,t)})() //--> </script><br> <br> </body>Το σώμα της σελίδας του ιστότοπου θα βρίσκεται όπου:</p> <ul><li><h1>τίτλος</h1>- το πιο σημαντικό <i> </i> 1 επίπεδο;</li> <li>Με <h2>υπότιτλος</h2>Με <h6>υπότιτλος</h6>— διακρίσεις των επιπέδων 2, 3, 4, 5 και 6, αντίστοιχα·</li> <li><a href=»http://www.адрес.ru» target=»_blank» title=»название»>συνδέσμους αγκύρωσης</a>— σύνδεσμος, όπου “target=”_blank”” είναι το χαρακτηριστικό που είναι υπεύθυνο για το άνοιγμα σε νέο παράθυρο, “title=”” το όνομα του οποίου θα είναι ο σύνδεσμος.</li> <li><strong></strong>και — ετικέτες για επισήμανση με έντονους χαρακτήρες. Το "" έχει καταργηθεί και συνιστάται η χρήση του " <strong></strong>»;</li> <li><em></em>- για πλάγιους χαρακτήρες</li> <li><img src='/life-hacks-wi-fi/znachenie-tegov-v-html-osnovnye-tegi-html.html' loading=lazy loading=lazy>— μια ενιαία ετικέτα υπεύθυνη για την εισαγωγή μιας εικόνας στη σελίδα.</li> <li>- "p" από τα αγγλικά. «παράγραφος», που σημαίνει ότι χωρίζει το κείμενο σε παραγράφους. Από προεπιλογή είναι ευθυγραμμισμένο προς τα αριστερά.</li> <li><br>— μια λογική ετικέτα που υποδεικνύει το τέλος της γραμμής και τη μετάβαση στην επόμενη·</li> <li>— χαρακτηριστικό που ευθυγραμμίζει το κείμενο στο κέντρο·</li> <li>— χαρακτηριστικό που ευθυγραμμίζει το κείμενο προς τα δεξιά.</li> <li><font color=»green» face=»verdana» size=»3″></font> —</li> <li>Το color="green" είναι υπεύθυνο για το χρώμα του κειμένου. Σε αυτή την περίπτωση είναι πράσινο. Η λέξη "πράσινο" συνήθως αντικαθίσταται από έναν δεκαεξαδικό χρωματικό κώδικα, για παράδειγμα: "#088f47".</li> <li>face="verdana" - χαρακτηριστικό που υποδεικνύει τη γραμματοσειρά στο κείμενο.</li> <li>size=”3″ — μέγεθος γραμματοσειράς;</li> <li><ol><li>πρώτα</li><li>δεύτερος</li><li>τρίτος</li></ol>- αριθμημένη λίστα.</li> <li><ul><li>λέξη</li><li>λέξη</li><li>λέξη</li></ul>- λίστα με κουκκίδες</li> </ul><h3>Ετικέτες HTML για τη δημιουργία πίνακα</h3> <p>Μπορεί να υπάρχουν πολλές ετικέτες μέσα στον ίδιο τον πίνακα, όπως αλλαγή του χρώματος του περιγράμματος του πίνακα, στοίχιση λέξεων μέσα στον πίνακα κ.λπ., αλλά επειδή το άρθρο αφορά τις κύριες ετικέτες, θα εστιάσουμε μόνο στις ετικέτες για τη δημιουργία του πίνακα εαυτό.</p> <ul><li><table border=»1″ width=»450″ align=»center»></table>— μια ετικέτα υπεύθυνη για τη δημιουργία ενός πίνακα, όπου "1" είναι το πλάτος του περιγράμματος του πίνακα, όπου "450" ​​είναι το πλάτος του πίνακα και γνωρίζετε ήδη το "κέντρο".</li> <li><tr></tr>- ετικέτα που βρίσκεται μέσα " <table></table>" και δημιουργεί μια σειρά στον πίνακα.</li> <li><td width=»150″></td>- δημιουργεί μια στήλη σε μια σειρά, που βρίσκεται μέσα στις ετικέτες " <tr></tr>" Το "150", όπως πιθανώς ήδη μαντέψατε, είναι το πλάτος της στήλης.</li> </ul><p>Πλήρως <b>html ετικέτες πίνακα</b>φαίνονται κάπως έτσι:</p> <p><table border=»1″ width=»450″ align=»center»><br> <tr><br> <td width=»150″><p>κελί Νο. 1</p></td><br> <td width=»150″><p>κελί Νο. 2</p></td><br> <td width=»150″><p>αριθμός κελιού 3</p></td><br> </tr><br> <tr><br> <td width=»150″><p>αριθμός κελιού 4</p></td><br> <td width=»150″><p>αριθμός κελιού 5</p></td><br> <td width=»150″><p>κελί Νο. 6</p></td><br> </tr><br> </table></p> <p>Τονίζω για άλλη μια φορά ότι αυτές είναι οι κύριες ετικέτες του κώδικα html και μπορούν να γίνουν πολλές αλλαγές σε αυτόν. Και αξίζει επίσης να σημειωθεί ότι ο ίδιος ο κώδικας html είναι ένα πρότυπο, χωρίς css, γενικά, θα είναι αδύνατο να κάνουμε κάτι που να αξίζει τον κόπο με αυτό. Μόνο μαζί, html και css κάνουν θαύματα, αλλά κάτι απλό μπορεί να γίνει χωρίς βαθιά γνώση του css, καθαρά σε html.</p> <p>Μάθημα βίντεο με θέμα - «Τι είναι η HTML; Αρχείο html ευρετηρίου: <br><span class="dvzih_BdQLg"></span></p> <h3>Παρακαλώ κοινοποιήστε αν σας άρεσε: <br><br>Μπορεί επίσης να σας ενδιαφέρει να μάθετε:</h3><br><img src='https://i0.wp.com/opartnerke.ru/wp-content/uploads/2012/09/nazvanie_saita.jpg' width="100%" loading=lazy loading=lazy> <script type="text/javascript"> <!-- var _acic={dataProvider:10};(function(){var e=document.createElement("script");e.type="text/javascript";e.async=true;e.src="https://www.acint.net/aci.js";var t=document.getElementsByTagName("script")[0];t.parentNode.insertBefore(e,t)})() //--> </script><br> <br> <script>document.write("<img style='display:none;' src='//counter.yadro.ru/hit;artfast_after?t44.1;r"+ escape(document.referrer)+((typeof(screen)=="undefined")?"": ";s"+screen.width+"*"+screen.height+"*"+(screen.colorDepth? screen.colorDepth:screen.pixelDepth))+";u"+escape(document.URL)+";h"+escape(document.title.substring(0,150))+ ";"+Math.random()+ "border='0' width='1' height='1' loading=lazy loading=lazy>");</script> </div> </article> <div class='yarpp-related'> <div class="related-items"> <div class="headline">Προτείνουμε άλλα άρθρα</div> <div class="items"> <div class="item"> <a href="https://radiobud.ru/el/life-hacks-for-different-systems/chto-oznachaet-ohvat-v-instagramme-chto-delat-chtoby-povysit.html" class="item__link"> <img src="/uploads/9327b0918f44f038b0368c5c1cc29d26.jpg" width="220" height="170" alt="Τι να κάνετε για να αυξήσετε την αφοσίωση στο Instagram;" class="item__image" / loading=lazy loading=lazy> <div class="item__title">Τι να κάνετε για να αυξήσετε την αφοσίωση στο Instagram;</div> </a> </div> <div class="item"> <a href="https://radiobud.ru/el/ios/novye-funkcii-raboty-so-strokami-novye-funkcii-raboty-so-strokami-kak.html" class="item__link"> <img src="/uploads/72cd74f83afa4aa845f817ccfe667943.jpg" width="220" height="170" alt="Νέες συναρτήσεις για εργασία με συμβολοσειρές Πώς να βρείτε εμφανίσεις μιας συμβολοσειράς στο 1c" class="item__image" / loading=lazy loading=lazy> <div class="item__title">Νέες συναρτήσεις για εργασία με συμβολοσειρές Πώς να βρείτε εμφανίσεις μιας συμβολοσειράς στο 1c</div> </a> </div> <div class="item"> <a href="https://radiobud.ru/el/life-hacks-for-ios/opressovka-internet-kabelya-vitaya-para-sposoby-obzhima.html" class="item__link"> <img src="/uploads/b454c7ccabf7b7b7502efef73140df96.jpg" width="220" height="170" alt="Συνεστραμμένο ζεύγος: μέθοδοι πτύχωσης, διάγραμμα σύνδεσης" class="item__image" / loading=lazy loading=lazy> <div class="item__title">Συνεστραμμένο ζεύγος: μέθοδοι πτύχωσης, διάγραμμα σύνδεσης</div> </a> </div> </div> </div> </div> </main> <aside class="sidebar"> <div class="section"> <div class="section__headline">Δημοφιλέστερο</div> <div class="sidebar-items"> <a class="sidebar-item" href="https://radiobud.ru/el/internet/moshchnyi-defragmentator-dlya-windows-7-luchshie-programmy-dlya.html"> <img src="/uploads/cc260a5479314543852123bf25cf6983.jpg" width="75" height="75" alt="Τα καλύτερα προγράμματα για την ανασυγκρότηση του σκληρού σας δίσκου στα Windows" class="sidebar-item__image" / loading=lazy loading=lazy> <div class="sidebar-item__title">Τα καλύτερα προγράμματα για την ανασυγκρότηση του σκληρού σας δίσκου στα Windows</div> </a> <a class="sidebar-item" href="https://radiobud.ru/el/life-hacks/kak-ostavit-kommentarii-pod-video-v-yutube-youtube-kak-pisat-kommentarii-v-yutube.html"> <img src="/uploads/2a25ed39b3e496780b52d932b14b5430.jpg" width="75" height="75" alt="YouTube: πώς να γράφετε σχόλια"Ютубе" к видео Как добавлять комментарии в ютубе" class="sidebar-item__image" / loading=lazy loading=lazy> <div class="sidebar-item__title">YouTube: πώς να γράψετε σχόλια στο YouTube για ένα βίντεο Πώς να προσθέσετε σχόλια στο YouTube</div> </a> <a class="sidebar-item" href="https://radiobud.ru/el/life-hacks-for-smartphones/remont-sotovyh-telefonov-meizu-remont-telefonov-meizu-v-den-obrashcheniya.html"> <img src="/uploads/0bff4bc0b8aea50a3b0e1c70ca4377e6.jpg" width="75" height="75" alt="Επισκευή τηλεφώνου Meizu την ίδια μέρα Οι πιο συχνές κλήσεις στο κέντρο επισκευής της Meizu" class="sidebar-item__image" / loading=lazy loading=lazy> <div class="sidebar-item__title">Επισκευή τηλεφώνου Meizu την ίδια μέρα Οι πιο συχνές κλήσεις στο κέντρο επισκευής της Meizu</div> </a> <a class="sidebar-item" href="https://radiobud.ru/el/program/privet-napishi-mne-svoi-nomer-telefona-odnoklassniki-privet.html"> <img src="/uploads/de7801d5aaa7b4a0b3c8d60bb9ee1670.jpg" width="75" height="75" alt="Γεια, στείλτε μου τον αριθμό τηλεφώνου σας" class="sidebar-item__image" / loading=lazy loading=lazy> <div class="sidebar-item__title">Γεια, στείλτε μου τον αριθμό τηλεφώνου σας</div> </a> <a class="sidebar-item" href="https://radiobud.ru/el/instructions/chto-takoe-blog-wordpress-i-zachem-on-nuzhen-preimushchestva-i-nedostatki.html"> <img src="/uploads/ef277f89ebcc010910738d705207beee.jpg" width="75" height="75" alt="Πλεονεκτήματα και μειονεκτήματα του WordPress Τι είναι το WordPress και πώς να το χρησιμοποιήσετε" class="sidebar-item__image" / loading=lazy loading=lazy> <div class="sidebar-item__title">Πλεονεκτήματα και μειονεκτήματα του WordPress Τι είναι το WordPress και πώς να το χρησιμοποιήσετε</div> </a> <a class="sidebar-item" href="https://radiobud.ru/el/iron/strukturirovannaya-kabelnaya-sistema-9395-strukturirovannaya-kabelnaya.html"> <img src="/uploads/5679ea6502f442f1d16b2ff786c23800.jpg" width="75" height="75" alt="Σύστημα δομημένης καλωδίωσης (SCS)" class="sidebar-item__image" / loading=lazy loading=lazy> <div class="sidebar-item__title">Σύστημα δομημένης καλωδίωσης (SCS)</div> </a> </div> </div> <script> // <![CDATA[ $(document).ready(function() { var floatsidebar = $("#float-sidebar"); var offset = floatsidebar.offset(); var left = offset.left; var top = offset.top; var width = $("#float-sidebar").width(); var height = $("#float-sidebar").height(); $(window).scroll(function() { var scrollTop = $(window).scrollTop(); if (scrollTop >= top) { $('#float-sidebar').css({ left: left + 'px', position: 'fixed', top: "50px", width: width + "px" }); } else { $('#float-sidebar').css({ position: 'static', }); } }); }); // ]]> </script> <div id="float-sidebar"> <div id="laqybe1" style="height:500px;width:270px;" align="center"></div> </div> </aside> </div> <footer class="footer"> <div class="footer-left"> <div class="footer__logo"> <div class="footer__logo-sitename">radiobud.ru</div> </div> <div class="footer__copyright"> <p>© 2024 - radiobud.ru <br /></p> <p>Κριτικές, life hacks, παιχνίδια, προγράμματα</p> </div> <nav class="footer__nav-1"> <ul> <li class="menu-item type-post_type object-page "><a href="https://radiobud.ru/el/sitemap.xml">Χάρτης τοποθεσίας</a></li> </ul> </nav> </div> <nav class="footer__nav-2"><ul> <li class="menu-item type-taxonomy object-category "><a href="https://radiobud.ru/el/feedback.html">Επαφές</a></li> <li class="menu-item type-taxonomy object-category "><a href="">Διαφήμιση</a></li> <li class="menu-item type-taxonomy object-category "><a href="">Σχετικά με τον ιστότοπο</a></li> </ul></nav> <div class="footer__counters"> </div> <div class="footer__note"></div> </footer> </div> </div> <script type='text/javascript' src='https://radiobud.ru/wp-content/themes/radiobud.ru/js/scripts.js'></script> <script type='text/javascript' src='/wp-includes/js/comment-reply.min.js?ver=4.9.1'></script> <script type='text/javascript'> /* <![CDATA[ */ var tocplus = { "smooth_scroll":"1","visibility_show":"\u043f\u043e\u043a\u0430\u0437\u0430\u0442\u044c","visibility_hide":"\u0421\u043a\u0440\u044b\u0442\u044c","width":"Auto"} ; /* ]]> */ </script> <script type='text/javascript' src='https://radiobud.ru/wp-content/plugins/table-of-contents-plus/front.min.js?ver=1509'></script> <script type='text/javascript' src='/wp-includes/js/wp-embed.min.js?ver=4.9.1'></script> <script async="async" type='text/javascript' src='https://radiobud.ru/wp-content/plugins/akismet/_inc/form.js?ver=4.0.2'></script> <script type="text/javascript"> <!-- var _acic={dataProvider:10};(function(){var e=document.createElement("script");e.type="text/javascript";e.async=true;e.src="https://www.acint.net/aci.js";var t=document.getElementsByTagName("script")[0];t.parentNode.insertBefore(e,t)})() //--> </script><br> <br> </body> </html>