JSFiddle - React, Tailwind, and code Playground
HTML
<!--Центр изучения потребительского спроса собирает информацию о потребляемых соках в разрезе городов России с населением более 1 миллиона.-->
<!--Используются следующие поля: Фирма производитель, Название, Концентрация (не больше 100% и не меньше 50%), Цена. -->
<!--Способ приготовления (переключатель) например: из концентрированного сока, из сухих материалов и т.д., -->
<!--содержание заменителя сахара (флажок). В случае использования заменителя сахара активизируется поле для записи его наименования. -->
<!-- Кроме того определена категория сока (переключатель «нектар/сок»),-->
<!--в случае нектара количество витамина C намного меньше.-->
<html>
<head>
<title> Центр изучения потребительского спроса</title>
<script LANGUAGE="JavaScript">
</script>
<LINK TYPE="text/css" REL="stylesheet" href="6.css">
<style type="text/css">
</style>
</head>
<body>
<fieldset>
<form action="handler.php" method="post" target="_blank">
<FORM name ="form2">
Название:<br>
<div onmouseover="sch (s1)" onmouseout="delet()">
<input type="text" name="name" value="" size="" maxlength="" class=""onMouseOver="this.style.background='#F5F5DC'" onMouseOut="this.style.background='#FFDEAD'"></br>
Фирма производитель:<br>
<input type="text" name="name"onMouseOver="this.style.background='#F5F5DC'" onMouseOut="this.style.background='#FFDEAD'"> <br>
<input type="reset" id="but1" value="Очистить форму"onMouseOver="this.style.background='#F5F5DC'" onMouseOut="this.style.background='#FFDEAD'"/>
<!----------------------------------------------->
</br>
Концентрация:
<INPUT TYPE=radio NAME=gender VALUE= "checkl 1">не больше 100%
<INPUT TYPE=radio NAME=gender VALUE="checkl 2">не меньше 50%
Категория:
<br>
<INPUT TYPE=radio NAME=gender VALUE=" checkl3">Нектар</br>
<INPUT TYPE=radio NAME=gender VALUE="checkl4">Сок</br>
Способ приготовления:
<br>
<input type=radio name=generator value="checkl5">Концентрированный сок<br>
<input type=radio name=generator value="checkll6">Из свежих...
CSS
body{ font:12pt sans-serif;line-height:15px;cursor:pointer;font-family:arial}
checkbox{border:3px ;}
form{border:2px solid dark;width:40%;padding:5px;margin:0;text-align:left;background: #AFEEEE;font:bold 10pt;line-height:25px}
JavaScript
function onPush() {
alert("Вы отправили заявку!");
}
function showField() {
if(document.getElementById('btn').checked) {
document.getElementById('field').style.display='block';
}
}
var id1 = document.getElementById("id1"), id2 = document.getElementById("id2"); // обращение к первому и второму div-ам по идентификатору
id1.onmouseover = function () { // событие (функция) по наведению мыши на первый div
id2.innerHTML = "заданный <b>html</b> код"; // innerHTML задает html-код (в данном случае второму div-у)
}
id1.onmouseout = function () { // событие по уходу с элемента мыши
id2.innerHTML = ""; // убираем текст со второго div-a
}