Cascading Style Sheets (CSS) ატრიბუტი ყველაზე ხშირად გამოიყენება ვებ – გვერდებზე ჰიპერბმულების ფერის შესაცვლელად. ამ პრობლემის გადაჭრა ნაკლებად ფუნქციონალურია HTML ენაში (HyperText Markup Language - "ჰიპერტექსტის მარკირების ენა").
Ეს აუცილებელია
HTML და CSS ენების ცოდნა
ინსტრუქციები
Ნაბიჯი 1
მოამზადეთ სტილის ბლოკი ჰიპერბმულებისთვის. უმარტივესი ფორმით, შეიძლება ასე გამოიყურებოდეს: a {color: Green} აქ "a" ეწოდება "selector", რაც მიუთითებს, რომ ფრჩხილებში სტილის აღწერა უნდა იქნას გამოყენებული დოკუმენტის ყველა ბმულის თეგებზე. მწვანე განსაზღვრავს ბმულის ფერს; ეს არის ფერის უხეში განმარტება და იშვიათად გამოიყენება. ბევრად უფრო ხშირად, "ფსევდო კლასს" ემატება "ა" სელექტორი - ეს არის ეტიკეტი, რომლის საშუალებითაც შეგიძლიათ მიუთითოთ ბმულის სტილი სამ სხვადასხვა მდგომარეობაში.
ნაბიჯი 2
გამოიყენეთ ბმულის ფსევდო კლასი ბმულის ნორმალური (არააქტიური) მდგომარეობის შესადგენად. შეიძლება ასე გამოიყურებოდეს, მაგალითად: a: link {color: Green}
ნაბიჯი 3
გამოიყენეთ ფსევდო კლასის hover, რომ მიუთითოთ, თუ როგორ უნდა გამოჩნდეს ბმული hover- ზე. მაგალითად: a: hover {ფერი: ცაცხვი}
ნაბიჯი 4
გამოიყენეთ მონახულებული ფსევდო კლასი უკვე მონახულებული ბმულის სტილის აღსაწერად. მაგალითად: a: ეწვია {ფერი: DarkGreen}
ნაბიჯი 5
დააკავშიროთ სამივე მდგომარეობა ერთ სტილის აღწერის ბლოკად. HTML კოდის იერსახე, რომელიც შეიცავს CSS სტილის აღწერებს, მაგალითად, შეიძლება ასე გამოიყურებოდეს:
a: link {ფერი: მწვანე}
a: ეწვია {ფერი: DarkGreen}
a: hover {ფერი: ცაცხვი}
აქ HTML სტილის ტეგების გახსნა და დახურვა ეუბნება ბრაუზერს, თუ სად იწყება და მთავრდება სტილის აღწერილობები და მათ შორის არის აღწერილი ბმულის ქცევა სამ შტატში.
ნაბიჯი 6
ზემოთ გამოყენებული ნიმუში აჩვენებს მხოლოდ ფერის მახასიათებლებს, მაგრამ აღწერილობაში სხვა ატრიბუტების დამატებაა შესაძლებელი. მაგალითად, თუ გვერდის დიზაინი მოითხოვს, რომ ბმული არ იყოს ხაზგასმული ნორმალურ (არააქტიურ) მდგომარეობაში, მაგრამ ხაზგასმული იყოს კურსორის გადაფურცვლისას, მაშინ კოდი შეიძლება შეიცვალოს შემდეგნაირად:
a: link {ფერი: მწვანე; ტექსტური გაფორმება: არცერთი;}
a: ეწვია {ფერი: DarkGreen; ტექსტური გაფორმება: არცერთი;}
a: hover {ფერი: ცაცხვი; ტექსტური გაფორმება: ხაზგასმა;}
ნაბიჯი 7
თუ გსურთ შეცვალოთ გვერდზე მხოლოდ რამდენიმე ბმულის ფერი, დანარჩენი კი დატოვოთ ნაგულისხმევი პარამეტრებით, დაამატეთ კლასის ატრიბუტი თითოეული შეცვლილი ბმულის თეგს. მაგალითად, დაარქვით ამ ჰიპერბმულის კლასს newLinks. მაშინ ბმულის ნიშანი შეიძლება ასე გამოიყურებოდეს: ტექსტური ბმული სტილის აღწერას უნდა დაემატოს იგივე კლასის სახელი:
a.newLinks: link {ფერი: მწვანე; ტექსტური გაფორმება: არცერთი;}
a.newLinks: ეწვია {ფერი: DarkGreen; ტექსტური გაფორმება: არცერთი;}
a.newLinks: hover {ფერი: ცაცხვი; ტექსტური გაფორმება: ხაზგასმა;}
ნაბიჯი 8
ზემოთ აღწერილი მაგალითებისგან მომზადებული სტილის აღწერის კოდი განათავსეთ გვერდის სათაურში - და თეგებს შორის. საჭიროების შემთხვევაში, დაამატეთ კლასის ატრიბუტი ბმულის თეგებს სტილის აღწერებში გამოყენებული სახელით. შემდეგ შეინახეთ შეცვლილი გვერდი და დასრულდება ჰიპერბმულების ფერის შეცვლის პროცედურა.
