どのように私の手紙を隠す柔らかい終わりのように作ることができますか？私は私の手紙を隠しソフトエンドのように作ることができますどのように

Question

（「D」は、それが切り捨てのようなものだ。私は勾配と同じようにそれをしたい）

Thxを：D

EDIT：

HTML：

<form action="" method="GET" class="buscar_form"> 
    <input type="text" name="buscar" id="buscar_form_input_text"> 
</form> 

Answer 1

.test { 
 
    background-color: rgb(102, 51, 153); 
 
    padding: 20px; 
 
    font-size: 2em; 
 
    color: white; 
 
    font-family: sans-serif; 
 
    position: relative; 
 
} 
 

 

 

 
.test:after { 
 
    content: ''; 
 
    position: absolute; 
 
    top: 0; 
 
    bottom: 0; 
 
    left: 0; 
 
    background-image: linear-gradient(90deg , rgb(102, 51, 153) 20px, rgba(102, 51, 153, 0)); 
 
    width: 10%; 
 
}

<div class='test'> lorem ipsum </div>