2011-10-03 8 views
26

मुझे अपने मुद्दे का उत्तर नहीं मिल रहा है। मेरे पास दो पंक्तियों और दो कॉलम वाली एक तालिका है (जैसे नीचे दिखाया गया कोड), मैं विशिष्ट कक्षों में टेक्स्ट को संरेखित कैसे कर सकता हूं। मैं पाठ को एक या दो कोशिकाओं में संरेखित करना चाहता हूं - सभी कोशिकाओं नहीं।टेबल सेल में केंद्र टेक्स्ट

<div style="text-align: center;"> 
    <table style="margin: 0px auto;" border="0"> 
     <tbody> 
      <tr> 
       <td>Cell 1</td> 
       <td>Cell 2</td> 
      </tr> 
      <tr> 
       <td>Cell 3</td> 
       <td>Cell 4</td> 
      </tr> 
     </tbody> 
    </table> 
</div> 

उत्तर

41

मैं इसके लिए सीएसएस का उपयोग करने की सलाह दूंगा। आप केंद्रित लागू करने के लिए, उदाहरण के लिए एक सीएसएस नियम बनाने चाहिए:

.ui-helper-center { 
    text-align: center; 
} 

और फिर तालिका सेल जिसके लिए आप संरेखण को नियंत्रित करना चाहते करने के लिए ui-helper-center वर्ग जोड़ें:

<td class="ui-helper-center">Content</td> 

संपादित करें: चूंकि यह उत्तर स्वीकार कर लिया गया था, इसलिए मुझे उन हिस्सों को संपादित करने के लिए बाध्य होना पड़ा जो टिप्पणियों में लौ-युद्ध का कारण बनते थे, और गरीब और पुरानी प्रथाओं को बढ़ावा नहीं देते थे।

अपने पृष्ठ में सीएसएस नियम को शामिल करने के लिए Gabe's answer देखें।

+5

सीएसएस 1 लगभग 15 साल पहले एक सिफारिश बन गया। संरेखण विशेषता का प्रयोग न करें। – Quentin

+0

@ क्वांटिन - "संरेखण 'का उपयोग न करें" के बारे में सहमत हैं। लेकिन कॉरी लार्सन ने खुद को "संरेखण = केंद्र" के बराबर सीएसएस की सिफारिश की। मुझे उम्मीद है कि आप उसे नीचे चिह्नित नहीं करेंगे (और यदि आपने किया है, तो कृपया इसे बदलने पर विचार करें। ठीक है?) – paulsm4

+0

@ paulsm4 - मैंने नहीं किया, और जब मैंने टिप्पणी की तो उसने नहीं किया। – Quentin

6

कैसे के बारे में बस (, कृपया ध्यान दें वर्ग इस नाम के लिए एक बेहतर नाम के साथ आने के लिए बस एक उदाहरण है):

.centerText{ 
    text-align: center; 
} 


<div> 
    <table style="width:100%"> 
    <tbody> 
    <tr> 
     <td class="centerText">Cell 1</td> 
     <td>Cell 2</td> 
    </tr> 
    <tr> 
     <td class="centerText">Cell 3</td> 
     <td>Cell 4</td> 
    </tr> 
    </tbody> 
    </table> 
</div> 

उदाहरण here

आप css में जगह कर सकते हैं एक अलग फ़ाइल, जो अनुशंसित है। मेरे उदाहरण में, मैंने styles.css नामक एक फ़ाइल बनाई और इसमें css नियम दिए। फिर <head> अनुभाग में HTML दस्तावेज़ में शामिल इस प्रकार है:

<head> 
    <link href="styles.css" rel="stylesheet" type="text/css"> 
</head> 

विकल्प, एक अलग सीएसएस फ़ाइल बनाने नहीं, बिल्कुल की सलाह नहीं दी ... HTML दस्तावेज़ में अपने <head> में <style> ब्लॉक बनाएं । फिर बस अपने नियमों को वहाँ रखें।

<head> 
<style type="text/css"> 
    .centerText{ 
     text-align: center; 
    } 
</style> 
</head>