how to use css in the ext.net

  1. #1

    how to use css in the ext.net

    Click image for larger version. 

Name:	2.jpg 
Views:	15 
Size:	16.6 KB 
ID:	6801Click image for larger version. 

Name:	1.jpg 
Views:	17 
Size:	14.5 KB 
ID:	6802

    how to use css in the ext.net
    now, this is my code
    <style type="text/css">
    body
    {
    background-image: url(images/OA.jpg);
    background-size: cover;
    }
    #context
    {
    margin-left: auto;
    margin-right: auto;
    width: 481px;
    height: 201px;
    background: url(images/CD1_01.png);
    margin-top: 200px;
    padding-top: 120px;
    }
    #field
    {
    float: left;
    width: 304px;
    }
    
    
    #txtUsername
    {
    margin:18px,14px,0,54px;
    float:left;
    }
    
    #opt
    {
    width: 196px;
    height: 36px;
    float: left;
    margin-top: 18px;
    }
    #id1
    {
    margin: 18px 14px 0 54px;
    float: left;
    }
    #id2
    {
    margin: 18px 20px 0 60px;
    float: left;
    }
    #id3
    {
    margin: 18px 15px 0 57px;
    float: left;
    }
    #login
    {
    margin: 18px auto auto 22px;
    float: left;
    }
    
    </style>
    </head>
    <body>
    <form id="form1" runat="server">
    <ext:ResourceManager runat="server" />
    <div id="context">
    <div id="field">
    <ext:Image runat="server" ImageUrl="images/ICO_01.png" ID="id1" Width="31" Height="31" />
    <ext:TextField ID="txtUsername" runat="server" Text="请输入用户名" Width="196" Height="36" />
    <ext:Image runat="server" ImageUrl="images/ICO_04.png" ID="id2" Width="19" Height="29" />
    <ext:TextField ID="txtPassword" runat="server" Text="请输入密码" Width="196" Height="36" />
    <ext:Image ImageUrl="images/ICO_07.png" runat="server" Width="25" Height="25" ID="id3" />
    
    <div id="opt">
    <ext:Store ID="Store1" runat="server">
    <Reader>
    <ext:ArrayReader>
    <Fields>
    <ext:RecordField Name="state" />
    </Fields>
    </ext:ArrayReader>
    </Reader>
    </ext:Store>
    <ext:ComboBox runat="server" ID="ComboBox1" StoreID="Store1" DisplayField="state" Width="196" Height="36"/>
    </div>
    
    </div>
    Last edited by geoffrey.mcgill; Aug 26, 2013 at 4:49 AM. Reason: Please use [CODE] tags
  2. #2
    You should be able to place the controls into DIV's like normal and apply your css to the div's. Any other styles can be assigned to the ext controls using the Cls property or stylespec property.

Posting Permissions