Skip to main content

Command Palette

Search for a command to run...

CSS Layout in hindi

Updated
2 min read
A

I am working as freelancer. I am a experienced full stack web developer. My lovely stack is MERN but I am open for new tech. I love to work with teammates for achieve goals. I love researches to find specific new things.

What is CSS Layout?

एक अच्छा वेब डेवलपर वह होता है, जो किसी वेब पेज को डिजाइन करने से पहले उसका एक ढांचा तैयार कर लेता है। Layout से आशय है कि वेब पेज को कोडिंग करने से पहले एक outline बना लेना। Layout इस तरह से डिजाइन किया जाता है कि यूजर experience सबसे ज्यादा हो। यह CSS को यह अधिकार देता है कि element की position और size निर्धारित कर सके। जैसे-

Benefits of CSS Layout:

Better Presentation and structure

Css Layout से एक बेहतर presentation तैयार किया जाता है।

Better Accessbility

पहले ही layout बन जाने से Accessbility को काफी हद तक सुधारा जाता है।

Flexible And responsive

Layout को आसानी से बदला जा सकता है। और यूजर को ध्यान में रखते हुए responsive layout बनाया जाता है।

Reusability

इस Layout को आसानी से दोबारा use किया जा सकता है।

Browser compatibility

यह सभी browser पर आसानी से फिट हो जाता है।

Types of CSS Layout

यह निम्न प्रकार का होता है-

1. Normal Flow

यह default और सबसे सरल css layout है। इसमें element उसी तरह से दिखते हैं, जैसे कोडिंग की गयी है।जैसे- heading की layout.

<h1> this is Heading</h1>

2.Float

यह element की block में position सेट करता है। जैसे ब्लॉक में दायीं तरफ या बायीं तरफ। इसकी लगभग तीन property value है-

none

इसमें कोई परिवर्तन नहीं होता है। float:none;

left

यह element को बायीं तरफ सेट कर देता है।

img{float: left;}

output:

right

यह element को दायीं ओर सेट करता है।

img{float: right;}

3.Position

यह निर्धारित करता है कि content की पोजीशन क्या रहेगी। इसे अगले ब्लॉग में अलग से बताया गया है।

4.Flex

5.Grid