Tạo các phần tử biểu mẫu thông thường với jQueryUI

Tôi đang sử dụng jQueryUI trên trang web của mình, cũng như http://www.filamentgroup.com/lab/jquery_ui_selectmenu_an_aria_accessible_plugin_for_styling_a_html_select/ làm thay thế cho các phần tử được chọn.Tạo các phần tử biểu mẫu thông thường với jQueryUI

Nhưng tôi gặp sự cố khi tạo kiểu cho các phần tử, văn bản và vùng văn bản khác.

Có ai biết cách làm đúng cách không?

Nguồn

2009-12-12 umpirsky

Đây là biểu mẫu css của tôi. Tôi nhận được thông tin này từ trình tạo biểu mẫu trực tuyến. Nhưng tôi không thể tìm thấy URL cho trang web ngay bây giờ.

/**** Đầu vào và Nhãn ****/

label.description 
{ 
    border:none; 
    color:#222; 
    display:block; 
    font-size:95%; 
    font-weight:700; 
    line-height:150%; 
    padding:0 0 1px; 
} 

span.symbol 
{ 
    font-size:115%; 
    line-height:130%; 
} 

input.text 
{ 
    background:#fff url(../../../images/shadow.gif) repeat-x top; 
    border-bottom:1px solid #ddd; 
    border-left:1px solid #c3c3c3; 
    border-right:1px solid #c3c3c3; 
    border-top:1px solid #7c7c7c; 
    color:#333; 
    font-size:100%; 
    margin:0; 
    padding:2px 0; 
} 

input.file 
{ 
    color:#333; 
    font-size:100%; 
    margin:0; 
    padding:2px 0; 
} 

textarea.textarea 
{ 
    background:#fff url(../../../images/shadow.gif) repeat-x top; 
    border-bottom:1px solid #ddd; 
    border-left:1px solid #c3c3c3; 
    border-right:1px solid #c3c3c3; 
    border-top:1px solid #7c7c7c; 
    color:#333; 
    font-family:"Lucida Grande", Tahoma, Arial, Verdana, sans-serif; 
    font-size:100%; 
    margin:0; 
    width:99%; 
} 

select.select 
{ 
    color:#333; 
    font-size:100%; 
    margin:1px 0; 
    padding:1px 0 0; 
    background:#fff url(../../../images/shadow.gif) repeat-x top; 
    border-bottom:1px solid #ddd; 
    border-left:1px solid #c3c3c3; 
    border-right:1px solid #c3c3c3; 
    border-top:1px solid #7c7c7c; 
} 


input.currency 
{ 
    text-align:right; 
} 

input.checkbox 
{ 
    display:block; 
    height:13px; 
    line-height:1.4em; 
    margin:6px 0 0 3px; 
    width:13px; 
} 

input.radio 
{ 
    display:block; 
    height:13px; 
    line-height:1.4em; 
    margin:6px 0 0 3px; 
    width:13px; 
} 


label.choice 
{ 
    color:#444; 
    display:block; 
    font-size:100%; 
    line-height:1.4em; 
    margin:-1.55em 0 0 25px; 
    padding:4px 0 5px; 
    width:90%; 
}

Cập nhật

Và một số CSS hơn

input[type="text"], textarea, input[type="password"] { 
    background:#fff url(../img/shadow.gif) repeat-x scroll center top; 
    border: solid 1px; 
    border-color:#7c7c7C#c3c3c3 #ddd; 
    color:#333; 
    margin:0; 
    padding:2px 0; 
} 
textarea { 
    overflow: auto; 
} 

input[type="submit"], input[type="button"], input[type="reset"], input[type="file"] 
{ 
    cursor:pointer; 
    padding:0 3px 2px 3px; 
    text-align: center; 
    vertical-align: bottom; 
    height:20px;  
    /*background: transparent url('../img/button_bg1.png') repeat-x;*/ 
    color: #444; 
    font-size: 12px; 
    border-top: 1px solid #ccc; 
    border-left: 1px solid #ccc; 
    border-right: 1px solid #999; 
    border-bottom: 1px solid #999; 
    border-radius: 5px;    /* CSS3 rounded corners */ 
    -moz-border-radius: 5px;  /* Rounded corners for Firefox */ 
    -webkit-border-radius: 5px;  /* Rounded corners for Safari */ 
    width/*IE*/: auto; 
} 

input[type="button"] { 
    position: relative; 
    top: -1px; 
}

Nguồn

2009-12-12 20:50:12 Steven