Computer >> कंप्यूटर >  >> प्रोग्रामिंग >> CSS

स्टाइलिंग टेबल के लिए आवश्यक सीएसएस गुण

<घंटा/>

हम CSS का उपयोग करके तालिकाओं के लिए शैलियों को परिभाषित कर सकते हैं। निम्नलिखित गुण अक्सर

और उसके तत्वों को स्टाइल करने के लिए उपयोग किए जाते हैं -

  • सीमा

    CSS बॉर्डर प्रॉपर्टी का इस्तेमाल बॉर्डर-चौड़ाई, बॉर्डर-स्टाइल और बॉर्डर-कलर को परिभाषित करने के लिए किया जाता है।

  • सीमा-पतन

    इस गुण का उपयोग यह निर्दिष्ट करने के लिए किया जाता है कि क्या

तत्वों की एक साझा या अलग सीमा होनी चाहिए।

  • कैप्शन

    कैप्शन-साइड प्रॉपर्टी का उपयोग टेबल कैप्शन बॉक्स को लंबवत स्थिति में करने के लिए किया जाता है।

  • खाली-कोशिकाएं

    इस गुण का उपयोग किसी तालिका के रिक्त कक्षों के प्रदर्शन को निर्दिष्ट करने के लिए किया जाता है।

  • टेबल-लेआउट

    तालिका की पंक्तियों, स्तंभों और कक्षों को बिछाने के लिए ब्राउज़र द्वारा उपयोग किए जाने वाले एल्गोरिथम को परिभाषित करने के लिए।

  • उदाहरण

    निम्नलिखित उदाहरण तालिकाओं की शैली को स्पष्ट करते हैं -

    <शैली>टेबल, टेबल * { बॉर्डर:थिन सॉलिड; पैडिंग:5px; फ़ॉन्ट-शैली:इटैलिक;}कैप्शन { कैप्शन-साइड:बॉटम;}td { बॉक्स-शैडो:इनसेट 0 0 6px हरा;}
    डेमो कैप्शन
    डेमो
    डेमो
    डेमो डेमो

    आउटपुट

    यह निम्न आउटपुट देता है -

    स्टाइलिंग टेबल के लिए आवश्यक सीएसएस गुण

    उदाहरण

     

    टीम रैंकिंग

    टीम (टेस्ट)रैंक
    भारत 1
    ऑस्ट्रेलिया2
    टीम (ODI) रैंक
    भारत 1
    इंग्लैंड2

    आउटपुट

    यह निम्न आउटपुट देता है -

    स्टाइलिंग टेबल के लिए आवश्यक सीएसएस गुण


    1. सीएसएस के साथ काम करने वाली स्टाइलिंग टेबल

      हम CSS का उपयोग करके तालिकाओं के लिए शैलियों को परिभाषित कर सकते हैं। और उसके तत्वों को स्टाइल करने के लिए निम्नलिखित गुणों का उपयोग किया जाता है - सीमा CSS बॉर्डर प्रॉपर्टी का इस्तेमाल बॉर्डर-चौड़ाई, बॉर्डर-स्टाइल और बॉर्डर-कलर को परिभाषित करने के लिए किया जाता है। सीमा-पतन इस गुण का उपयोग यह

    1. CSS में स्क्रॉल पर फिक्स्ड हैडर के साथ HTML टेबल्स

      पोस्टियन:स्टिकी और टॉप:0 सेट करके, हम HTML टेबल में स्क्रॉल पर एक फिक्स्ड हेडर बना सकते हैं। उदाहरण निम्नलिखित उदाहरण हमें इस बात का अंदाजा देते हैं कि इसे कैसे लागू किया जाए - <!DOCTYPE html> <html> <head> <style> div {    color: white;    display: flex;

    1. CSS अपडेट - टेक्स्ट डेकोरेशन और अंडरलाइन्स को स्टाइल करने के लिए नए गुण

      निम्नलिखित पाठ-सजावट गुणों की शुरूआत के साथ, अब हम पाठ को पहले की तुलना में अधिक तरीकों से शैलीबद्ध कर सकते हैं। टेक्स्ट-डेकोरेशन टेक्स्ट-डेकोरेशन-थिकनेस, टेक्स्ट-डेकोरेशन-कलर, टेक्स्ट-डेकोरेशन-लाइन और टेक्स्ट-डेकोरेशन-स्टाइल का शॉर्टहैंड है। टेक्स्ट-डेकोरेशन-स्किप, टेक्स्ट-डेकोरेशन-स्किप-इंक, टेक्स