almost done

HW_06/index.html

@@ -14,7 +14,58 @@
 	.podsvetka {
   		background:lightgreen;
 	}
+
+	button{
+		cursor: pointer;
+		text-decoration: none;
+  		display: inline-block;
+  		color: white;
+  		padding: 10px 110px;
+  		margin: 30px;
+  		border-radius: 10px;
+  		font-family: 'Montserrat', sans-serif;
+  		text-transform: uppercase;
+  		letter-spacing: 2px;
+  		background-image: linear-gradient(to right, #9EEFE1 0%, #4830F0 51%, #9EEFE1 100%);
+  		background-size: 200% auto;
+  		box-shadow: 0 0 20px rgba(0, 0, 0, .1);
+  		transition: .5s;
+	}
+
+	button:hover {
+  		background-position: right center;
+	}
+
+	#num1, #num2{
+  		font-size: 16px;
+  		padding: 10px;
+  		display: block;
+  		width: 300px;
+ 	 	border: none;
+  		border: 1px solid #ccc;
+  		margin-top: 30px;
+	}
+
+	#result{
+		font-size: 16px;
+  		padding: 10px;
+  		display: inline-block;
+  		width: 300px;
+ 	 	border: none;
+  		border: 1px solid #ccc;
+  		margin-top: 20px;
+	}
+	
+	input:focus {
+  		outline: none;
+	}
 </style>
+	
+	<input type="number" id="num1" placeholder="number 1">
+   	<input type="number" id="num2" placeholder="number 2">
+   	<button id="plus">Sum</button>
+   	<input type="number" id='result'>
+
 	<script>
 
 //------таблица умножения	
@@ -100,7 +151,7 @@
 */
 
 //------подсветить строку и столбец
-		let table=document.createElement('table');
+		/*let table=document.createElement('table');
 		table.border=1+'px';
 		table.id='tab';
 		table.style.borderColor='orange';
@@ -154,9 +205,24 @@
       		);
 		}
 
-		document.body.append(table);
+		document.body.append(table);*/
+
+
+//---------Calc
+		/*plus.onclick=function(){
+			result.value=(+num1.value)+(+num2.value);
+		}*/
+
+
+//---------Calc Live
+		function calc(){
+			result.value=(+num1.value)+(+num2.value);
+		}
 
+		// ??????????
 
+		//input1.oninput = calc;
+		//input2.oninput = calc;