gpt4 book ai didi

html - 使用自定义 css 修改 ng-grid 复选框,修改空间

转载 作者:行者123 更新时间:2023-11-28 09:57:49 25 4
gpt4 key购买 nike

我不擅长 CSS,到目前为止运气不好。由于某些原因,CSS 样式不适用于 .ngSelectionCheckbox.ngSelectionHeader

我正在尝试使用来自 csscheckbox.com 的 CSS,将类名从自述文件更改为我的,但没有成功。

这是我当前的表: enter image description here

这就是我需要的样子: enter image description here

此外,我不知道如何将行的底部向上推,并将复选框与数字适当对齐。

非常感谢您的帮助。

最佳答案

好吧,虽然我不会为你设计整个东西的样式,但选中框的功能就像这样

HTML:

<body ng-app="TestApp">
<div ng-controller="TestController">
<table>
<tr>
<th></th>
<th>CPT CODE/Service Provider;</th>
<th>Average Cost</th>
<th>Offered Price</th>
</tr>
<tr ng-repeat="row in data" ng-class="{'selected': row$index}">
<td><input type="checkbox" ng-model="row$index" /></td>
<td>{{row.code}}</td>
<td>{{row.cost}}</td>
<td>{{row.price}}</td>
</tr>
</table>
</div>
</body>

CSS:

.selected {
background-color:#ff00ff;
}

Controller :

var app = angular.module("TestApp",[]);

app.controller("TestController", function($scope)
{
$scope.data = [
{
"code":"a",
"cost": 11,
"price": 10
},
{
"code":"b",
"cost": 21,
"price": 20
},
{
"code":"c",
"cost": 31,
"price": 30
}
];
});

fiddle :http://jsfiddle.net/25NVD/

它的要点是,使用 ng-repeat 来创建行,使用 ng-class 来分配 'selected' class when row$index 被选中。 $index 是由 ng-repeat 创建的计数,我用它来制作一个独特的模型。

关于html - 使用自定义 css 修改 ng-grid 复选框,修改空间,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24834326/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com