CSS եռանկյունների գեներատոր
Գեներացրեք border-ի վրա հիմնված CSS եռանկյուններ տարբեր չափսերով և ուղղություններով:
Գործարկել գործիքը
CSS եռանկյունների գեներատորը ստեղծում է եռանկյուն պատկերող CSS կոդ՝ հիմնվելով եզրագծերի (borders) հատկությունների վրա: Վեբ ծրագրավորման մեջ եռանկյուններ ստանալու տարածված եղանակ է զրոյական լայնությամբ ու բարձրությամբ տարրին տալ հոծ եզրագծեր և համապատասխան կողմերի չափսեր: Գործիքը հնարավորություն է տալիս սահմանել եռանկյան ուղղությունը, ինչպիսիք են դեպի վեր, վար, ձախ, աջ, ինչպես նաև անկյունագծային ուղղությունները: Լռելյայն ընտրված է վերև ուղղությունը, իսկ չափսի լռելյայն արժեքը 20 պիքսել է: Գործիքը չափսի հիման վրա կատարում է թվաբանական հաշվարկներ, ներառյալ արժեքի կիսումը, և ձևավորում է չորս կողմերի border-width պարամետրերը պիքսելներով: Գեներացված ոճը ներառում է width և height հատկությունները զրո արժեքով, border-style արժեքը solid և թափանցիկ եզրագծերի գույներ: Չճանաչված ուղղություն մուտքագրելու դեպքում համակարգը կիրառում է դեպի վեր ուղղված եռանկյան եզրագծերի չափսերը՝ պահպանելով նշված անվանումը CSS սելեկտորում: Գույնի դաշտը լրացնելիս նկատի ունեցեք, որ ստացվող կոդում կողմերի գույները ձևավորվում են թափանցիկ: Ստացված CSS կոդը կարող եք արագ պատճենել և տեղադրել ձեր վեբ նախագծի ոճային ֆայլում:
Հրահանգներ
- Մուտքագրեք կամ ընտրեք եռանկյան ուղղությունը (օրինակ՝ up, down, left, right):
- Նշեք եռանկյան չափսը թվային արժեքով (լռելյայն արժեքն է 20):
- Անհրաժեշտության դեպքում լրացրեք գույնի դաշտը:
- Ստացված CSS կոդը պատճենեք արդյունքի դաշտից և տեղադրեք ձեր նախագծի ոճերում:
Օրինակներ
- Վերև ուղղված 20 պիքսել չափսով եռանկյուն. ուղղությունը՝ up, չափսը՝ 20: Ստացվում է CSS կոդ border-width: 0 10px 20px 10px չափերով:
- Աջ ուղղված 40 պիքսել չափսով եռանկյուն. ուղղությունը՝ right, չափսը՝ 40: Ստացվում է համապատասխան border-width կարգավորումներով CSS բլոկ:
ՀՏՀ
Ո՞ր ուղղություններն են ապահովվում գործիքի կողմից:
Գործիքն ունի հստակ կարգավորումներ up, down, left, right, top-left, top-right, bottom-left և bottom-right ուղղությունների համար:
Ի՞նչ է տեղի ունենում, եթե նշվի չճանաչված ուղղություն:
Չճանաչված ուղղության դեպքում ավտոմատ կիրառվում է դեպի վեր (up) ուղղված եռանկյան եզրագծերի կառուցվածքը, իսկ սելեկտորի անվանման մեջ պահպանվում է մուտքագրված տեքստը:
Ինչո՞ւ են գեներացված CSS կոդում border գույները նշված թափանցիկ:
Գործիքի ընթացիկ տրամաբանությունը բոլոր կողմերի համար սահմանում է թափանցիկ եզրագծեր: Եռանկյան տեսանելի գույնը կարող եք ըստ ցանկության ճշգրտել արտածված CSS կոդում: