首页 > 代码库 > EasyUI 中当内容多时,出现行距不等,解决方案!!!
EasyUI 中当内容多时,出现行距不等,解决方案!!!
<script type="text/javascript"
src="http://www.mamicode.com/html/system/xxx/xxx.js"></script>
<div class="bye404-tab">
<div class="easyui-panel bye404-toolbar">
<a class="easyui-linkbutton"
data-options="plain:true,iconCls:‘icon-add‘"
onclick="HeadlineClass.add()">新增</a> <a class="easyui-linkbutton"
data-options="plain:true,iconCls:‘icon-edit‘,disabled:true,exActive:‘1‘"
onclick="HeadlineClass.edit()">编辑</a> <a class="easyui-linkbutton"
data-options="plain:true,iconCls:‘icon-remove‘,disabled:true,exActive:‘n‘"
onclick="HeadlineClass.remove()">移除</a>
</div>
<table id="headline-grid" class="easyui-datagrid" data-options="url:‘homePage/Headline/后台地址‘" >
<thead >
<tr style="height:45px">
<th width="10%" data-options="field:‘id‘">编号</th>
<th width="20%" data-options="field:‘name‘">头条名称</th>
<th width="30%" data-options="field:‘url‘">路径</th>
<th width="70%" data-options="field:‘content‘">内容</th>
</tr>
</thead>
</table>
<!-- 添加框 -->
<div id="headline-dialog" class="easyui-dialog" style="width:1200px;height:600px;" data-options="closed:‘true‘">
<form id="headline-form" class="bye404-dialog-form">
<input type="hidden" name="id" value="" />
<table>
<tr>
<th>头条名称:</th>
<td><input name="name" id="name" class="easyui-validatebox"></td>
</tr>
<tr>
<th>url:</th>
<td><input name="url" id="url" class="easyui-validatebox"></td>
</tr>
<tr >
<th>内容:</th>
<td>
<!-- 使用百度编译器 ueditor -->
<textarea name="content" id="content"></textarea>
</td>
</tr>
</table>
</form>
<div id="bye404-dialog-buttons">
<a class="easyui-linkbutton" data-options="iconCls:‘icon-ok‘"
onclick="HeadlineClass.save()">提交</a> <a class="easyui-linkbutton"
data-options="iconCls:‘icon-cancel‘"
onclick="$(‘#headline-dialog‘).dialog(‘close‘)">取消</a>
</div>
</div>
</div>
<div id=‘loadingDiv‘
style=‘position: absolute; z-index: 1000; top: 0px; left: 0px; width: 100%; height: 100%; background: white; text-align: center;‘>
<h1 style=‘top: 48%; position: relative;‘>
<font color=‘#15428B‘>努力加载中···</font>
</h1>
</div>
加入以下代码,则不会出现行宽不齐的问题。。。
<style>
.datagrid-cell datagrid-cell-c1-content
.datagrid-row
{height: 45px;}
.datagrid-row p{
display:inline-block;
}
datagrid-cell{overflow:none;}
</style>
EasyUI 中当内容多时,出现行距不等,解决方案!!!