सुरुवातीच्यासाठी: एका चित्राभोवती मजकूर कसा काढायचा

या लेखात आपण चित्रांसह असलेल्या HTML आणि CSS ची वैशिष्ट्ये सांगू. आपण त्यांना HTML डॉक्युमेंटमध्ये कसे घालायचे हे शिकू. लेखात आपल्याला चित्राचे मापदंड कसे बदलावे आणि मजकूर सह चित्रभोवतीचा प्रवाह कशा व्यवस्थित करावा याबद्दल माहिती मिळेल.

प्रथम - प्रतिमा घालण्याबद्दल हे करण्यासाठी, एक "आयएमजी" टॅग आहे ज्यामध्ये अनेक विशेषता आहेत. मुख्य एक "src" आहे. हे त्या पत्त्यावर संचयित करते ज्यावरून ब्राउझर चित्र घालू शकतो. आपण संगणकात आधीच जतन केलेल्या प्रतिमेचा मार्ग निर्दिष्ट करू शकता किंवा वेब स्रोतासाठी एक दुवा देऊ शकता.

पुढील महत्त्वपूर्ण विशेषता जोडी "रूंदी" आणि "उंची" आहे ते चित्राच्या स्वहस्ते रिसाइज करण्यासाठी वापरले जातात (प्रतिमा पसरवण्यासाठी आणि संकुचित करण्यासाठी एक उपयुक्त पर्याय)

नंतर, "hspace" आणि "vspace" पॅरामीटर (इमेज पासून आसपासच्या मजकूरापर्यंतचे अंतर). स्पष्टपणे, "hspace" क्षैतिज इंडेंटेशन आहे, आणि "vsspace" अनुलंब आहे.

या टॅगमध्ये "alt" आणि "title" असे विशेषता आहेत. ते एकमेकांसारखेच असतात, कारण त्यांचा उद्देश चित्र वर्णन करणे आहे. परंतु "शीर्षक" लिहिलेले मजकूर आहे जे आपण प्रतिमेवर माउस फिरवाल तेव्हा दिसेल आणि चित्र लोड होण्यात अयशस्वी झाल्यास "alt" विशेषतेचे अक्षर मूल्य प्रदर्शित केले जाईल.

बर्याच विशिष्ट विशिष्ठ गुणधर्म आहेत जे बर्याच टॅग्जमध्ये उपस्थित आहेत. हे "accesskey", "class", "id" आणि "style" आहेत. "प्रवेशयोग्यता" कीबोर्ड शॉर्टकट निर्दिष्ट करते ज्याद्वारे ऑब्जेक्टवर प्रवेश केला जातो. "क्लास" आणि "id" सीएसएस संबंधित पॅरामीटर्स आहेत. ते वर्णन करतात की कोणत्या चित्राने चित्र येते (किंवा त्याची ओळखकर्ता). "शैली" एक मजकूर विशेषता आहे जी आपल्याला अंगभूत CSS- शैलीची प्रतिमा निर्दिष्ट करण्याची परवानगी देते.

प्रतिमेचा देखावा परिभाषित करणारा एक मापदंड "सीमा" आहे. हे ऑब्जेक्टभोवती फ्रेमची जाडी निश्चित करते आणि कोणत्याही सकारात्मक पूर्णांक (पिक्सल मध्ये) द्वारे निर्देशित केले जाऊ शकते.

पुढील विशेषता "संरेखन" आहे. हे मजकूरासह चित्राभोवती प्रवाह दर्शवितो. हे पॅरामीटर "खालची", "मध्यम", "डावे", "उजवे" आणि "शीर्ष" असे घटक घेऊ शकतात. प्रत्येक मजकुराची रचना मजकूरशी संबंधित असेल जिथे चित्राशी संबंधित असेल. उदाहरणार्थ, मूल्य "मधले" असल्यास, प्रतिमेचा मध्य मजकूराच्या तळाशी संरेखित केला जाईल आणि जेव्हा "डावीकडे" असेल - वस्तु मजकूरच्या डाव्या बाजूला असेल. पण हा मजकूर मजकूर सुमारे प्रवाह सेट करण्याचा एकमेव मार्ग आहे - एचटीएमएल

आणखी एक शक्तिशाली साधन - सीएसएस (अधिक अष्टपैलू) आहे. त्याच्या मदतीने, आपण अधिक स्पष्टपणे टॅगचे गुणधर्म सेट करू शकता, ज्यामध्ये चित्राच्या मजकूराचा प्रवाह समाविष्ट आहे. सीएसएस आपल्याला केवळ एका विशिष्ट ऑब्जेक्टच्या पॅरामीटर्स परिभाषित करण्यास परवानगी देते, परंतु सर्व पसंती उदाहरणार्थ, जर तुम्हाला दहा पिक्सेल्स च्या डॉक्युमेंट्स मधील सर्व इमेज्सच्या इंडेंटस विनिर्दिष्ट करायचे असतील, तर त्यास फक्त एक ओळ असलेली सीएसएस फाइल संलग्न करणे पुरेसे आहे: "img {margin: 10px 10px 10px 10px;}" (सराव मध्ये, कोट्सची आवश्यकता नाही!).

आणि मजकूरासह चित्राभोवतीचा प्रवाह, उदाहरणार्थ, डाव्या बाजूवर असे सेट केले आहे: "img {align: left;}"

तसे, सीएसएस-कोड जोडण्यासाठी त्यास फाइलमध्ये लिहिण्याची आवश्यकता नाही. हे करण्यासाठी, HTML एक "शैली" टॅग प्रदान करते, ज्यामध्ये आपण सीएसएस कोड समाविष्ट करू शकता. परंतु हे फक्त ह्या डॉक्युमेंटसाठी कार्य करेल (जर तुम्हाला समान कोड अनेक HTML फाईल्समध्ये जोडायचा असेल तर वेगळा स्टाईल शीट तयार करा)

आता आपण साइटच्या टॅगच्या उपयुक्त गुणधर्मांचा वापर करून साइटसह प्रतिमा "सौम्य करणे" करू शकता, जे याकरिता जबाबदार आहे. चित्राभोवती आकार बदलण्याची किंवा मजकूर ओपिंग लागू होण्यास मोकळ्या मनाने. चित्रमय घटक नसलेले वेब पृष्ठे ऐवजी कंटाळवाणा आहेत, नाही का?