Question

我在为某些元素设置正确的字体颜色时遇到一些困难，因为我使用不同的图像作为背景。例如，我只使用白色，但是当文本区域中的背景颜色较浅时，文本就变得不可读了。

有没有这样做？我用谷歌搜索并找到了许多解决方案，但它们是用于背景颜色而不是图像。我还发现最好使用serveride ex：php语言而不是客户端ex：javascript。

如果有人有任何想法，或至少有一些帮助页面的链接，我将不胜感激。感谢。

Answer 1

可能会在图片上创建一个表格。这样，您可以使用对比色控制文本区域，并可以将字体更改为您喜欢的任何字体。背景中的图像可以保留为您喜欢的任何内容，我假设图像位于页面正文中。无论如何，这是我能想到的，我希望它有所帮助。我知道设置颜色和图像总是很费时间。

<table border="0" bgcolor="#00FF00">
  <tr>
    <th>day</th>
    <th>Saving</th>
  </tr>
  <tr>
    <td>January</td>
    <td>something</td>
  </tr>
</table>

Answer 2

我建议使用css类来指定背景图像和字体颜色......这样你可以指定字体颜色作为背景的函数。

.notification {
    background-color: #0000ff; // bright blue
    background-image: url('/path/to/texture.png');
    color: "white";
}

.article {
    background-color: #ffff00; // yellow;
    background-image: url('/path/to/texture.png');
    color: black;
}

然后当您在文档中右键时，您将按角色执行此操作，这假定您的窗口小部件的type属性是此示例的通知或文章。

foreach($widgets as $widget){
?>
  <div class='<?= $widget->type; ?>'>
  <?= $widget->content; ?>
  </div>
<?php
}

根据背景图像主导颜色更改字体颜色（在文本区域中）

2 个答案: