Django
1221 浏览 5 years, 9 months
9.1 class media
版权声明: 转载请注明出处 http://www.codingsoho.com/列表
指定后台的css样式文件
class Media:
css = {
"all": ("css/model_admin.css","css/equipment.css")
}
js = ("js/jquery.min.js","js/model_admin.js",)
常见样式
表格的换行
/* wrap set */
#changelist table thead th {
word-wrap: break-word; /* 在长单词或 URL 地址内部进行换行。*/
word-break: break-all; /* 允许在单词内换行。*/
white-space: normal; /* 默认。空白会被浏览器忽略。*/
/*overflow: auto;*/ /* hidden */
text-align: center;
}
#changelist table tbody td,
#changelist table tbody th {
word-wrap: break-word;
word-break: break-all;
white-space: normal;
/*overflow: auto;*/ /*hidden*/
}
#changelist table tbody th {
white-space: normal;
}
内联widget设置
内容显示的缩进及其他样式
#changelist table tbody th{
text-align: left;
text-indent:10px; /* 内容缩进,避免顶着边框 */
}
#changelist table tbody td {
/*border-bottom: 1px solid #CCCCCC;*/
border-bottom: none;
padding:0px;
vertical-align: middle;
text-align: center;
}
输入框
#changelist table tbody .row1 td input, .row1 td select{
/*background-color: #EDF3FE;*/
}
/* 设置输入框背景色与背景匹配 */
#changelist table tbody tr.selected td input,
#changelist table tbody tr.selected td select{
background-color: #FFFFCC!important;
}
/* 让输入框内容撑满整个表格单元 */
#changelist table tbody td input, td select{
padding:0px!important;
margin:0px!important;
}
#changelist table tbody td input[type=text],
#changelist table tbody td input[type=number],
td select{
border-radius: 3px;
width:100%;
height: 30px;
/*border: 2px solid #ccc;*/
border: none;
text-indent:2px;
text-align: center;
}
#changelist input[type=checkbox]{
/*padding:5px 0px 0px 0px!important;*/
}
#changelist textarea.vLargeTextField{
max-height: 50px;
/*max-width: 200px;*/
width:95%;
padding:0px;
margin:0px;
text-indent:5px;
}
日期
#changelist table tbody td input.vDateField{
width:auto;
}
表单
body.change-form .submit-row{
clear:both; /* incase only one fieldset and no tables */
}
body.change-form table textarea.vLargeTextField{
max-height: 50px;
max-width: 200px;
}
body.change-form table input.vTextField{
max-width: 100px;
}
body.change-form table select{
min-width: 50px;
}