CSS లో పేర్చబడిన ఫారమ్‌ను ఎలా సృష్టించాలి

CSS లో పేర్చబడిన ఫారమ్‌ను ఎలా సృష్టించాలి

CSS ఒక ప్రత్యేకమైన భాషా తరగతికి చెందినది, దీనిని స్టైల్ షీట్ లాంగ్వేజెస్ అని పిలుస్తారు. ఇది మీ వెబ్ పేజీ ప్రెజెంటేషన్‌ను నిర్వచించడానికి ప్రధానంగా ఉపయోగించబడుతుంది. మీ పేజీ ఎలా నిర్మాణాత్మకంగా ఉండాలో పేర్కొనడానికి HTML మిమ్మల్ని అనుమతించినప్పటికీ, దానిని స్టైల్ చేయడానికి CSS ఉపయోగించబడుతుంది. లేకపోతే, మీరు అందంగా ఆకర్షణీయంగా లేని వెబ్‌సైట్‌తో ముగుస్తుంది.





CSS పై దృష్టి పెట్టడం అనేది మీ వెబ్‌సైట్ యొక్క ఆకర్షణను మెరుగుపరచడానికి ఉత్తమమైన మార్గాలలో ఒకటి, ప్రత్యేకించి మీ వినియోగదారు అనుభవాన్ని మెరుగుపరిచే విషయంలో. ఈ విధంగా, మీరు మీ ట్రాఫిక్‌ను కూడా పెంచుకోవచ్చు. స్టార్టర్స్ కోసం, మీరు పేర్చబడిన ఫారమ్‌ను ఉపయోగించవచ్చు.





పేర్చబడిన ఫారం అంటే ఏమిటి?

పేర్చబడిన ఫారమ్ ఒక ప్రత్యేక ఫారమ్‌ని సృష్టించడానికి మిమ్మల్ని అనుమతిస్తుంది, ఇక్కడ మీరు మీ లేబుల్‌లు మరియు ఇన్‌పుట్‌లను ఒకదానిపై ఒకటి అడ్డంగా ఉంచడం కంటే వాటిని ఉంచవచ్చు.





మీరు దీన్ని ఎలా చేయగలరో ఇక్కడ ఉంది.

HTML కోడ్ చేయండి

HTML మూలకాన్ని ఉపయోగించండి, , మీ సమాచారాన్ని ప్రాసెస్ చేయడానికి. సంబంధిత ఫీల్డ్‌ల కోసం లేబుల్‌లను జోడించి, సంబంధిత ఇన్‌పుట్ ఫీల్డ్‌లను కేటాయించండి. ఈ ఉదాహరణలో, ఫారమ్ యొక్క ఇన్‌పుట్ రకంతో వారి పూర్తి పేరు మరియు ఇమెయిల్ చిరునామాను అందించమని మేము వినియోగదారులను కోరుతున్నాము టెక్స్ట్ , అయితే డ్రాప్-డౌన్ మెను దీని ద్వారా సృష్టించబడుతుంది ఐడిని ఎంచుకోండి వారి పరిశ్రమను ఎంచుకోవడానికి వారికి సహాయం చేయడానికి.







What Is a Stacked Form?


Here's how you create a stacked form.



Full Name

Email Address

Department

Information Technology
Customer Support
Sales





ఏదేమైనా, ఈ కోడ్‌ని అమలు చేయడం ద్వారా ఫీల్డ్‌లను నిలువుగా స్టాకింగ్ చేయకుండా ఒక బ్లాండ్ ఫారం మాత్రమే ఉత్పత్తి అవుతుంది. మరియు అక్కడే మీరు CSS ని జోడించాల్సి ఉంటుంది.





ఇప్పుడు ఉపయోగించడానికి క్లీనర్ సురక్షితమైనది

CSS భాగాన్ని కోడ్ చేయండి

ఇప్పుడు, బాడీ ట్యాగ్‌కు ముందు ప్రత్యేక స్టైల్ షీట్‌ను క్రియేట్ చేయండి మరియు దానిని మీ HTML కి జోడించండి:


తరువాత, మీ HTML బాడీ, ఇన్‌పుట్ రకాలు మరియు కంటైనర్‌ను ఎంచుకోండి మరియు వాటిని CSS ద్వారా స్టైల్ చేయండి. ఇందులో ఫాంట్-ఫ్యామిలీ, వెడల్పు, ప్యాడింగ్, మార్జిన్, డిస్‌ప్లే, బోర్డర్ మొదలైన విభిన్న CSS లక్షణాలతో ప్రయోగాలు చేయడం మరియు మీకు ఇష్టమైన విలువలను జోడించండి. ఈ విధంగా, మీరు మీ ఖచ్చితమైన ప్రాధాన్యతలకు సరిపోయే పేర్చబడిన ఫారమ్‌తో ముగుస్తుంది. ఇక్కడ ఒక ఉదాహరణ.






body {
font-family: Calibri;
}
input[type=text], select {
width: 25%;
padding: 12px 20px;
margin: 8px 10;
display: list-item;
border: 4px double #39A9DB;
border-radius: 8px;
box-sizing: border-box;
}
input[type=submit] {
width: 25%;
background-color: #F8E2E6;
color: #0000FF;
padding: 12px 18px;
margin: 20px 0;
border: none;
border-radius: 6px;
cursor: pointer;
}
div.container {
border-radius: 10px;
background-color: #39A9DB;
padding: 40px;
}

దిగువ అవుట్‌పుట్‌ను తనిఖీ చేయండి.

ఇప్పుడు మీరు CSS లో పేర్చబడిన ఫారమ్‌ను సృష్టించవచ్చు

ఈ వ్యాసంతో, మీరు CSS లో పేర్చబడిన ఫారమ్‌ను ఎలా సృష్టించాలో నేర్చుకున్నారు. అభ్యాసంతో, మీరు మీ ఫారమ్‌లను మెరుగుపరచగలరు మరియు మీ వెబ్‌సైట్‌ను మరింత యూజర్ ఫ్రెండ్లీగా చేయగలరు.

నా రౌటర్‌లో wps అంటే ఏమిటి

ప్రోగ్రామింగ్ గేమ్ పేరు 'ప్రాక్టీస్'. స్టైలిష్ వెబ్ డిజైనర్ మరియు మరింత సమర్థవంతమైన వెబ్ డెవలపర్‌గా ఎగ్జిబిషన్ ప్రాజెక్ట్‌లతో మీ CSS నైపుణ్యాలను ప్రతిరోజూ మెరుగుపరుచుకోండి.

షేర్ చేయండి షేర్ చేయండి ట్వీట్ ఇమెయిల్ 10 సాధారణ CSS కోడ్ ఉదాహరణలు మీరు 10 నిమిషాల్లో నేర్చుకోవచ్చు

CSS తో సహాయం కావాలా? ప్రారంభించడానికి ఈ ప్రాథమిక CSS కోడ్ ఉదాహరణలను ప్రయత్నించండి, ఆపై వాటిని మీ స్వంత వెబ్ పేజీలకు వర్తింపజేయండి.

తదుపరి చదవండి
సంబంధిత అంశాలు
  • ప్రోగ్రామింగ్
  • వెబ్ అభివృద్ధి
  • CSS
రచయిత గురుంచి ఉస్మాన్ ఘనీ(4 కథనాలు ప్రచురించబడ్డాయి)

ఉస్మాన్ డిజిటల్ ప్లాట్‌ఫామ్‌లలో సేంద్రీయ వృద్ధితో అనేక వ్యాపారాలకు సహాయపడిన కంటెంట్ మార్కెటర్. అతను ప్రోగ్రామింగ్ మరియు రైటింగ్ రెండింటినీ ఇష్టపడతాడు, అంటే టెక్నికల్ రైటింగ్ అతను చాలా ఆనందిస్తాడు. పని చేయనప్పుడు, ఉస్మాన్ టీవీ కార్యక్రమాలు చూడటం, క్రికెట్‌ను అనుసరించడం మరియు డేటా అనలిటిక్స్ గురించి చదవడం ఆనందించేవాడు.

ఉస్మాన్ ఘనీ నుండి మరిన్ని

మా వార్తాలేఖకు సభ్యత్వాన్ని పొందండి

టెక్ చిట్కాలు, సమీక్షలు, ఉచిత ఈబుక్‌లు మరియు ప్రత్యేకమైన డీల్స్ కోసం మా వార్తాలేఖలో చేరండి!

సభ్యత్వం పొందడానికి ఇక్కడ క్లిక్ చేయండి