శరీర నేపథ్య చిత్రాలు సులభంగా పూర్తయ్యాయి

చాలా సైట్లలో మీరు కనుగొనే మంచి లక్షణం ఏమిటంటే, సెంటర్ కంటెంట్ ప్రాంతం దాని వెనుక డ్రాప్ షాడోతో పేజీని అతివ్యాప్తి చేస్తుంది. ఒకే నేపథ్య చిత్రంతో మీ బ్లాగ్ అందంగా (లేదా ఇతర వెబ్‌సైట్) కనిపించేలా చేయడానికి ఇది చాలా సరళమైన పద్ధతి.

ఇది ఎలా జరుగుతుంది?

1. మీ కంటెంట్ ఎంత విస్తృతంగా ఉందో గుర్తించండి. ఉదాహరణ: 750 పిక్స్‌.
2. మీ ఇలస్ట్రేషన్ అప్లికేషన్‌లో (నేను ఇలస్ట్రేటర్‌ని ఉపయోగిస్తాను) కంటెంట్ ప్రాంతం కంటే విస్తృతంగా చిత్రాన్ని రూపొందించండి. ఉదాహరణ: 800px.
3. చిత్రం యొక్క నేపథ్యాన్ని మీరు బ్లాగ్ యొక్క ప్రతి వైపు కలిగి ఉండాలనుకునే నేపథ్యానికి సెట్ చేయండి.
4. నేపథ్యంలో తెల్లని ప్రాంతాన్ని జోడించండి.
5. ప్రాంతం యొక్క ఇరువైపుల నుండి వెలికితీసే తెల్ల ప్రాంతంపై నీడను వర్తించండి.
6. పంట ప్రాంతం వెడల్పు 1 పిక్సెల్ ఎత్తుతో సెట్ చేయండి. ఇది శీఘ్ర రెండరింగ్ కోసం చిత్రాన్ని చక్కగా మరియు కాంపాక్ట్‌గా డౌన్‌లోడ్ చేయడానికి చేస్తుంది.
7. చిత్రాన్ని అవుట్పుట్ చేయండి.

ఇల్లస్ట్రేటర్ ఉపయోగించి నేను దీన్ని ఎలా నిర్మించానో ఇక్కడ ఉంది (నా వద్ద పంట విస్తీర్ణం చాలా పొడవుగా ఉందని గమనించండి… అది నేను ఏమి చేస్తున్నానో మీరు చూడగలరు):

నేపథ్య చిత్రంతో అవుట్పుట్ ఎలా ఉంటుందో ఇక్కడ ఒక ఉదాహరణ:

మీ బాడీ స్టైల్ ట్యాగ్‌ను ఉపయోగించి చిత్రాన్ని ఎలా ఉపయోగించాలో ఇక్కడ ఉంది CSS దాఖలు.

నేపథ్యం: # B2B2B2 url ('images / bg.gif') రిపీట్- y సెంటర్;

నేపథ్య శైలి ట్యాగ్ యొక్క విచ్ఛేదనం ఇక్కడ ఉంది:

• # B2B2B2 - పేజీ యొక్క మొత్తం నేపథ్య రంగును సెట్ చేస్తుంది. ఈ ఉదాహరణలో, నేపథ్య చిత్రంలో బూడిద రంగుతో సరిపోలడం బూడిద రంగు.
• url ('images / bg.gif') - మీరు ఉపయోగించాలనుకుంటున్న నేపథ్య చిత్రాన్ని సెట్ చేస్తుంది.
• రిపీట్-వై - చిత్రాన్ని y- అక్షం మీద పునరావృతం చేయడానికి సెట్ చేస్తుంది. కాబట్టి నేపథ్య చిత్రం పేజీ పై నుండి క్రిందికి పునరావృతమవుతుంది.
• సెంటర్ - చిత్రాన్ని పేజీ మధ్యలో సెట్ చేస్తుంది.

బాగుంది మరియు సులభం… ఒక చిత్రం, ఒక స్టైల్ ట్యాగ్!