我遇到了一个看似简单但令人沮丧的问题。 我被要求编辑一个模板以满足新的需求。旧模板有一个渐变作为背景，新模板希望这个渐变扩大一点。下面列出了当前和期望的结果。
缺点(这是令人烦恼的部分)是模板是由表格构建的。我无法粘贴一小部分代码，因此这里是包含侧边栏的表格。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
编辑: 重新上传屏幕截图以进一步解释我的问题。
编辑2: 删除了 jsfiddle 页面的代码。请记住，这是该页面的所有代码，因此我的问题不需要很多代码。为网站添加了一些代码以允许 jsfiddle 链接。
最佳答案
Demo Fiddle
添加类(您可能需要调整 350px 部分):
#templateBody > tbody > tr > td{
background-image: -webkit-gradient(linear, right bottom, left top, color-stop(0.65, #FFFFFF), color-stop(0.77, #EFEFEF));
background-image: -o-linear-gradient(left top, #FFFFFF 65%, #EFEFEF 77%);
background-image: -moz-linear-gradient(left top, #FFFFFF 65%, #EFEFEF 77%);
background-image: -webkit-linear-gradient(left top, #FFFFFF 65%, #EFEFEF 77%);
background-image: -ms-linear-gradient(left top, #FFFFFF 65%, #EFEFEF 77%);
background-image: linear-gradient(to left top, #FFFFFF 65%, #EFEFEF 77%);
background-repeat:repeat-y;
background-position:350px 0;
}
并删除:
background-image: -o-linear-gradient(left top, #FFFFFF 65%, #EFEFEF 77%);
background-image: -moz-linear-gradient(left top, #FFFFFF 65%, #EFEFEF 77%);
background-image: -webkit-linear-gradient(left top, #FFFFFF 65%, #EFEFEF 77%);
background-image: -ms-linear-gradient(left top, #FFFFFF 65%, #EFEFEF 77%);
background-image: linear-gradient(to left top, #FFFFFF 65%, #EFEFEF 77%);
来自类.sidebarContent
关于html - 将渐变过度延伸到 <table> 之外，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/22983634/