एचटीएमएलमध्ये प्रतिमा कशी केंद्रित करावी

लेखक: Mark Sanchez
निर्मितीची तारीख: 6 जानेवारी 2021
अद्यतन तारीख: 1 जुलै 2024
Anonim
एचटीएमएलमध्ये प्रतिमा कशी केंद्रित करावी - समाज
एचटीएमएलमध्ये प्रतिमा कशी केंद्रित करावी - समाज

सामग्री

गुणधर्म संरेखित करा टॅग html> HTML5 पासून नापसंत केले गेले आहे. हे गुणधर्म अजूनही बहुतांश वेब ब्राउझरमध्ये कार्य करत असताना, कॅस्केडिंग स्टाइल शीट्स (CSS) वापरून प्रतिमा संरेखित करण्याची शिफारस केली जाते. या लेखात, आम्ही आपल्याला CSS आणि बहिष्कृत टॅग वापरून प्रतिमा कशा केंद्रित करायच्या हे दाखवणार आहोत. संरेखित करा.

पावले

2 पैकी 1 पद्धत: CSS (शिफारस केलेले)

  1. 1 प्रतिमेसाठी HTML कोड जोडा. तुम्ही प्रतिमा संरेखित करण्यासाठी कॅस्केडिंग स्टाईल शीट्स (CSS) चा वापर कराल, परंतु तुम्हाला ते HTML वापरून पृष्ठावर ठेवावे लागेल. खालील टॅग वापरण्याचे उदाहरण आहे img> आपल्या कोडमध्ये प्रतिमा समाविष्ट करण्यासाठी:

    img src = "dog.webp" alt = "हे कुत्र्याचे चित्र आहे">

    • ऐवजी dog.webp प्रतिमा फाइलचे नाव बदला आणि "alt" नंतर प्रतिमेचे वर्णन प्रविष्ट करा. अर्थ केंद्र "वर्ग" साठी बदलू नका, कारण तुम्ही त्या नावाने CSS वर्ग तयार कराल.
  2. 2 CSS कोड शोधा. जर तुमच्या साइटवर वेगळी CSS फाइल असेल तर ती उघडा. नसल्यास, CSS बहुधा HTML फाईलच्या शीर्षस्थानी, टॅगच्या आत आहे डोके>... टॅग शोधण्यासाठी फाईलच्या शीर्षस्थानी स्क्रोल करा शैली < / style>.
    • टॅग असल्यास शैली < / style> नाही, त्यांना जोडा. अधिक माहितीसाठी हा लेख वाचा.
  3. 3 प्रतिमा संरेखित करण्यासाठी CSS जोडा. "50%" ऐवजी, पानावर प्रतिमा दिसण्यासाठी तुम्ही वेगळे मूल्य प्रविष्ट करू शकता. तुम्ही "100%" मूल्यासह प्रतिमा मध्यभागी ठेवू शकणार नाही, म्हणून ही संख्या वेगळी असावी.

    .center {प्रदर्शन: ब्लॉक; मार्जिन-डावे: ऑटो; मार्जिन-उजवा: ऑटो; रुंदी: 50%; }

  4. 4 तुमचे बदल सेव्ह करा. HTML फाइल आणि CSS फाइल (असल्यास) सेव्ह करा. हे प्रतिमेला मध्यभागी ठेवेल.
    • तसेच टॅगच्या आत img> जोडू शकता इतर प्रतिमा मध्यभागी ठेवण्यासाठी.

2 पैकी 2 पद्धत: HTML मधील "संरेखित" विशेषता

  1. 1 नवीन परिच्छेद तयार करा. प्रतिमांना केंद्रीत करण्याची ही पद्धत नाकारली गेली असली तरी ती अजूनही अनेक ब्राउझरमध्ये कार्य करते. तथापि, जेव्हा ब्राउझर निर्दिष्ट विशेषताचे समर्थन करणे थांबवतात तेव्हा साइट कार्यशील ठेवण्यासाठी आम्ही CSS वापरण्याची शिफारस करतो. लक्षात ठेवा की विशेषता संरेखित करा चित्र केवळ त्याच्या सभोवतालच्या घटकाच्या मध्यभागी असेल (उदाहरणार्थ, टॅगच्या आत p> </p> किंवा div> </div>). उदाहरण म्हणून, HTML फाईलमध्ये, आम्ही जोडून एक नवीन परिच्छेद तयार करू p> वेगळ्या ओळीवर.
  2. 2 प्रतिमेसाठी HTML कोड जोडा. टॅग नंतर खालील कोड टाका p>... हे उदाहरण मार्गदर्शक म्हणून वापरा:

    p> img src = "dog.webp" alt = "picture" align = "middle">

    • ऐवजी dog.webp प्रतिमा फाइलचे नाव बदला आणि "alt" नंतर प्रतिमेचे वर्णन प्रविष्ट करा.
    • मध्य विशेषता ब्राउझरला पानाच्या मध्यभागी चित्र प्रदर्शित करण्यास सांगते.
  3. 3 परिच्छेद टॅग बंद करा. हे करण्यासाठी, जोडा / p> चित्र टॅग नंतर. तयार कोड असे काहीतरी दिसले पाहिजे:

    p> img src = "dog.webp" alt = "picture" align = "middle"> </p>

  4. 4 तुमचे बदल सेव्ह करा. हे प्रतिमेला मध्यभागी ठेवेल.