Интернет дээр поп-ап буюу поп-цонх улам бүр түгээмэл болж байна. Эсвэл, илүү энгийнээр попап зургууд. Олон сайтын эзэд тэдгээрийг зар сурталчилгааны зорилгоор хийх шаардлагатай байдаг боловч хүн бүр өөрсдийн бүтээлийн алгоритмыг мэддэггүй.
Энэ нь зайлшгүй шаардлагатай
- - HTML редактор;
- - тэмдэглэлийн дэвтэр;
- - хостинг.
Зааварчилгаа
1-р алхам
HTML эсвэл текст засварлагч дээр шинэ вэб хуудас үүсгэх эсвэл нээх. Энэ зорилгоор та Dreamweaver, Expression Web болон бусад алдартай програмуудыг ашиглаж болно. Хэрэв та HTML програмчлалын хэл дээр эхний алхамуудаа хийж байгаа бол ердийн "тэмдэглэлийн дэвтэр" ашиглаарай.
Алхам 2
Дараах кодыг "толгой" ба "/ толгой" шошгоны хооронд наана уу:
.thumbnail {байрлал: харьцангуй; z-индекс: 0;}
.хэмжээ: hover {background-color: тунгалаг; z-индекс: 50;}
.хэмжээний хэмжээ {/ * томруулсан зургийн CSS * / байрлал: үнэмлэхүй; дэвсгэр өнгө: цайвар шар; дүүргэлт: 5px; зүүн: -1000px; хил: 1px тасархай саарал; харагдах байдал: далд; өнгө: хар; текст чимэглэл: байхгүй;}
.thumbnail span img {/ * Томруулсан зургийн CSS * / border-width: 0; дүүргэлт: 2х;}
.thumbnail: hover span {/ * hover дээрх томруулсан зурагны CSS * / visibility: харагдахуйц; дээд: 0; зүүн: 65px; / * томруулсан дүрсийг хэвтээ байрлалд байрлуулах байрлал * /}
Алхам 3
Кодын сүүлийн мөр дээрх утгыг өөрчилж попап зургийн хэвтээ байрлалыг тохируулна уу. Зургийг вэб хуудсанд харуулахыг хүссэн "body" ба "/ body" шошгоны хоорондох зайг хуваарилж дараа нь дараах кодыг хуулж тавь.
Текст гарчгийн жишээ
Текст гарчгийн жишээ"
Алхам 4
"Хавтас / largepci1.jpg" -ийг попап зураг дээр ашигласан файлаар солино уу. Кодын хоёр дахь блоктой ижил зүйлийг хий. Дотор нь "Текст гарчгийн жишээ" гэсэн мөрийг попап зураг дээр бичих зүйл болгон өөрчил. Мөн гарч ирэх зургийн хэмжээг тохируулахын тулд кодын өндөр ба өргөний утгыг өөрчил. Илүү тойм зураг нэмэхийн тулд кодын нэмэлт блокуудыг үүсгээрэй. Шаардлагатай бол бусад баримт бичиг, хаяг, текстийг HTML баримт бичигт оруулна уу. HTML файлыг хадгалаад дараа нь вэб сервертээ байршуулна уу.
