में हम इस शीर्षक के साथ एक सरल छवि गैलरी crating पोस्ट. एक सूची के साथ और कुछ बहुत आसान सीएसएस ऐसा करने के लिए एक बहुत आसान तरीका है. पर तुम क्या तुम एक शीर्षक या अधिक है चाहता हूँ मई अपने फोटो गैलरी के साथ क्या करना चाहते हैं निर्भर करता है जानकारी पृष्ठ पर उपलब्ध है.

अब हम एक सरल HTML संरचना creat पहले.

  > <div वर्ग = "gallery"> 
  <ul> 
  > <img src = "bw1.jpg"  / > <p> Image Caption </p> </a> </li> <li> <a href = "#"> <img src = "bw1.jpg" /> <p> छवि कैप्शन </ p> </ a> </ ली> 
  > <img src = "bw1.jpg"  / > <p> Image Caption </p> </a> </li> <li> <a href = "#"> <img src = "bw1.jpg" /> <p> छवि कैप्शन </ p> </ a> </ ली> 
  > <img src = "bw1.jpg"  / > <p> Image Caption </p> </a> </li> <li> <a href = "#"> <img src = "bw1.jpg" /> <p> छवि कैप्शन </ p> </ a> </ ली> 
  > <img src = "bw1.jpg"  / > <p> Image Caption </p> </a> </li> <li> <a href = "#"> <img src = "bw1.jpg" /> <p> छवि कैप्शन </ p> </ a> </ ली> 
  > <img src = "bw1.jpg"  / > <p> Image Caption </p> </a> </li> <li> <a href = "#"> <img src = "bw1.jpg" /> <p> छवि कैप्शन </ p> </ a> </ ली> 
  > <img src = "bw1.jpg"  / > <p> Image Caption </p> </a> </li> <li> <a href = "#"> <img src = "bw1.jpg" /> <p> छवि कैप्शन </ p> </ a> </ ली> 
  </ उल> 
  </ div> 

सीएसएस कोड
अब हम सरल और कारगर सीएसएस कोड बनाएँ. ये कोड है.

  ; padding : 0 ; } * (मार्जिन: 0; padding: 0;) 
  शरीर ( 
  normal  Arial, Helvetica, sans-serif ; फ़ॉन्ट: 100%. 1 सामान्य Arial, Helvetica, बिना सेरिफ़; 
  ) 
  एक ( 
  पाठ-सजावट: कोई नहीं; 
  ; रंग: # 333333; 
  % normal  Arial, Helvetica, sans-serif फ़ॉन्ट: 82. 5% सामान्य Arial, Helvetica, बिना सेरिफ़ 
  ) 
  एक: हॉवर ( 
  ; रंग: # FF0000; 
  ) 
  img ( 
  सीमा: 0; 
  ) 
  h1 ( 
  ; रंग: # bbb; 
   Arial, Helvetica, sans-serif ; फ़ॉन्ट: 195% बोल्ड Arial, Helvetica, बिना सेरिफ़; 
  लाइन-ऊँचाई: 100%; 
  ) 


  . गैलरी ( 
  चौड़ाई: 600px; 
  ; मार्जिन: 0 ऑटो;  
  ) 
   ul p { . गैलरी उल,. गैलरी उल पी ( 
  मार्जिन: 0; 
  padding: 0; 
  सूची शैली-प्रकार: कोई नहीं; 
  ) 
  . गैलरी उल ली ( 
  प्रदर्शन: इनलाइन; 
  )  
  . गैलरी उल ली एक ( 
  प्रदर्शन: ब्लॉक; 
  मार्जिन: 5px; 
  फ्लोट: छोड़ा; 
  padding: 5px; 
  चौड़ाई: 150px; 
  #ccc ; border: 1px solid # ccc; 
  ) 
  . गैलरी उल पी ( 
  text-align: केंद्र; 
  2px 0 ; padding: 2px 0 2px 0; 
  ) 

आखिर हम कर रहे हैं. हम शीर्षक के साथ एक छवि गैलरी बनाया है. सीएसएस-छवि-गैलरी के साथ शीर्षक

के तहत दायर: व्यवस्थापक द्वारा सीएसएस, Tutorials, वेब विकास