Τρόπος τροποποίησης Divs Absolute-Positioned (AP) στο Adobe Dreamweaver CS6

Κάθε Div με Απόλυτη Θέση (AP) που σχεδιάζετε στο Adobe Dreamweaver CS6 παρατίθεται αυτόματα στον πίνακα Στοιχεία AP (επιλέξτε Παράθυρο→ Στοιχεία AP για να το εμφανίσετε). Ο πίνακας στοιχείων AP μπορεί να σας βοηθήσει να επιλέξετε, να αποκρύψετε και να εμφανίσετε τυχόν AP Div στη σελίδα. Αυτό το πλαίσιο είναι βολικό όταν έχετε πολλά AP Div στη σελίδα και θέλετε να πλοηγηθείτε μεταξύ τους με ακρίβεια.

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

Ο πίνακας στοιχείων AP συχνά ομαδοποιείται με τον πίνακα στυλ CSS, σε περίπτωση που το ψάχνετε.

Για να τροποποιήσετε ένα πλαίσιο (AP Div), ακολουθήστε τα εξής βήματα:

Επιλέξτε Παράθυρο→ Στοιχεία AP για να ανοίξετε τον πίνακα Στοιχεία AP.

Στον πίνακα, εντοπίστε και επιλέξτε apDiv1 για να το επισημάνετε στη σελίδα.

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

Χρησιμοποιώντας τα πλαίσια κειμένου στον Επιθεωρητή Ιδιοτήτων, αλλάξτε το πλάτος του πλαισίου εισάγοντας έναν αριθμό στο πεδίο W και αλλάξτε το ύψος του πλαισίου εισάγοντας έναν αριθμό στο πεδίο H.

Κάντε κλικ στο δείγμα δίπλα στο Bg Color και επιλέξτε ένα χρώμα από τον αναδυόμενο πίνακα Swatches για να ορίσετε ένα χρώμα φόντου για το πλαίσιο.

Για πρόσθετες ιδιότητες, όπως περίγραμμα ή συμπλήρωση, προσθέστε τις στον πίνακα Στυλ CSS.

Εάν το πλαίσιο Στυλ CSS δεν είναι ήδη ορατό, ανοίξτε το επιλέγοντας Παράθυρο→ Στυλ CSS.

Κάντε διπλό κλικ στο στυλ αναγνωριστικού #apDiv1 που ελέγχει το πλαίσιο.

Εμφανίζεται το πλαίσιο διαλόγου Ορισμός κανόνα CSS.

Επιλέξτε την κατηγορία Border από τα αριστερά για να αλλάξετε το περίγραμμα.

Στη στήλη Στυλ, χρησιμοποιήστε την αναπτυσσόμενη λίστα Επάνω για να ορίσετε ένα στυλ περιγράμματος (όπως Στερεό) και στις τέσσερις πλευρές.

Χρησιμοποιήστε την αναπτυσσόμενη λίστα Επάνω στην κατηγορία Πλάτος για να επιλέξετε ένα πάχος περιγράμματος (για παράδειγμα, μεσαίο) και για τις τέσσερις πλευρές. Χρησιμοποιήστε τον ανώτατο επιλογέα χρώματος κάτω από τη στήλη Χρώμα για να αντιστοιχίσετε ένα χρώμα περιγράμματος και στις τέσσερις πλευρές.

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

Στην κατηγορία Πλαίσιο στα αριστερά, στην περιοχή Επένδυση, ορίστε την επένδυση και για τις τέσσερις πλευρές του πλαισίου στο πάχος που θέλετε (για παράδειγμα, εισαγάγετε 5 px στα πλαίσια κειμένου).

Κάντε κλικ στο OK για να βγείτε από τον πίνακα και να εφαρμόσετε τις αλλαγές.

Βλέπετε πώς οι ιδιότητες CSS που εφαρμόσατε επηρεάζουν το πλαίσιο apDiv1 στη σελίδα.

Για να αποκρύψετε ένα πλαίσιο που εμφανίζεται κάτω από τον πίνακα Στοιχεία AP, κάντε κλικ στη στήλη στα αριστερά του ονόματός του (κάτω από το εικονίδιο Eye) μέχρι να εμφανιστεί ένα κλειστό εικονίδιο Eye. Για να εμφανιστεί ξανά το πλαίσιο, κάντε κλικ στο εικονίδιο Eye μέχρι να ανοίξει ξανά το πλαίσιο.

Μπορεί να παρατηρήσετε το πλαίσιο ελέγχου Αποτροπή επικαλύψεων, που έχει καταργηθεί από προεπιλογή, στο επάνω μέρος του πίνακα Στοιχεία AP. Επειδή τα AP Div μπορούν εύκολα να επικαλύπτουν το ένα το άλλο, η επιλογή αυτού του πλαισίου ελέγχου παρακάμπτει αυτήν τη συμπεριφορά επιβάλλοντας τα πλαίσια το ένα δίπλα στο άλλο και αποτρέποντας τη δημιουργία νέων πλαισίων το ένα πάνω στο άλλο.