Jadval uchun rasmni fon sifatida sozlash

Jadvallarga rasm fonni qo'shish uchun CSS fon xususiyatidan foydalaning

Orqa fondan ajratilgan jadvallar jadvalning mazmunini veb-sahifadagi hamma narsalarga nisbatan ta'kidlashda yordam beradi. Stol fonini qo'shish uchun veb-sahifangizni qo'llab-quvvatlaydigan kaskad uslublar jadvalini (CSS) chizishingiz kerak bo'ladi.

Ishni boshlash

Jadvalga fon tasvirini qo'shishning eng yaxshi usuli - CSS fon xususiyatidan foydalanish. O'zingizni CSS-ni samarali yozishni va kutilmagan gloss indikatorlarini oldini olish uchun o'zingizning fon rasmingizni oching va balandlik va kenglik haqida eslatma qiling.

Keyin rasmingizni hosting provayderingizga yuklab oling. Rasm uchun URLni tekshiring; rasmlarning ko'rinmasligi sabablari eng ko'p uchraydigan sabablardan biridir, chunki URL manzilida yozuv tipi mavjud.

Ushbu qadamni tugatsangiz, CSS-ning stil blokini hujjatning bosh qismiga qo'ying:


  1. Stolingizdagi fon uchun CSS-ni yozing va uni stil blokiga qo'ying:
    stol {fon: url (" rasmga URL ") no-repeat; }
  2. Jadvalni HTML ga joylashtiring:


    hujayra 1
    hujayra 2


    hujayra 1
    hujayra 2

  3. Jadvalning kengligi va balandligini tasvir kengligi va balandligiga mos kelishini o'rnating.
    width: 400px; height: 500px; "> ...

    Agar jadval tarkibingiz rasm balandligi va kengligidan katta bo'lsa, fon tasvirini faqat bir marta ko'rsatiladi.

    Fonni faqat bitta stolga qo'ying

    Yuqoridagi ko'rsatmalar sahifadagi har bir jadvalga bir xil fon tasvirini o'rnatadi.

    Agar fonni faqat ma'lum jadvallarga qo'yish zarur bo'lsa, siz sinf atributidan foydalanishingiz kerak.

    1. O'qish uchun CSS-ni o'zgartiring:
      table.background {background: url (" image to image ") no-repeat; }
    2. Sinf fonini o'sha fon tasviriga ega bo'lishni xohlagan istalgan jadvalga qo'shing. Ushbu jadvallar uchun kenglik va balandlikni o'rnating.
    class = "background" style = "width: 400px; height: 500px;> ...

    Jadval fon tasvirini takrorlang

    Keyinchalik katta jadvallar yoki ko'proq tarkibga ega jadvallar, butun jadvalni to'ldirish uchun fonni takrorlashi kerak bo'lishi mumkin. Rasm y o'qi, x o'qi bilan takrorlanadi yoki har ikkala tilda ham tilga olinadi.

    fon: url (" rasmga URL ") takrorlang ;

    Odatiy bo'lib, takroriy qiymat keragicha bo'ladi, lekin takrorlashni yana-qayta-x yoki takrorlash uchun-y yoki gorizontal yoki vertikal ravishda joylashtirish uchun sozlashingiz mumkin.

    Hujayra fon ranglari stol fon rasmini blokirovka qiladi

    Jadval hujayralarida o'rnatilgan fon ranglari jadvaldagi fon tasvirini bekor qiladi. Shunday qilib, hujayralaringizda fon ranglarini jadval fon tasvirlari bilan birga ishlatganda ehtiyot bo'ling.

    Hisobot

    Jadval fonalari jadvallaringizni asosiy sahifadan ajratadi. Biroq, ushbu texnikani ishlatishdan oldin ikki marta o'ylab ko'ring. Neytral tasvirni kiritish beparvo bo'lmasligi mumkin, lekin murakkab (masalan, uyda oziqlangan bolalarni ko'rsatadigan stol ortidagi mushukning rasmini qo'shish) murakkab suratlar professional bo'lmagan holda paydo bo'lishi va tabular ma'lumotlarning okunabilirliğine ta'sir qilishi mumkin.

    Foydalanadigan har qanday rasm to'g'ri litsenziyalangan bo'lishi kerak; Internetdagi rasmni topishingiz uchun siz uni o'zingiz uchun ishlatishingiz mumkin degani emas.

    Mualliflik huquqlarini hurmat qiling!