Qanday CSS uchburchak bajaring: eng qulay yo'llari

Juda tez-tez go'zal zamonaviy veb-sahifalar ko'p jozibador grafik o'z ichiga oladi. Ular orasida eng oddiy elementlarini bir nechta dizayni uchun ishlatiladi bir uchburchak kabi geometrik shaklga foydalanadi. mehmon unga o'z e'tiborini qaratdi masalan, ular sahifada bir ob'ektga, bir işaretçi sifatida ishlatiladi. Albatta, uchburchak asosiy vazifasi - bir bezak, ularni o'z ichiga olgan bloklari, deb yana zamonaviy va jozibador bormoqda.

Emas, balki har bir Uslublar kaskadli jadvallari orqali bunday ko'rsatkichni yaratish va CSS bir uchburchak qilish qanday hayron qanday biladi.

saytlar dizayn Application

Hamma joyda veb-dizayn uchburchak ichida. Ular maslahatlar, menyular, turli UI elementlari amalga oshiriladi. Ba'zan ular yuklash jarayoni bir ko'rsatkichni yaratish uchun ishlatiladi. Va avvalroq agar ular holda, albatta, mumkin edi, lekin hozir bu imkonsiz, va chiquvchilar bunday talablarga moslashtirish shart. interfeys qismlari o'rtasidagi o'zaro qurilishida muhim qismini va bir shaxs birlashtirish - Axir, bugun CSS uchburchak yaratilgan.

juda tez-tez bo'lib triangles dizayn bo'lgan tortdilar, kelganda ko'p veb-dizaynerlar parishon bo'ladi. Axir, hech qanday xususiyatlari deb, bu to'g'ridan-to'g'ri yaratish, bu geometrik ko'rsatkich. Aslida, bu, albatta, bir necha usullari mavjud.

yordamida ramkani yaratish usuli

chegara - Birinchi usul siz CSS bir uchburchak yaratish imkonini beradi. U rom foydalanadi. chegara xususiyatidan foydalanib yaratilgan chegaralari bevosita uchburchak bog'liq emas qaramay, bu maqsadda eng tez-tez ishlatiladi.

nol balandligi va ob'ekt kengligi, shuningdek, bir qalin chegarasini o'rnatish o'rnatayotgan, to'rt teng uchburchaklar bo'lingan kvadrat, ko'rish mumkin. hiyla faqat zarur chegarasini tutish kerak, va boshqalar shaffof qilish uchun bo'ladi. Va endi, u qaytib chiqib bir uchburchak etib olish ham The CSS o'ng yo'nalishi va rang.

biron-bir tadbir yordamida rasm chizish uchun hech qanday ehtiyoj bor, chunki xususiyatlari "ramkani" qulay foydalanish yuritadigan yaratish. uchburchak parametrlar har doim kodi o'zgarishi mumkin. Va u vaqt Ishlab saqlaydi. ramkaning turli kengligi birlashtirib oson ko'rsatkichni olish uchun etarli bo'ladi. u qanday ishlaydi tushunish uchun, siz shunchaki bir nol kengligi, balandligi bilan bo'sh elementi, va juda qalin ramkani har bir tomonida bir xil rang yaratishingiz mumkin. Shunday qilib, to'rt shaffof uchburchak uch tomonini qilish har xil turdagi bor:

• uchburchak, chap qarab, tomonlar bo'lgan tengdir;
• uchburchak, chap va yassilangan qaraydigan,
• bir cho'zilgan uchburchak, chap vazir;
• burchakli uchburchak, kimning to'g'ri burchak chapdan;
• pastga qarab uchburchak;
• uchburchak qarab;
• uchburchak, o'ng va boshqa ko'plab turlari uchun izlaydi.

psevdoedementov foydalanish

Bu metodlarni bilan, siz pop-up ko'rsatmalar va maslahatlar bilan yuritadigan yaratishingiz mumkin. birligi uchun CSS uchburchak orqali ulash uchun, asosan dasturchilar bunday psevdo-keyin va oldin foydalaning. Agar ularni birga foydalanayotgan bo'lsangiz, insult bo'lgan CSS uchburchak chizish mumkin.

ularni birlashtirib, chiquvchilar mulk qo'llash, go'zal shooter turli xil yaratish nisbiy: o'rnini ota element uchun. Bu uchun amalga oshiriladi psevdo-yo'q, ularning O'rinlar ko'chib.

Plus The foydalanish The kesish CSS uchun CREATE uchburchakda qilinadi:

• xususiyatlari yordamida hajmi va rangi tez va oson tahrirlash;
• hamma brauzerlarda qo'llab-quvvatlaydi.

Kamchiliklari:

• Bu ramka foydalanadi, chunki, gradient, soyalar qo'llash imkoni yo'q;
• Foydalanuvchi Firefox brauzeri sahifasida qaraydi qachon ba'zan, alfa qiymati ishlamasligi mumkin, va bu tasvirni buzishi bo'ladi.

tayyor suratlar foydalanish

uchburchak yaratish quyidagi usul - kodlangan tasvirlar foydalanish hisoblanadi. uchburchak bir rasm muharriri oldindan chizilgan va ixtisoslashgan xizmatlari bilan maxsus kodi aylanadi.

Bu usulning afzalligi siz soyalar, gradyanlar va ramka bilan juda chiroyli dizayn qilish va keyin faqat uni barcha kodlar mumkin, deb hisoblanadi. Lekin salbiy emas, balki har bir grafik dasturlarida ravon haqiqatdir. tasvir juda katta bo'lsa Bundan tashqari, kod qatorni shunchaki ulkan bilan qo'lga kiritiladi. Bu shaxslar uchun noqulay hisoblanadi.

brauzerlar internert Explorer eski versiyalari foydalanish qiymat alohida. Ularda, usuli shunchaki ish emas.

Usuli teskari tarjima kvadrat

Bir yo'li CSS teskari tarjima maydonida bir vositalarni yaratish. ikki asosiy birligi bor. Lekin ba'zi odamlar foydalanish psevdo.

Birinchidan, siz bir maydonni yaratish. Bu aylanuvchi a'zosi mazmuni bo'ladi. bir olmos kabi qaradi, shunda So'ngra, 45 daraja uni o'rnatish. Keyingi, shift-up va tashqi birligi mulk toshib tomonidan yashirin: yashirin. Bu yechim, shuningdek, bir xoch-brauzer emas, va kerakli deb ba'zan rasm ko'rsatiladi.

natijalar

Shunday qilib, bir uchburchak yaratish uchun juda ko'p usullari mavjud. Faqat u bu barcha CSS xususiyatlari yoqotib emas? bu holatda Reference har doim yordam beradi. Bu Cascading Style Sheets barcha xususiyatlarini ta'riflaydi.

dasturlash kirib CSS-qo'llanmasini ko'rish istamayman keltirganlar uchun, uchburchak to'g'ri registri va ranglar ishlab onlayn muharrirlari ham bor. Yilda Visual muharriri, foydalanuvchi tanlaydi va barcha ri ko'rsatkichni yapılandırır. chivin alohida oynada joylashtirilgan CSS kodi generator uchburchak aylanadi. So'ngra, The hosil kodi shunchaki Inserted kirib The stillar jadvallari va moslash The dizayn The sahifasi.