$in_str = 'files/test/Test! symbol # and % and & and (=-,.).pdf';
$out_str = implode('/', array_map('rawurlencode', explode('/', $in_str)));
file_put_contents('test_url.txt', $out_str);
// test_url.txt
// files/test/Test%21%20symbol%20%23%20and%20%25%20and%20%26%20and%20%28%3D-%2C.%29.pdf
document.getElementById('tg').addEventListener('submit',function(e){
<button type="submit">Отправить</button>
<a href="#" class="menu__item menu__item--sport"><span>Зимний спорт</span></a>
.menu__item
{
text-decoration: none;
}
.menu__item > span
{
text-decoration: underline;
}
.menu__item:after
{
position: unset;
content: '▪';
margin-left: 5px;
}
<form action="/index.php" method="POST" >
<input name='pers_delete' type='hidden' value="сюда подставляете значение переменной"/>
<input name='submit' type='submit' value="1" class='del_pers'/>
</form>
<?php
if (isset($_POST['submit']))
{
echo $_POST['pers_delete'];
}
?>
<div class="photo__container">
<img src="photo.jpg"/>
<div class="photo__descr">
<p>Описание для фото</p>
</div>
</div>
div.photo__descr
{
position: absolute;
}
div.photo__container
{
position: relative;
}
div.photo__descr
{
position: absolute;
bottom: 0;
}
div.photo__descr
{
position: absolute;
bottom: 0;
max-height: 30%;
overflow-y: auto; /* можно еще добавить возможность прокручивать содержимое при вертикальном переполнении */
}
div.photo__container
{
position: relative;
height: 600px;
}
.table tr:last-child td
{
padding: 5px 0;
}
<div class="подложка">
<div class="элемент-подложки" style="background-color: transparent; transform: translate(0, -30px)">
</div>
</div>
document.body.style.transform = 'scale(' + ваше_значение + ')';
inputs[i].setAttribute('type', 'text');
background: radial-gradient(rgba(0, 0, 0, 0.01), rgba(0, 0, 0, 1)); /* второй параметр цвета нужно подобрать близкий к фоновому */
$('.image-upload:nth-child(' + номер_интупа_начиная_с_единицы + ')').val('');
$('.image-upload')[номер_интупа_начиная_с_нуля].val('');
onclick="window.location.reload(); return false;"
<style>
div.container
{
display: flex;
flex-wrap: wrap;
width: 770px;
height: 90px;
background-color: green;
overflow: hidden;
}
div.container > div
{
width: 60px;
height: 25px;
background-color: #df1245;
text-align: center;
margin: 5px;
padding: 5px 0;
}
div.container > div:nth-child(n + 22) /*этим селекторам задаем свойство сортировки элементам, которые идут после кнопки "показать еще" если контейнер будет адаптивным, придется прописывать кучу вариантов nth-child */
{
order: 2;
}
div.container > label.more
{
display: block;
width: 130px;
height: 25px;
margin: 5px;
padding: 5px 0;
text-align: center;
order: 1; /* У кнопки стоит такой индекс сортировки чтобы оказаться между видимыми и невидимыми элементами */
background-color: #78d412;
}
div.container label.more span.less
{
display: none;
}
#show-more-state
{
display: none;
}
#show-more-state:checked ~ div.container
{
height: auto;
}
#show-more-state:checked ~ div.container label.more
{
order: 3;
margin-left: auto;
}
#show-more-state:checked ~ div.container label.more span.more
{
display: none;
}
#show-more-state:checked ~ div.container label.more span.less
{
display: initial;
}
</style>
<input id="show-more-state" type="checkbox"/> <!-- Этим чекбоксом запонимаем состояние кнопки, чтобы можно было оттолкнуться стилями от превдокласса :checked -->
<div class="container">
<label class="more" for="show-more-state"><span class="more">ПОКАЗАТЬ ЕЩЕ</span><span class="less">СВЕРНУТЬ</span></label>
<div>ITEM</div>
<div>ITEM</div>
<div>ITEM</div>
<div>ITEM</div>
<div>ITEM</div>
<div>ITEM</div>
<div>ITEM</div>
<div>ITEM</div>
<div>ITEM</div>
<div>ITEM</div>
<div>ITEM</div>
<div>ITEM</div>
<div>ITEM</div>
<div>ITEM</div>
<div>ITEM</div>
<div>ITEM</div>
<div>ITEM</div>
<div>ITEM</div>
<div>ITEM</div>
<div>ITEM</div>
<div>ITEM</div>
<div>ITEM</div>
<div>ITEM</div>
<div>ITEM</div>
<div>ITEM</div>
<div>ITEM</div>
<div>ITEM</div>
</div>