Video: Div Tag Basics | How to insert Div Tags using Dreamweaver CC 2024
Adobe Creative Suite 5 (Adobe CS5) Dreamweaver menggunakan bekas virtual maya CSS, atau kotak, dibuat oleh tag DIV untuk meletakan kandungan secara bebas pada halaman. Tag DIV adalah tag asas yang digunakan untuk membuat kawasan untuk kandungan pada halaman anda. Setiap tag DIV boleh mempunyai gaya ID unik yang diberikan kepadanya untuk mengawal kedudukan, rupa, dan saiznya.
Proses meletakkan kandungan sering memerlukan dua langkah: mencipta tag DIV dan kemudian mencipta gaya sepadannya. Alat AP Div membolehkan anda untuk melukis kotak-kotak secara bebas di halaman dan meletakkan kandungan di dalamnya.
AP Div adalah pendek untuk DIV mutlak; item dengan kedudukan mutlak ditetapkan pada lokasi tertentu pada halaman. Apabila anda menarik Div AP, kedudukannya biasanya ditetapkan menggunakan sifat CSS atas dan kiri, dengan sudut kiri atas halaman sebagai titik rujukannya.
CSS merawat setiap elemen pada halaman sebagai kotak yang memegang kandungan; dirujuk sebagai model CSS Box. Walaupun CSS boleh mempertimbangkan kotak yang paling banyak mengandungi elemen pada halaman (seperti jadual atau senarai), tag DIV yang paling biasa digunakan untuk membuat kotak maya yang boleh anda gunakan untuk meletakkan teks, imej, dan bahkan kotak lain.
Setiap kotak boleh mempunyai lebar, ketinggian, kedudukannya sendiri (melalui bahagian atas dan kiri), sempadan, margin, dan padding; setiap satu ditetapkan dengan menggunakan peraturan CSS.
-
Pada panel Sisip, pilih kategori Tata Letak.
-
Pilih alat Draw AP Div.
Kursor muncul sebagai rambut salib apabila anda mengalihkannya kembali ke halaman.
-
Klik di mana-mana di halaman dan seret untuk menarik Div AP baru; melepaskan butang tetikus.
-
Gerakkan penunjuk tetikus ke tepi tepi kotak sehingga ia berubah ke tangan; klik sekali dan pemegang akan muncul di semua pihak.
-
Klik dan seret mana-mana pemegang ini untuk mengubah saiz kotak secara menegak atau mendatar.
-
Untuk menggerakkan kotak, klik dan seretnya dengan tab yang duduk di tepi kiri atasnya dan letakkan kotak yang anda inginkan pada halaman tersebut.
Lihat pemeriksa hartanah, dan anda melihat nama serta banyak sifat DIV yang tersenarai.
-
Jika panel Gaya CSS tidak dibuka, pilih Window → CSS Styles untuk membukanya; di bawah panel Semua, klik ke kiri bahagian gaya () untuk mengembangkannya.
Anda melihat gaya # apDiv1 ID baru yang dilampirkan pada Div AP baru yang anda buat. Untuk setiap DIV yang baru dicipta, Dreamweaver memberikan apDiv dengan nombor yang sesuai dalam rangka penciptaan.
-
Klik di dalam kotak baru untuk mengetik, menampal, atau memasukkan kandungan baru.
Apabila anda melukis Div AP pada halaman, Dreamweaver memasukkan tag untuk membuat kotak dan membuat pemilih ID yang menyimpan kedudukan, lebar, ketinggian, dan sifat-sifat lain DIV. Selepas anda membuat Div AP, anda boleh menaip, menyisipkan, atau memasukkan kandungan terus di dalamnya. Anda juga boleh menetapkan peraturan kelas kepada mana-mana DIV dari pemeriksa harta benda.
Setiap Div AP yang anda lukis disenaraikan secara automatik dalam panel AP Elements (pilih Window → AP Elements untuk memaparkannya. Panel Unsur AP boleh membantu anda memilih, menyembunyikan, dan menunjukkan mana-mana Divs AP pada halaman.
Gunakan panel AP Unsur untuk memilih, menyembunyikan, dan menyusun semula Divs AP di halaman anda.