Быстрый вопрос здесь, css3 gradient не помогает в моем требовании. Мне нужно выделить td с двумя цветами, левую половину с одним цветом и правую половину с другим цветом.TD-фон с двумя цветами
Вывод должен быть:
Как я могу добиться этого?
Вам это нужно. Я не знаю, правильно это или нет?
<!DOCTYPE html>
<html>
<head>
<style>
table td {
border: 1px solid black;
background: linear-gradient(to right, #ff9e2c 0%, #ff9e2c 50%, #FF0000 50%, #FF0000 100%);
}
</style>
</head>
<body>
<table>
<tr>
<th>Month</th>
<th>Savings</th>
</tr>
<tr>
<td>January</td>
<td>$100</td>
</tr>
<tr>
<td>Feb</td>
<td>$1000</td>
</tr>
<tr>
<td>March</td>
<td>$10</td>
</tr>
<tr>
<td>April</td>
<td>$110</td>
</tr>
</table>
</body>
</html>
https://jsfiddle.net/17d80ym3/10/ – SMS
попробуйте это, он будет работать 100%;
HTML:
<table >
<tr><td>welcome</td><td>welcome</td></tr>
</table>
css
table
{
margin:0px;
padding:0px;
width:400px;
border:1px solid #000;
}
table tr td
{
width:200px;
background:linear-gradient(to right, red 50%, blue 50%);
background-position:top left;
text-align:center;
background-size: 100% 100%;
color:#fff;
}
попробуйте эту ссылку https://jsfiddle.net/mhrjnsa1/17d80ym3/3/ @ Akki619 – Maharajan
div {
background: rgb(91, 155, 213);
background: linear-gradient(to right, rgba(91,155,213,1) 0%,rgba(91,155,213,1) 50%,rgba(158,191,229,1) 50%,rgba(158,191,229,1) 100%);
width:100px;
height:50px;
}<div></div>
Почему градиент не помогает? Можете ли вы показать изображение своего ожидаемого результата? – Harry
Действительно ли это 'td'? Это должно быть внутри «таблицы» и т. Д. – JackHasaKeyboard
Совершенно возможно добиться того, что вам нужно с помощью градиентов. Можете ли вы включить код градиента, который вы пробовали? – Harry