Προγραμματισμός

Γνώση Υπολογιστών >> Προγραμματισμός >  >> Γλώσσες Προγραμματισμού Υπολογιστών

Πώς να δημιουργήσετε μια εικόνα Χάρτης Χρησιμοποιώντας HTML Προγραμματισμός

Κατανόηση HTML είναι ένα από τα πιο επινοητικοί γλώσσα προγραμματισμού που θα χρησιμοποιηθούν ώστε να κατασκευάσει μια ιστοσελίδα . Η HTML χρησιμοποιεί ετικέτες για να προσθέσετε χαρακτηριστικά σε ιστοσελίδες σας . Οι τέσσερις ετικέτες που χρησιμοποιείται περισσότερο από τα έγγραφα HTML είναι , , και <BODY ...> . Αυτές οι ετικέτες ορίζουν τον τύπο του εγγράφου είναι , και οι μεγάλες ενότητες . HTML έγγραφα έχουν συνήθως την επέκταση . Html ή . Htm . Μπορείτε να χρησιμοποιήσετε HTML για να δημιουργήσετε ένα χάρτη εικόνας που διαιρεί μια εικόνα σε διάφορους τομείς που συνδέονται με μια διαφορετική ιστοσελίδα . Εάν επιλέξετε να δημιουργήσετε χάρτες εικόνας , θα πρέπει να χρησιμοποιήσετε τις εικόνες που έχουν πολλές διαφορετικές περιοχές που οι αναγνώστες μπορούν να επιλέξουν . Οι φωτογραφίες δεν είναι συνήθως μια καλή επιλογή για χάρτες εικόνας . Δημιουργία χαρτών εικόνας είναι ένας καλός τρόπος για να δώσει τις σελίδες σας πιο έφεση . Αυτός ο οδηγός θα σας διδάξει πώς να προσθέσετε χάρτες εικόνας στη σελίδα σας . Παρουσιάζει μια πολύ απλή προσέγγιση για την προσαρμογή της σελίδας σας . Τα πράγματα που θα χρειαστείτε <br> Υπολογιστών <br> <br> Παρουσίαση Περισσότερες οδηγίες <br> Η 1 <p> Ξεκινήστε επεξεργαστή κειμένου ή πρόγραμμα επεξεργασίας κειμένου που θα χρησιμοποιήσετε για να δημιουργήσετε την ιστοσελίδα σας . Εντοπίστε τη σελίδα στον υπολογιστή σας που θέλετε να επεξεργαστείτε . Προσθέστε την εικόνα που θέλετε να χρησιμοποιήσετε μια εικόνα χάρτη στην ιστοσελίδα σας . Συμπεριλάβετε το εσωτερικό της ετικέτας <center> . 2 <br> <p> Τύπος " USEMAP = " # ; " στο εσωτερικό της ετικέτας <IMG> . Αντικαταστήστε το ερωτηματικό με το το όνομα της εικόνας του χάρτη . Τύπος " < /CENTER > " για να κλείσετε την ετικέτα . <br> εικόνων 3 <p> Τύπος " <MAP NAME="?"> " Αντικαταστήστε το ερωτηματικό με το όνομα της εικόνας χάρτη το κείμενό σας θα πρέπει να μοιάζει με το παρακάτω : . <center> <IMG SRC="name.gif" USEMAP="#menumap"> ? ? < /CENTER > <MAP NAME="menumap"> <br> Η 4 <p> Τύπος " < ΠΕΡΙΟΧΗ SHAPE = " " " Αντικατάσταση της ερωτηματικό με το σχήμα της περιοχής . Χρησιμοποιήστε rect για ορθογώνιο, κύκλος για τον κύκλο και πολυ για ακανόνιστο σχήμα . <br> 5 <p> Τύπος " coords = " a, b, c , d & # x201D ? " . για τις συντεταγμένες ενός ορθογωνίου Αντικαταστήστε το " α και β » . με τις συντεταγμένες της πάνω αριστερή γωνία Αντικαταστήστε το" c και d " με τις συντεταγμένες του στην κάτω δεξιά γωνία για έναν κύκλο , τον τύπο . " coords = & # x201C ? a, b, r " " όπου " α, Β " είναι οι συντεταγμένες για το κέντρο του κύκλου και "r" είναι η ακτίνα για ένα πολύγωνο , του τύπου. " coords =" a, b , c, d ... " ", όπου " a, b, c , d » είναι οι συντεταγμένες κάθε σημείου του πολυγώνου . <br> Η 6 <p> Type " href =" "" . Αντικαταστήστε το ερωτηματικό με τη διεύθυνση της ιστοσελίδας που θέλετε η περιοχή της εικόνας για να συνδεθείτε. Επαναλάβετε τα βήματα 4 έως 6 για κάθε περιοχή της εικόνας . Τύπος " < /MAP > " για να ολοκληρώσετε την εικόνα του χάρτη σας . <br> Η <p> 7 Βεβαιωθείτε ότι το κείμενό σας είναι παρόμοιο με το ακόλουθο : < ΠΕΡΙΟΧΗ SHAPE " rect " coords = " 31,50,155,120 " href = & # x201C ? website.html "> < /MAP > <br> 8 <p> Ανοίξτε ένα νέο web browser για να βεβαιωθείτε ότι ιστοσελίδα σας εμφανίζει σωστά την εικόνα στο χάρτη Δοκιμάστε τον ιστότοπό σας και βεβαιωθείτε ότι οι επισκέπτες μπορούν. κλικ σε μια περιοχή της εικόνας χάρτη για να εμφανίσετε τη συνδεδεμένη ιστοσελίδα . <br> Η <br> εικόνων <div class="grad2"> <script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-3314932315682382" crossorigin="anonymous"></script> <!-- 221021-2 --> <ins class="adsbygoogle" style="display:block" data-ad-client="ca-pub-3314932315682382" data-ad-slot="8094203668" data-ad-format="auto" data-full-width-responsive="true"></ins> <script> (adsbygoogle = window.adsbygoogle || []).push({}); </script></div> <div class="grad3"></div> </div> <div class="fanyedads"> <ul> <li>Τελευταίο άρθρο: <a class='LinkPrevArticle' href='http://www.221021.com/Programming/computer-programming-languages/88867.html' >Πώς να αλλάξετε Bullet Style Χρησιμοποιώντας HTML Προγραμματισμός </a> <li>Επόμενο άρθρο: <a class='LinkNextArticle' href='http://www.221021.com/Programming/computer-programming-languages/88869.html' >Πώς να αλλάξει την απόφαση κειμένου με χρήση HTML Προγραμματισμός </a> </ul> </div> </div> <div class="woqinimaderwr24"> <div class="dibud23"> <div class="biaotidas51"> <div class="biaotidas511"><h3>Συναφής σύστασή</h3></div> <div class="butudasda"></div> </div> </div> <div class="dibud24"> <div class="dibud241"> <ul class="dsa31das"> <li><a href="http://www.221021.com/Programming/computer-programming-languages/88691.html" target="_blank">Πώς να Μετακίνηση κειμένου σε όλη τη σελίδα σε HTML </a></li> <li><a href="http://www.221021.com/Programming/computer-programming-languages/88549.html" target="_blank">Στάδια του Κύκλου Ζωής Λογισμικού </a></li> <li><a href="http://www.221021.com/Programming/computer-programming-languages/88792.html" target="_blank">Πώς να αλλάξετε το ποντίκι Icon για Mouseover </a></li> <li><a href="http://www.221021.com/Programming/computer-programming-languages/88796.html" target="_blank">Πώς να υπολογίσετε Μέτρο </a></li> <li><a href="http://www.221021.com/Programming/computer-programming-languages/88538.html" target="_blank">Τύποι ηλεκτρονικών υπολογιστών Γλώσσες </a></li> </ul> </div> <div class="dibud242"> <div class="biaotidasoidasf3h4"> <h4>Τελευταία άρθρα</h4> <div class="nibushihenzaiyi"></div> </div> <ul class="thydghaodennrend"> <li><a href="http://www.221021.com/Programming/computer-programming-languages/87921.html" target="_blank">Easy CGI Προβλήματα </a></li> <li><a href="http://www.221021.com/Programming/computer-programming-languages/88467.html" target="_blank">Προβλήματα με την εγκατάσταση του Service Pack 3 </a></li> <li><a href="http://www.221021.com/Programming/computer-programming-languages/280649.html" target="_blank">Μπορείτε να μου δείξετε πώς αλλάζω από την κινεζική γλώσσα στα αγγλικά στον υπολογιστή μου; </a></li> <li><a href="http://www.221021.com/Programming/computer-programming-languages/86565.html" target="_blank">Πώς να Μετατροπή σε Matrix σε MATLAB </a></li> </ul> </div> </div> </div> <div class="dibudaohnagdsaw"> <div class="das342sd"><p>Πνευματικά δικαιώματα © <a href="http://www.221021.com/" target="_blank" >Γνώση Υπολογιστών</a> Όλα τα δικαιώματα κατοχυρωμένα </p></div> </div> </div> </body> </html>