Холбоосын арын дэвсгэрийг хэрхэн яаж хийх вэ

Агуулгын хүснэгт:

Холбоосын арын дэвсгэрийг хэрхэн яаж хийх вэ
Холбоосын арын дэвсгэрийг хэрхэн яаж хийх вэ

Видео: Холбоосын арын дэвсгэрийг хэрхэн яаж хийх вэ

Видео: Холбоосын арын дэвсгэрийг хэрхэн яаж хийх вэ
Видео: Өрмийн хавчаарыг хэрхэн яаж салгах вэ? Өрөмдлөгийн тагийг зайлуулах, солих 2024, Арваннэгдүгээр
Anonim

Гипертекст тэмдэглэгээний хэл HTML бүтээснээс хойш вэб баримт бичгийн зохион байгуулалт, зохион байгуулалтын тухай ойлголтууд эрс өөрчлөгдсөн байна. CSS болон CSS2 цувралын хэв маягийн хүснэгтийн стандартыг түгээмэл хөтөчөөр бараг бүрэн дэмжсэнээр баримт бичгийн визуал толилуулалтын бараг бүх талуудад нөлөөлөх боломжтой болсон. Жишээлбэл, та холбоосын дэвсгэрийг өнгөөр будаж, зарим дүрсээр дүүргэж, хэрэглэгчийн үйлдлээс хамаарч өөрчлөгдөж болно.

Холбоосын арын дэвсгэрийг хэрхэн яаж хийх вэ
Холбоосын арын дэвсгэрийг хэрхэн яаж хийх вэ

Шаардлагатай

  • - баримт бичгийн текст эсвэл баримт бичгийн хэв маяг хуудасны текстийг засах чадвар;
  • - баримт бичгийг анхны кодчилолд хадгалах боломжийг олгодог текст засварлагч.

Зааварчилгаа

1-р алхам

Сүлжээний хэв маягийн мэдээллийг А элементэд нэмж, санамсаргүй өнгөөр жигд дүүргэсэн холбоосын арын дэвсгэрийг оруулна уу. А дэвсгэрийг өөрчлөхийг хүссэн холбоосонд харгалзах А элементийн шинж чанаруудад хэв маягийг нэмнэ. Style атрибутын агуулгад background-color CSS шинж чанарыг өгөгдсөн утгаар байрлуул. Жишээлбэл, иймэрхүү харагдаж магадгүй юм.

холбоос текст

Алхам 2

Өөрийн баримт бичигт байгаа гаднах эсвэл суулгагдсан загварын хуудсан дээрх холбоосын арын дэвсгэрийг тодорхойл. Тохиромжтой загварын хүснэгтэд тодорхой түвшний хүлээн зөвшөөрөгдсөн түвшний сонгогчийн өгсөн багц дүрмийг нэмж оруулаарай. Дүрэмд өмнөх алхамтай адил арын өнгөт шинж чанарыг оруулна уу. CSS2 цуврал дүрмүүд болон хүссэн хамрах хүрээ дээр үндэслэн сонгогчийн онцлог шинж чанарыг сонгоно уу. Тиймээс, хэрэв та зөвхөн нэг холбоосын өнгийг тохируулах шаардлагатай бол ID сонгогч ашиглах нь утга учиртай бөгөөд хэрэв ийм холбоос хэд хэд байгаа бол шинж чанар сонгогчийг ангийн утга дээр үндэслэн ашиглах нь дээр юм.

Жишээлбэл, баримт бичгийн тодорхой холбоосын ногоон дэвсгэрийг тохируулахын тулд та хэв маягийн хуудсанд дүрмийн багц нэмж болно.

# ID_GREEN

{

арын өнгө: # 00FF00;

}

Та мөн A элементийн ID шинж чанарыг ID_GREEN руу хүссэн холбоосонд тохируулах хэрэгтэй.

холбоос текст

Алхам 3

Холбоосын арын хэсгийг дүрсээр бөглөнө үү. Нэг, хоёрдугаар алхам дээр тайлбарласан аргуудыг дагаж мөрдөөрэй, гэхдээ CSS-ийн арын дэвсгэрийн оронд background-image ашиглана уу. Жишээлбэл:

холбоос текст

Шаардлагатай бол арын зургийг хэвтээ ба босоо байдлаар хувилах сонголтыг тодорхойлохын тулд CSS дүрмэнд background-давтах шинж чанарыг нэмж оруулна уу.

Алхам 4

Холболтын дээгүүр хулганаа дарах эсвэл фокус шилжих үед арын дэвсгэрийг өөрчил. Янз бүрийн муж дахь холбоос эсвэл холбоос бүлгийн арын дэвсгэрийг тодорхойлсон гадаад эсвэл суулгагдсан баримтын хэв маягийн хуудсанд дүрмийн багцыг нэмж оруулаарай. ID ба атрибут сонгогчдыг динамик хуурамч ангиудтай хамт ашиглана уу: hover,: active, and: focus. Жишээлбэл, ID_DYNAMIC_BACKGROUND гэсэн ID атрибутын утгатай холбоосын арын дэвсгэр идэвхгүй төлөвт улаан, хулганы курсорын доор байх төлөвт ногоон байхын тулд дараах дүрмийг хэв маягийн хуудсанд нэмж оруулах шаардлагатай.

# ID_DYNAMIC_BACKGROUND

{

арын өнгө: # FF0000;

}

# ID_DYNAMIC_BACKGROUND: hover

{

арын өнгө: # 00FF00;

}

Та динамикаар өөрчлөгдөж буй дүрс бүхий дэвсгэр үүсгэхийн тулд үүнийг хийж болно.

Зөвлөмж болгож буй: