2014-01-06 2 views
0

항상 tblData라고 불리는 페이지 전체에 걸쳐 테이블 세트가 있습니다. 예를 들어 테이블 안의 elemenets에 대한 CSS 속성을 설정할 수 있기를 바랍니다. 그래서에만이를 추가 할 필요가 레이블, 열 스타일, 순간 등 텍스트다른 객체의 일부분에 CSS를 어떻게 추가합니까?

나는이

#tblData{ 
style...} 

.dataColumn{ 
style...} 

처럼 일을 오전하지만 난 tblData 클래스로 어떻게 든 그들을 통합하고 싶습니다 한 클래스는 레이아웃을 완료합니다. 이 때문에 (완료되지 참고이 테이블의 예입니다

.tblData { 
    border: solid; 
    border-width: 1px; 
    height: 200px; 
    color: rgb(45,40,128); 
    background-color: white; 
    width: 100%; 
    border-radius:3px; 
    margin-top:3px; 

} 
/*Class for the labels*/ 
.tblData label { 
    width: 13%; 
    color:black; 
    border-radius:3px; 
    font-family:verdana; 
    border-radius:3px; 
    border-color:rgba(45,40,128,0.75); 
    border-width:1px; 

} 
/*Class for the data textboxes*/ 
.tblData textbox { 
    border-color: rgba(45,40,128,0.75); 
    border-width: 1px; 
    background-color:rgba(45,40,128,0.10); 
    font-family:Verdana; 
    border-radius:3px; 
} 

:

은 이미 시도하고 작동하지 않는 텍스트 상자와 레이블하지만, 레이블 및 텍스트 상자 요소의 스타일을 설정해야 할 것입니다 당신은 단지 테이블 자체에 적용되는 클래스를 원하는 경우

<table id="ContactsTable" class="tblData"> 
     <tr> 
      <td class="auto-style1"> 
       <asp:Label ID="lblContact" runat="server" Text="Contact" CssClass="Datalabelcolumn"></asp:Label></td> 
      <td> 
       <asp:TextBox ID="TextBox1" runat="server" CssClass="Datatextbox" Width="200px"></asp:TextBox> 
      </td> 
      <td></td> 
      <td></td> 
      <td></td> 

답변

1

, 당신은 그것의 행이나 열로 테이블 자체의 특정 요소를 분리하기 위해 특정 CSS 선택기를 추가 할 수 있습니다) 너무 큰는 예 :

위의 내용은 기본적으로 id가 tblData 인 요소를 가져 와서 다음 선택기에 맞는 하위 요소를 선택합니다. 자세한 내용은 W3 selector documentation을 살펴볼 필요가 있습니다.

일부 선택자가있는 FIDDLE입니다.

+0

테이블 내에서 텍스트 상자 또는 레이블에 대해 동일한 작업을 수행 할 수 있습니까? – connersz

+0

@connersz 물론, 예를 들어 '#tblData label {}'또는'#tblData input [type = text] {}' – SW4

+0

이 작업을 시도했지만 작동하지 않습니다. asp.net 컨트롤을 사용할 수 있습니까? – connersz

관련 문제