CSS3 da ro’yxatlar CSS3 da giper murojaatlarni qo’llash ochiluvchi ro’yxat menyu turli xil o’lchamli tugmalar yaratish - Информатика и ИТ - Рефераты

CSS3 da ro’yxatlar CSS3 da giper murojaatlarni qo’llash ochiluvchi ro’yxat menyu turli xil o’lchamli tugmalar yaratish

Загружено в:

20.09.2019

Скачано:

0

Размер:

46.5 KB

CSS3 da ro’yxatlar CSS3 da giper murojaatlarni qo’llash ochiluvchi ro’yxat menyu turli xil o’lchamli tugmalar yaratish R е ja: 1. CSS da ro`yxatlar h aqida umumiy ma’lumot. 2. - list-style-type; list-style-position; list-style-image; list-style- ro`yxat stillari. 3. Sahifadagi ro’yxatdan tanlash va ochiluvchi ro`yxatga misollar

CSS stillar bilan ishlash tilida ham HTML gippermatn tiliga o‘xshab ro‘yxatlar tushunchasi mavjud. Ro‘yxatlar uchun uncha ko‘p stil xususiyatlari ajratilmagan, shu sababli maqolamiz qisqa bo‘ladi, lekin kerakli xususiyatlar bilan tanishamiz. Ro‘yxatlarni, CSS xususiyatlarini ishlatmasdan HTML gippermatn tilida ham hosil qilishingiz mumkin, lekin CSSdagidek chiroyli chiqmaydi, shuning uchun maslahat, ikkala hilni ham ko‘rib chiqing va ma'qulidan foydalaning. Ro‘yxatlar uchun quyidagi stil xususiyatlarini ishlatamiz: - list-style-type; - list-style-position; - list-style-image; - list-style. Bu xususiyatlar universal bo‘lib, tartiblangan va tartiblanmagan ro‘yxatlar uchun ishlatilaveriladi. Bular orqali tartibli va tartibsiz ro‘yxatlar hosil qilish mumkin, keling ular bilan tanishib chiqamiz. List-style-type- ro‘yxatlar uchun markerlarni aniqlashtirish uchun ishlatiladi, markerlar raqam, harf, kvadrat, dumaloq va boshqa ko‘rinishlarda bo‘lishi mumkin. Markerlarni aniqlashtirish uchun quyidagi qiymatlar ishlatiladi: disk- marker sifatida bo‘yalgan doira; circle- marker sifatida bo‘yalmagan aylana; square- marker sifatida bo‘yalgan kvadrat. decimal- marker sifatida oddiy arab raqamlar: 1, 2, 3, 4, 5... decimal-leading-zero- marker sifatida oddiy arab raqamlar "0" bilan: 01, 02, 03, 04, 05... upper-roman- marker sifatida katta rim raqamlari: I, II, III, IV, ... lower-roman- marker sifatida kichik rim raqamlari: i, ii, iii, iv ... upper-alpha- marker sifatida katta ingliz harflari: A, B, C, D, ...

lower-alpha- marker sifatida kichik ingliz harflari: a, b, c, d, ... none- ro‘yxatni markersiz qilish. Yuqoridagilarga misol ko‘ramiz, <html> <head> <title>List</title> <style> ol { list-style-type: decimal-leading-zero; </style> </head> <body> <ol> <li>Eric Contana</li> <li>Roy Kean</li> <li>Nemani Vidic</li> <li>Wayne Rooney</li> </ol> </body> </html> List-style-position- bu stil xususiyati markerni joylashishini aniqlashtiradi, 2 xil qiymat qabul qilishi mumkin: outside- marker ni ro‘yxat bloki tashqarisiga joylashtirish; inside- marker ni ro‘yxat bloki ichiga joylashtirish. Bu stil eskirgan bo‘lib, yangi brauzerlarda ishlamasligi mumkin. List-style-image- ro‘yxatning eng qiziq xususiyati bo‘lib, markerga o‘zingiz xohlagan rasmni qo‘yishingiz mumkin bo‘ladi. "url" kalit so‘zidan keyin, rasm adresini yozasiz.

List-style- yuqoridagi ro‘yxatga oid barcha xususiyatlarni birlashtiruvchi xususiyat. ul { list-style-type:square; list-style-position: inside; list-style-image: url(rasm.png); Shu 5 qatorli kodni, "list-style " orqali quyidagicha qisqartirish mumkin. ul { list-style:square inside url(rasm.png) Sahifadagi ro’yxatdan tanlash. Select - elementi yordamida ro’yxatdan biror bo’limni tanlash imkoniyatini yaratadi. Odatda bu element yordamida ochiluvchi menyular tuziladi. Select tegi quyidagi parametrlarga ega:  option – parametr yordamida menyuning bo’limlari hosil qilinadi.  name - parametr yordamida elementning nomi beriladi.  size - atributi esa ekranda hosil qilinadigan bo’limlar sonini aniqlaydi, agar bo’limlar size da ko’rsatilgan sondan katta bo’lsa, u holda brauzer o’ tkazish y o’ lakchasi hosil qiladi. Select tegining umumiy ko’rinishi quyidagicha: <select> <option> … </option> </select> Web sahifada ro’yxat yaratish. <html> <head> <title> Ro'yxatdan tanlash </title> </head> <body> Fakultetingizni tanlang <select>

<option> Fiz-mat </option> <option> Pedagogika </option> <option> Filologiya </option> <option> Tarix </option> </select> </body> </html>

Adabiyotlar: 1. Кarimov I.A. “Yuksak ma’naviyat – yengilmas kuch” Tosh kent ma’naviyat 2008 2. Abduqodirov A. va boshqalar. Informatika va hisoblash texnikasi asoslari – Т .: O`qituvchi, 1996 y. 3. Hoshimov O. Kompyuterli va raqamli texnologiyalar. - Т .: Yangi asr avlodi, 2009 y. 4. Usmonov R.N. Кompyuter tizimlariga texnik xizmat ko’rsatish” “Ilm ziyo” 2012. 5. http://www.borlpasc.narod.ru/ . 6. http://www.intuit.ru

Похожие

Html5 da bloklar CSS3 da o’zgaruvchan bloklar bilan ishlash DIV tegi va uning atributlari CSS3da bloklarning kengligi

WEB-saytlar yaratish. Word 2000 da web-sahifalar yaratish usullari

CSS3 dan foydalanish kaskadli jadval stillari tushunchasi kaskadli jadval tushunchasi va imkoniyatlari shrift xususiyati

Elektron darslik

C++da grаfikа