• Skip to primary navigation
  • Skip to main content

  • Home
  • Tutorials
    • Computer Tutorial
    • Internet Tutorial
    • Windows Tutorial
    • Android Tutorial
    • MS Office
      • MS Word Tutorial
      • MS Excel Tutorial
      • MS PowerPoint Tutorial
    • HTML Tutorial
    • CSS Tutorial
    • WordPress Tutorial
    • Blogger Tutorial
    • MS Paint Tutorial
    • WordPad Tutorial
    • Notepad Tutorial
    • Paytm Tutorial
    • WhatsApp Tutorial
  • How To
  • Articles
  • Career Guide
  • Video Tutorials
  • Books
  • Courses

CSS float Property क्या हैं पूरी जानकारी हिंदी में?

अंतिम सुधार September 22, 2018 लेखक TP Staff

इस Tutorial में हम आपको CSS float Property in Hindi के बारे में पूरी जानकारी देंगे. अध्ययन की सुविधा के लिए हमने इस Tutorial को निम्न भागों में बांटा हैं.

List of Content

  1. CSS float Property का परिचय – Introduction to CSS float in Hindi.
  2. Different Type of float Property Values
  3. float Property Example in Hindi
  4. आपने क्या सीखा?

CSS float Property का परिचय

जब हम MS Word या किसी अन्य Text Editor में कोई Document बनाते हैं तो उसमे Picture के चारों तरफ Content आ जाता हैं. या Picture एक तरफ जैसे Left/Right Side होती हैं और Content एक तरफ होता है.

लेकिन, Webpages में इस कार्य को करन के लिए एक CSS Property का इस्तेमाल किया जाता हैं. जिसका नाम हैं – CSS float Property.

CSS float Property द्वारा Image को Right या Left Side Float कर सकते हैं. और Content को उसके चारों तरफ Show करा सकते हैं. Image के अलावा HTML के Block Level Elements को भी float किया जा सकता हैं.

float Property द्वारा सिर्फ दांए एवं बांए तरफ ही Elements को float करा सकते हैं. इससे ऊपर-नीचे float नही कर सकते हैं. जब किसी Element को float किया जाता हैं तो वह Container की Full Width तक float होता हैं. या अगले Floated Element तक float होता हैं.

Different Type of Float Values

Elements की Floating को नियंत्रित करने के लिए float Property के द्वारा कई Values उपलब्ध करवाई जाती हैं. ताकि floating को नियंत्रित किया जा सके. नीचे float Property की Values के बारे में बताया जा रहा हैं.

  • left – इस Value से Element Left Side में float होता हैं. और बाकि Inline Elements एवं Content इसके चारों तरफ Show होगा.
  • right – इस Value से Element Right Side में float होगा. आपकी स्क्रीन में दांए तरफ.
  • none – इस Value से Element अपने Normal Flow में Show होता हैं.
  • initial – इस Value से Default Value Show होती हैं.
  • inherit – इस Value से Element Parent Element की Value से Show होता हैं.

float Property Example

इसे Try कीजिए

<!DOCTYPE html>
<html>
<head>
<title>CSS float Property Example</title>
<style type=”text/css”>

div {
border: 1px solid red;
}

#div2 {
float: left;
}

#div3 {
float: right;
}

</style>
</head>
<body>

<p>नीचे हम 3 Div Define कर रहे हैं. जिसमे से हम Div2 को Left float कर रहे हैं और Div3 को Right float कर रहे हैं.</p>

<div id=”div1″>This is Div1</div>
<div id=”div2″>Div2 floating left.</div>
<div id=”div3″>Div3 floating right.</div>
</body>

</html>

ऊपर दिया कोड इस प्रकार का परिणाम देगा.

नीचे हम 3 Div Define कर रहे हैं. जिसमे से हम Div2 को Left float कर रहे हैं और Div3 को Right float कर रहे हैं.

This is Div1

 

Div2 floating left.
Div3 floating right.

आपने क्या सीखा?

इस Tutorial में हमने आपको CSS float Property की पूरी जानकारी दी हैं. आपने विभिन्न प्रकार की float Property Values के बारे में भी जाना हैं. हमे उम्मीद हैं कि यह Tutorial आपके लिए उपयोगी साबित होगा.

About TP Staff

लेखक: TP Staff

TP Staff, TutorialPandit की कम्प्यूटर और टेक्नोलॉजी पेशेवरों की टीम है, जिसका नेतृत्व जी पी गौतम द्वारा किया जाता है. TutorialPandit के माध्यम से भारत देश में हर साल लाखों लोग फ्री डिजिटल शिक्षा ग्रहण कर रहे है.

Join TutorialPandit on Telegram
Use Filmora video editor to express your creativity and amaze with beautiful results.

Reader Interactions

Leave a Reply Cancel reply

Your email address will not be published. Required fields are marked *

© Copyright TutorialPandit. All Rights Reserved.

  • About Us
  • Contact Us
  • Terms
  • Privacy Policy
  • Comment Policy