在我的数据库中我有数字1
, 2
, 2.5
, 3
, 3.5
, 4
,4.5
和5
我想将这些数字转换为星星。
我有一颗满星和一颗半星。
从数据库中获取信息后我怎么能做到这一点?
我在数据库上有评级标签。
在我的数据库中我有数字1
, 2
, 2.5
, 3
, 3.5
, 4
,4.5
和5
我想将这些数字转换为星星。
我有一颗满星和一颗半星。
从数据库中获取信息后我怎么能做到这一点?
我在数据库上有评级标签。
<?php
for($x=1;$x<=$starNumber;$x++) {
echo '<img src="path/to/star.png" />';
}
if (strpos($starNumber,'.')) {
echo '<img src="path/to/half/star.png" />';
$x++;
}
while ($x<=5) {
echo '<img src="path/to/blank/star.png" />';
$x++;
}
?>
*假设您使用的是 PHP
当我过去这样做时,我在一张 5 颗实心星星的图像下方使用了一张 5 颗空星星的图像。然后我做了类似的事情
filled-stars.width = (empty-stars.width * (rating / 5)
这样您就可以显示诸如 3.2978 等的评级。
你可以用 PHP、HTML 和 CSS 做到这一点:
<div class="star-<?=$number?>">
<b></b><b></b><b></b><b></b><b></b>
</div>
然后,您可以使用 CSS 设置样式,以便根据星星显示背景图像。如果您将<b>
标签转换为标签,<a>
它可能更具语义。
考虑使用精灵。从包含每个可能评分的一排星的图形开始,然后通过将每个半星图形的高度乘以评分中的半星数来计算背景偏移。
例如:
<?php
$offset =
($rating / .5) // number of half-stars in $rating
* 15; // height of each sprite in stars.png
?>
<div style="background-image:url("stars.png");background-position:0 <?php echo $offset; ?>px;"></div>
结合一点 Javascript,您可以实现一个功能齐全的评级小部件。
echo '*';
在这里,如果需要,这将添加星号和半号echo '+';
更改'*'
,'+'
例如更改为<img src="star.gif" />
和<img src="halfstar.gif" />
// This number of stars:
$number = 2.7;
// Make it integer:
$stars = round( $number * 2, 0, PHP_ROUND_HALF_UP);
// Add full stars:
$i = 1;
while ($i <= $stars - 1) {
echo '*';
$i += 2;
}
// Add half star if needed:
if ( $stars & 1 ) echo '+';