జెక్కీ మొబైల్ థీమ్

జెక్కీ మొబైల్ థీమ్

జూలీ మొబైల్ ఐదు రకాల స్టైల్ థీమ్స్ అందిస్తుంది, "a" నుండి "e" వరకు - ప్రతి థీమ్ వేర్వేరు రంగుల బటన్లు, పట్టీలు, కంటెంట్ బ్లాక్స్ మొదలైనవి కలిగి ఉంటుంది. జూలీ మొబైల్ లోని ఒక థీమ్ అనేది పలు దృశ్యపరమైన ప్రభావాలు మరియు రంగులను కలిగి ఉంటుంది.

అనుకూలీకరించడానికి అనువర్తనం ప్రక్రియను మలచడానికి data-theme అట్రిబ్యూట్ని ఉపయోగించండి మరియు అది విలువని కేటాయండి:

<div data-role="page" data-theme="a|b|c|d|e">
విలువ వివరణ ఉదాహరణ
a డిఫాల్ట్. బ్లాక్ బ్యాక్గ్రౌండ్ పై తెలుపు టెక్స్ట్. పరీక్ష
b నీలి బ్యాక్గ్రౌండ్ పై తెలుపు టెక్స్ట్ / గ్రే బ్యాక్గ్రౌండ్ పై బ్లాక్ టెక్స్ట్ పరీక్ష
c తెలుపు గ్రే బ్యాక్గ్రౌండ్ పై బ్లాక్ టెక్స్ట్ పరీక్ష
d తెలుపు బ్యాక్గ్రౌండ్ పై బ్లాక్ టెక్స్ట్ పరీక్ష
e నారింజ బ్యాక్గ్రౌండ్ పై బ్లాక్ టెక్స్ట్ పరీక్ష

హిందూస్థాన్ పేరు:మీ ప్రియమైన థీమ్లను మిశ్రమీకరించండి!

డిఫాల్ట్లో, jQuery Mobile హెడర్ మరియు ఫూటర్ కు "a" థీమ్ ఉపయోగిస్తుంది, హెడర్ కంటెంట్ కు "c" థీమ్ ఉపయోగిస్తుంది (తెలుపు గ్రే). అయితే, మీరు థీమ్లను మిశ్రమీకరించవచ్చు.

థీమ్ పేజీ, కంటెంట్ మరియు ఫూటర్

实例

<div data-role="header" data-theme="b"></div>
<div data-role="content" data-theme="a"></div>
<div data-role="footer" data-theme="e"></div>

స్వయంగా ప్రయత్నించండి

థీమ్ డైలాగ్

实例

<a href="#pagetwo" data-rel="dialog">థీమ్ డైలాగ్ పేజీకి వెళ్ళండి</a>
<div data-role="page" id="pagetwo" data-overlay-theme="e">
  <div data-role="header" data-theme="b"></div>
  <div data-role="content" data-theme="a"></div>
  <div data-role="footer" data-theme="c"></div>
</div>

స్వయంగా ప్రయత్నించండి

థీమ్ బటన్లు

实例

<a href="#" data-role="button" data-theme="a">బటన్</a>
<a href="#" data-role="button" data-theme="b">బటన్</a>
<a href="#" data-role="button" data-theme="c">బటన్</a>

స్వయంగా ప్రయత్నించండి

థీమ్ బటన్లు

实例

<a href="#" data-role="button" data-icon="plus" data-theme="e">ప్లస్</a>

స్వయంగా ప్రయత్నించండి

పేజీ హెడర్ మరియు ఫూటర్ లో థీమ్ బటన్లు

实例

<div data-role="header">
  <a href="#" data-role="button" data-icon="home" data-theme="b">హోమ్</a>
  <h1>నా హోమ్ పేజీకి స్వాగతం</h1>
  <a href="#" data-role="button" data-icon="search" data-theme="e">శోధన</a>
</div>
<div data-role="footer">
  <a href="#" data-role="button" data-theme="b" data-icon="plus">బటన్ 1</a>
  <a href="#" data-role="button" data-theme="c" data-icon="plus">బటన్ 2</a>
  <a href="#" data-role="button" data-theme="e" data-icon="plus">బటన్ 3</a>
</div>

స్వయంగా ప్రయత్నించండి

థీమ్ పరిధి పరిపూర్ణ నేవిగేషన్ ప్యానెల్

实例

<div data-role="footer" data-theme="e">
  <h1>ఇక్కడ ఫూటర్ పదబంధాన్ని ప్రవేశపెట్టుము</h1>
  <div data-role="navbar">
    <ul>
      <li><a href="#" data-icon="home" data-theme="b">బటన్ 1</a></li>
      <li><a href="#" data-icon="arrow-r">బటన్ 2</a></li>
      <li><a href="#" data-icon="arrow-r">బటన్ 3</a></li>
      <li><a href="#" data-icon="search" data-theme="a" >బటన్ 4</a></li>
    </ul>
  </div> 
</div>

స్వయంగా ప్రయత్నించండి

థీమ్ పరిధి పరిపూర్ణ బటన్లు మరియు పరిణామం

实例

<div data-role="collapsible" data-theme="b" data-content-theme="e">
  <h1>నాకు క్లిక్ చేయండి - నేను కలిపివేయబడిన విషయం!</h1>
  <p>నేను విస్తరించబడిన పరిణామం.</p>
</div>

స్వయంగా ప్రయత్నించండి

థీమ్ పరిధి జాబితా

实例

<ul data-role="listview" data-theme="e">
  <li><a href="#">జాబితా అంశం</a></li>
  <li data-theme="a"><a href="#">జాబితా అంశం</a></li>
  <li data-theme="b"><a href="#">జాబితా అంశం</a></li>
  <li><a href="#">జాబితా అంశం</a></li>
</ul>

స్వయంగా ప్రయత్నించండి

థీమ్‌పై పెట్టబడిన విభజన బటన్‌లు

实例

<ul data-role="listview" data-split-theme="e">

స్వయంగా ప్రయత్నించండి

థీమ్‌పై పెట్టబడిన కలిపించబడిన జాబితాలు

实例

<div data-role="collapsible" data-theme="b" data-content-theme="e">
  <ul data-role="listview">
    <li><a href="#">అగ్నెస్</a></li>
  </ul>
</div>

స్వయంగా ప్రయత్నించండి

థీమ్‌పై పెట్టబడిన ఫారమ్‌లు

实例

<label for="name">పూర్తి పేరు:</label>
<input type="text" name="text" id="name" data-theme="a">
<label for="colors">ఇష్టమైన రంగును ఎంచుకోండి:</label>
<select id="colors" name="colors" data-theme="b">
  <option value="red">ఎరుపు</option>
  <option value="green">హరితం</option>
  <option value="blue">నీలం</option>
</select>

స్వయంగా ప్రయత్నించండి

థీమ్‌పై పెట్టబడిన కలిపించబడిన ఫారమ్‌లు

实例

<fieldset data-role="collapsible" data-theme="b" data-content-theme="e">
<legend>నేను కలిపించబడిన విషయం - నేను కలిపించబడిన విషయం!</legend>

స్వయంగా ప్రయత్నించండి

కొత్త థీమ్ జోడించండి

జిన్నీ మొబైల్ మొబైల్ పేజీకి కొత్త థీమ్‌ను జోడించడానికి కూడా అనుమతిస్తుంది.

కొత్త థీమ్‌ను లేదా సవరించడానికి సిఎస్ఎస్ ఫైల్‌ను సవరించండి (జిన్నీ మొబైల్ డౌన్‌లోడ్ అయినప్పుడు). ఒక స్టైల్‌ని కాపీ చేసి, అక్షరాలను (ఎఫ్-జి) మార్చి, మీ ఇష్టమైన రంగు మరియు ఫంట్‌ను సవరించండి:

మీరు హెచ్ఎంఎల్ డాక్యుమెంట్‌లో థీమ్ క్లాస్‌లను వాడి కొత్త స్టైల్స్‌ను జోడించవచ్చు - టూల్‌బార్‌కు క్లాస్ ఉబి-అక్షరాలను జోడించండి మరియు కంటెంట్‌కు క్లాస్ యూ-బాడీ-అక్షరాలను జోడించండి:

实例