<!DOCTYPE html> <html> <head> <title>Title</title> </head> <style> header { display: flex; margin-bottom: 10px; background-color: #fff287; } nav { width: 90%;/* можно поставить 100% или в пикселях например 1280px */ margin: 0 auto; } .spisok { margin: 0; padding: 0; display: flex; list-style-type: none; } .spisok li { padding: 10px; min-width: 80px; text-align: center; } .spisok li:hover:not(.push) { cursor: pointer; background-color: #8bf3b6; } li.push { flex-grow:1; } li.push2 { padding-left: 32px; flex-grow:1; text-align: left; } </style> <body> <header> <nav> <ul class="spisok"> <li>Home</li> <li>about</li> <li class="push"></li> <li>info</li> </ul> </nav> </header> <hr> <header> <nav> <ul class="spisok"> <li>Home</li> <li class="push2">about</li> <li>info</li> </ul> </nav> </header> </body> </html>
<style>img {display: block;width: 100%;height: 100%;object-fit: cover;}</style><img data-object-fit="cover" src="***">
_SP_, для разбери написано масса библиотек на питон и думать не надо. Получаете данные от датчиков и на самом разбери формируете веб-страницу.
Открыл первое что попалось
как установить и настроить сервер
https://habr.com/ru/post/472126
http://wikihandbk.com/wiki/Raspberry_Pi:Настройка/Настройка_веб-сервера_на_базе_Raspberry_при_помощи_Flask
создание веб-приложений
https://tproger.ru/translations/reactive-web-apps-with-python/
<form method=post action="/forms/registration/oplata.html"> <input type="hidden" name="csrfmiddlewaretoken" value="ErUvsvzWFJKw25y0VUesq4yCJ0eoMi3omJapAFRJrDXoa6NEXVl4eADFXvkvVtuA"> <div class="form-group"> <div class="row"> <div class="col-md-6 col-sm-6"> <label for="surnameCustomer">Фамилия *</label> <input type="text" class="form-control history" name="last_name" id="surnameCustomer" data-id="1" required placeholder="Иванов" value=""> </div> <div class="col-md-6 col-sm-6"> <label for="forenameCustomer">Имя *</label> <input type="text" class="form-control history" name="first_name" id="forenameCustomer" required placeholder="Иван" value="" data-id="2"> </div> </div> </div> <div class="form-group"> <div class="row"> <div class="col-md-6 col-sm-6"> <label for="patronymicCustomer">Отчество </label> <input type="text" class="form-control history" name="middle_name" id="patronymicCustomer" placeholder="Иванович" value="" data-id="3"> </div> <div class="col-md-6 col-sm-6"> <label for="birthdayCustomer">Дата рождения *</label> <input type="tel" class="form-control indent history" name="birthday" data-id="5" id="birthdayCustomer" required placeholder="01.01.1985" data-mask="00.00.0000" value="" autocomplete="off" maxlength="10" start="1581262599357"> </div> </div> </div> <div class="form-group"> <div class="row"> </div> </div> <div class="form-group margin-top-25"> <label> <input type="checkbox" id="checkbox" class="checkbox" name="agreement" value="yes" required> <span class="checkbox-custom"></span> <span class="label">Я согласен с <a target="blank" href="..\..\docs\">публичной офертой</a> и на <a target="blank" href="..\..\docs\pd_agree.pdf">обработку персональных данных</a></span></label> </div> <input type="hidden" name="history_pasted_1" class="history-pasted-1" value="0"> <input type="hidden" name="history_pasted_2" class="history-pasted-2" value="0"> <input type="hidden" name="history_pasted_3" class="history-pasted-3" value="0"> <input type="hidden" name="history_pasted_5" class="history-pasted-5" value="0"> <input type="hidden" name="history_pasted_7" class="history-pasted-7" value="0"> <input type="hidden" name="history_pasted_8" class="history-pasted-8" value="0"> <input type="hidden" name="history_spend_1" class="history-spend-1" value="0"> <input type="hidden" name="history_spend_2" class="history-spend-2" value="0"> <input type="hidden" name="history_spend_3" class="history-spend-3" value="0"> <input type="hidden" name="history_spend_5" class="history-spend-5" value="0"> <input type="hidden" name="history_spend_7" class="history-spend-7" value="0"> <input type="hidden" name="history_spend_8" class="history-spend-8" value="0"> <input type="hidden" name="private_mode" id="pm" value="2"> <div class="col-md-12 col-sm-12 center-block margin-top-15"> <button class="btn link" type="submit"> Проверить </button> </form>
в inputы required поставь
<!DOCTYPE html><html><head> <title>Title</title> <meta name="robots" content="none"/></head><style>xmp { margin: 0; padding: 0; display: inline-block;}</style><body><div id=statya> Если вы прописали мета-тег <xmp><meta name="robots" content="noindex"/></xmp>, то ссылки на странице все будут доступны для поисковых систем и роботы будут переходить по ним. Поэтому необходимо добавить атрибут nofollow, если хотите полностью запретить индексацию страницы. Выглядеть это может следующим образом: <xmp><meta name="robots" content="noindex, nofollow"/> или <meta name="robots" content="none"/></xmp>. <a href=# onclick="Show('#statya')">Продолжение статьи</a><br> <noindex hidden> Не индексируемый текст статьи </noindex></div><script> function Show(id){ let el=document.querySelector(id); el=el.getElementsByTagName('noindex')[0]; el.hidden=el.hidden?false:true; return false; }</script></body></html>
может так
или так
<!DOCTYPE html><html><head> <title>Title</title> <meta name="robots" content="none"/></head><style>xmp { margin: 0; padding: 0; display: inline-block;}</style><body><div id=statya> Если вы прописали мета-тег <xmp><meta name="robots" content="noindex"/></xmp>, то ссылки на странице все будут доступны для поисковых систем и роботы будут переходить по ним. Поэтому необходимо добавить атрибут nofollow, если хотите полностью запретить индексацию страницы. Выглядеть это может следующим образом: <xmp><meta name="robots" content="noindex, nofollow"/> или <meta name="robots" content="none"/></xmp>. <div id=statya-forth><a href=# onclick="Show('#statya-forth')">Продолжение статьи</a></div></div><script> function Show(id){ let el=document.querySelector(id); el.innerHTML='Не индексируемый текст статьи'; return false; }</script></body></html>
<!DOCTYPE html> <html> <head> <title>Title</title> </head> <style> .knopka { top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 300px; height: 100px; text-align: center; position: absolute; background: #98b99852; vertical-align: middle; } .knopka > div { margin: 20px auto; display: inline-block; } </style> <body> <div class="knopka" hidden> <div> Какой-то текст, если нужен<br><br> <!-- Кнопку 'Закрыть' можно удалить --> <button onclick="ShowKnopka()">Закрыть</button> <button onclick="ClickKnopka()">Кнопка</button> </div> </div> <script> function ShowKnopka(){ let el=document.querySelector('.knopka'); el.hidden=el.hidden?false:true; // Если надо чтобы через какое-то время снова появилась //setTimeout(ShowKnopka,5000); } function ClickKnopka(){ alert('Ваш обработчик клика кнопки'); } // Кнопка появится через 5 секунд setTimeout(ShowKnopka,5000); </script> </body> </html>
:kozak:
timo-71, Согласен.
Я переделываю потихоньку свои скрипты с старого движка применяя новые возможности. Но думаю XMLHttpRequest пока ещё рано удалять, в современных браузерах он работает и для совместимости с старыми сгодится ещё.
Несчастные ваши ученики и пользователи, жалко мне их. Поэтому я и делаю своё, пусть вас это и напрягает, коробит и тд. зато моим пользователям будет хорошо. Как надо делать то все знают, но в результате фигня у вас получается. С горем пополам что-то работает.. Но как не надо делать(удобно, просто, без костылей) вы не сможете, потому как умишка не достаточно..
Это вас не должно волновать, у вас есть куча мала других :)
