首页 > 解决方案 > 从数据库加载颜色并在背景中列出颜色

问题描述

enter @foreach ($colors as $color)
                                    <tr>
                                        <th scope="row">{{ $color->code }}</th>
                                        <td>{{ $color->name }}</td>
                                        <td> 
                                        <div class="col-md-6 cor"></div>
                                        <style>
                                        .cor {
                                            background-color: {{ $color->code }};
                                              }
                                        </style>
                                        </td>
                                        <td><span class="badge badge-success">Active</span></td>
                                        <td>
                                            <a href="{{ URL::route('edit.customer', array('customer'=>$color->id_color)) }}" class="text-success mr-2">
                                            <button class="nav-icon i-Pen-2 font-weight-bold btn btn-warning m-0" type="button" data-toggle="tooltip" data-placement="top" title="Editar Cliente"></button>
                                            </a>
                                            <a href="{{ URL::route('delete.customer', array('customer'=>$color->id_color)) }}" class="text-danger mr-2">
                                            <button class="nav-icon i-Close-Window  font-weight-bold btn btn-danger m-0" type="button" data-toggle="tooltip" data-placement="top" title="Eliminar Cliente"></button>
                                                
                                            </a>
                                        </td>
                                    </tr>
                                    @endforeach here

我想从数据库中加载颜色代码,我希望记录的颜色出现在用户面前,这个 foreach 加载了我最后的颜色

标签: phphtmlcsslaravelbootstrap-4

解决方案


您正在生成 CSS 规则

.cor {
  background-color: {{ $color->code }};
}

多次,但每次使用不同的颜色。所以无论最后一个定义是什么,它都会覆盖所有以前的版本。想一想——如果你多次声明同名的东西,你希望浏览器如何区分它们或者知道哪个元素应用于哪个元素?它不能那样做。它只能使用一个版本,因此它只使用您创建的最后一个版本。

由于每个 div 副本的颜色都是唯一的,所以最好只写

<div class="col-md-6" style="background-color: {{ $color->code }}"></div> 

反而。


推荐阅读