By GokiSoft.com| 20:40 25/10/2023|

Học JS

[Examination] Bài Thi Thực Hành HTML/CSS/JS

Tài Nguyên

Lưu thông tin bài 2 đăng ký vào localStorage

Phản hồi từ học viên

5

(Dựa trên đánh giá ngày hôm nay)

vuong huu phu

2020-11-16 10:02:53

#bai2.html

<!DOCTYPE html>
<html>
<head>
	<title>bai2</title>
</head>
<meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script>
  <style type="text/css">
  	.tieude {font-family: arial;
  		color: #0000CC;
  		font-weight: bold;
  		font-size: 30px;
  		padding-left: 1%;
  		padding-top: 1%;
  	}
  	.chitet1{
  		font-family: arial;
  		color: #000066;

  	}
    button {
    	background-color: #CCCCCC;
    	font-family: arial;
    }
  </style>
<body>
<div class="container">
	<div style="background-color:  #FFFFCC;">
		<div class="row">
			<div class="col-md-1">
				<img src="\phu nha11\bai thi\BWS_Set12\regis.png" width="100%">
			</div>
			<div class="col-md-11 tieude">
				<p>phiếu mượn sách</p>
			</div>
		</div>
		<div>
			<div class="row">
				<div class="col-md-2" style="padding-left: 5%">
					<p><label class="chitet1">Mã sinh viên</label></p>
					<p><label class="chitet1"> Họ và tên</label></p>
					<p><label class="chitet1">Loại sách</label></p>
					<p><label class="chitet1">Tên sách</label></p>
					<p><label class="chitet1">Ngày mượn</label></p>
					<p><label class="chitet1">Ngày trả</label></p>
				</div>
				<div class="col-md-10"><form>
					<p><input type="text" name="msv"></p>
					<p><input type="text" name="name"></p>
					<p><select>
						<option>chon loai sách</option>
						<option>sách 1</option>
						<option>sách 2</option>
						<option>sách 3</option>
					</select></p>
					<p><input type="text" name="tens"  style="width: 60%"></p>
					<p style="padding-bottom: 1%"><input  type="text" name="nm"></p>
					<p><input type="text" name="mt"></p>
					<div style="padding-top: 5%; padding-bottom: 10%">
						<button type="input"><img src="\phu nha11\bai thi\BWS_Set12\log_in.png">Đăng kí</button>
						<button type="reset"><img src="\phu nha11\bai thi\BWS_Set12\cancel.png">Đăng nhập</button>
					</div>
				</form></div>
			</div>
		</div>
	</div>
</div>
</body>
</html>

Đỗ Mạc Nam

2020-11-16 10:02:49

#cancel.png

https://res.cloudinary.com/wegoup/image/upload/v1605520963/b98kczruugia6pkilir5.png

#index.html

<!DOCTYPE html>
<html>
<head>
	<title>Building Next Generation Websites</title>
	<meta charset="utf-8">
	<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css">
	<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.7.0/css/all.css" integrity="sha384-lZN37f5QGtY3VHgisS14W3ExzMWZxybE1SJSEsQp9S+oqd12jhcu+A56Ebc1zFSJ" crossorigin="anonymous">
	<link href="https://res.cloudinary.com/gokisoft-com/image/upload/v1565325779/icon_qokvwu.png" rel="icon">
	<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
		<div class="container">	
		  <div class="login">
		  	<div class="tittle">
		  		<h2>ĐĂNG NHẬP HỆ THỐNG</h2>
		  	</div>
		  	<div class="login_main" >
		  		<img src="login.png">
		  		<form class="form" style="margin-top: 20px;" name="contactForm" action="" onsubmit="return validateForm()" method="post">
		  			<table>
		  				<tr > 
		  					<td><label>Tài Khoản</label></td>
		  					<th><input type="text" id="fname" name="name" class="form-control" value required></th>
		  				</tr>
		  				<tr >
		  					<td><label style="padding-right: 50px;">Mật Khẩu</label></td>
		  					<th><input type="password" name="password" class="form-control" style="margin-top: 20px;" id="password" required></th>
		  				</tr>
		  			</table>
		  			<div style="float: right; margin-top: 20px;">
		  				<button type="submit" style="margin-right: 5px;" onclick="dangnhap()"> Đăng nhập</button>
		  			    <button type="button"> Đăng ký</button>
		  			</div>
		  		</form>
		  	</div>
		  </div>
		</div>

</body>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js"></script>
<script type="text/javascript">
	
  var fname = document.getElementsByTagName('fname').value;
  var password = document.getElementsByTagName('password').value;
  function dangnhap(){
  	if (fname="") {
  	  alert("xin nhập tài khoản"); 
     }
  else if (password="") {
    alert("xin nhập mật khẩu")
  }
  	else alert('đăng nhập thành công')
  }
</script>
</html>

#log_in.png

https://res.cloudinary.com/wegoup/image/upload/v1605520964/kvs2rf6wabpjz4birmjq.png

#login.png

https://res.cloudinary.com/wegoup/image/upload/v1605520965/za5nsmhwia6whcd438p3.png

#regis.png

https://res.cloudinary.com/wegoup/image/upload/v1605520965/xxhlksynwdnlpjbinl4h.png

#style.css

.container{
    	background-color: #FFFFCC;

    	
}
.login{
    	height: 300px;
    	width: 100%;
    	margin-left: 15px;

}
.tittle h2{
    	font-family: arial;
    	color: #0000CC;
}
.login_main {
    	display: flex;
    	padding: 10px;

}
.login_main label{
    	 	color: #000066;
    	 	font-size:16px;
    	 	font-family: arial;
    	 	font-weight: bold;
}

Triệu Văn Lăng

2020-11-16 10:02:43

#exam2.html

<!DOCTYPE html>
<html>
<head>
	<title>exam2</title>
	<meta charset="utf-8">
	<link rel="stylesheet" type="text/css" href="exam2.css">
	<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css">

		<!-- jQuery library -->
		<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>

		<!-- Popper JS -->
		<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>

		<!-- Latest compiled JavaScript -->
		<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js"></script>
</head>
<body>
	<div class="container-fluid full">
		<div class="container">
			<div class="row">
				<img src="photo/regis.png">
				<h2>Phiếu mượn sách</h2>
			</div>
			<div>
				<label>
					<b>Mã sinh viên</b>
				</label>
				<input type="text" name="msv">
			</div>
			<div>
				<label>
					<b>Họ và tên </b>
				</label>
				<input type="text" name="name" maxlength="50">
			</div>
			<div>
				<label>
					<b>loại sách</b>
				</label>
				<select>
					<option>--chọn loại sách--</option>
				</select>
				
			</div>
			<div>
				<label>
					<b>Tên sách</b>
				</label>
				<input type="text" name="book_name" size="50">
			</div>
			<div>
				<label>
					<b>Ngày mượn</b>
				</label>
				<input type="date" name="muon">
			</div>
			<div>
				<label>
					<b>Ngày trả</b>
				</label>
				<input type="date" name="tra">
			</div>
			<div style="margin-left: 70px; margin-top: 30px">
				<button>
					<img src="photo/log_in.png">
					Đăng kí
				</button>
				<button>
					<img src="photo/cancel.png">
					Nhập lại
				</button>
			</div>
		</div>
	</div>
</body>
</html>

Nguyễn đình quân

2020-11-16 10:02:43

<!DOCTYPE html>
<html>
<head>
	<title>bài thi thực hành số 2</title>
<body style="background-color:#FFFFCC;  background-repeat: no-repeat; background-size: cover; color:#0000CC" >
	 <head>
        <meta charset="utf-8">
  </head>
    <body> 
          <img src=" "></img>
         <h3>PHIẾU MƯỢN SÁCH</h3>
        
            <div>
                <label for="id">Mã Sinh Viên:</label>
                <input id="id" type="text" number="id" value="">
            </div>
    
            <div>
                <label for="password">Họ  Và  Tên:</label>
                <input id="id" type="text" name="id" value="">
            </div>

             <div>
             	<label>Loại Sách  :<select ><option>---Chọn Loại Sách---</option></select></label>
                
            </div>
            <div>
                <label for="password">Tên Sách:</label>
                <input id="id" type="text" name="id" value="">
            </div>
             <div>
                <label for="password">Ngày Mượn:</label>
                <input id="id" type="text" name="id" value="">
            </div>
             <div>
                <label for="password">Ngày Trả:</label>
                <input id="id" type="text" name="id" value="">
            </div>
            <div>
                <input type="submit" value="Đăng kí" type="background-color:#CCCCCC">
                <input type="submit" value="Nhập Lại" type="background-color:#CCCCCC ">
            </div>
              
            	
    </body>

</body>
</html>

Triệu Văn Lăng

2020-11-16 10:02:30

#exam.html

<!DOCTYPE html>
<html>
<head>
	<title>exam</title>
	<meta charset="utf-8">
	<link rel="stylesheet" type="text/css" href="exam.css">
	<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css">

		<!-- jQuery library -->
		<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>

		<!-- Popper JS -->
		<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>

		<!-- Latest compiled JavaScript -->
		<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js"></script>
</head>
<body>
	<div class="container ">
		<div class="row name1">
			<h2>đăng nhập hệ thống</h2>
		</div>
		<div class="row" style="margin-top: 20px; line-height: 20px">
			<div class="col-md-4">
				<img src="photo/login.png">
			</div>
			<div class="col-md-8">
				<div >
					<label class="name2"><b> Tài khoản</b></label>
					<input type="text" name="name" size="50" pattern="[A-z]">
				</div>
				<div style="margin-top: 20px">
					<label class="name2"><b>Mật khẩu</b></label>
					<input type="password" name="key" size="50">
				</div>
				<div class="foot">
					<button type="button" onclick="click1()">Đăng nhập</button>
					<button type="reset">Nhập lại</button>
				</div>
			</div>
		</div>
	</div>
	<script type="text/javascript">
		function click1() {
			var tk=document.getElementById("tk").value;
			var mk=document.getElementById("mk").value;
			if (tk=="&& mk==") {
				alert('Đăng nhập khong thành công')
			} else {
				alert('Đăng nhập thành công')
			}
			
		}
	</script>
</body>
</html>

Bùi Văn Mạnh

2020-11-16 10:02:22

#baithithuchanh.html

<!DOCTYPE html>
<html>
<head>
	<title>Bài THi Thực Hành</title>
	<meta charset="utf-8">
	<!-- Latest compiled and minified CSS -->
	<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css">

	<!-- jQuery library -->
	<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>

	<!-- Popper JS -->
	<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>

	<!-- Latest compiled JavaScript -->
	<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js"></script>
	<style type="text/css">
		.row1{
			float: left;
			display: block;
			width: 20%;
			height: 200px;
		}
	</style>
</head>
<body>
	<div class="container" style="background-color: #ffff99">
		<div>
		<h1 class="row" style="color:#0066ff; margin-left: 30px">ĐĂNG NHẬP HỆ THỐNG</h1>
		</div>
		<div class="row1"><img style="width: 60%;" src="https://png.pngtree.com/png-clipart/20200225/original/pngtree-red-padlock-and-key-isometric-icon-png-image_5252011.jpg"></div>
		<div class="form-group">
  			<label for="usr">Tài Khoản:
  			<input type="text" class="form-control" id="usr" style="margin-left: 75px">
  			</label>
		</div>
		<div class="form-group">
  			<label for="pwd">Mật Khẩu:
 			<input type="password" class="form-control" id="pwd" style="margin-left: 75px">
 			</label>
		</div>
		<div class="form-group form-check">
   			<label class="form-check-label" style="margin-left: 90px">
     			<input class="form-check-input" type="checkbox">Ghi Nhớ
   			</label>
  		</div>
  		<button type="submit" class="btn btn-primary" style="margin-left: 290px">Đăng Nhập</button>
  		<button type="submit" class="btn btn-primary" style="margin-left: 20px">Nhập Lại</button>
	</div>
</body>
</html>

Triệu Văn Lăng

2020-11-16 10:02:15

#exam.css

.container {
	background: #ffffcc;
}
.name1 h2 {
	color: #0000cc;
	text-transform: uppercase;
}
.name2 {
	color: #000066;
}
.foot {
	margin-top: 20px;
	margin-left: 77px;
	border-radius: 15px;
}

Trần Thị Khánh Huyền

2020-11-16 10:01:58

#bai 2.html

<!DOCTYPE html>
<html>
<head>
	<title>bai 2</title>
	<meta charset="utf-8">
	<meta charset="utf-8">
	<!-- Latest compiled and minified CSS -->
	<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css">

	<!-- jQuery library -->
	<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>

	<!-- Popper JS -->
	<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>

	<!-- Latest compiled JavaScript -->
	<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js"></script>
	<meta name='viewport' content='width=device-width, initial-scale=1'>
	<script src='https://kit.fontawesome.com/a076d05399.js'></script>
	<style type="text/css">
		.total{
			background-color: #FFFFCC;
			margin: 0 auto;
			width: 60%;
			border: 1px grey solid;
			padding: 10px;

		}
		.header{
			background-color:  #FFFFCC;
			margin-top: 10px;
			color: #0000CC;
			font: Arial;
		}
	</style>
</head>
<body>
	<div class="total">
	<div class="header">
<div class="row">
		<div class="col-md-2"><img src="photos/regis.png"></div>
	    <div class="col-md-10">
	    	<div class="header"><b>Phiếu mượn sách<b></div>
	    </div>
</div
<form method="post" onsubmit="return checkData();" id="myForm">
					<div class="form-group">
					  <label for="tk">Mã sinh viên</label>
					  <input required="true" type="text" class="form-control" id="tk" name="id" value="">
					</div>
					<div class="form-group">
					  <label for="ht">Họ và tên</label>
					  <input required="true" type="ht" class="form-control" id="ht" name="ht">
					</div>>

</body>
</html>

Triệu Văn Lăng

2020-11-16 10:01:54

#exam.css

.container {
	background: #ffffcc;
}
.name1 h2 {
	color: #0000cc;
	text-transform: uppercase;
}
.name2 {
	color: #000066;
}
.foot {
	margin-top: 20px;
	margin-left: 77px;
	border-radius: 15px;
}

Trần Thị Khánh Huyền

2020-11-16 10:01:32

#bai 1.html

<!DOCTYPE html>
<html>
<head>
	<title>bai 1</title>
	<meta charset="utf-8">
	<!-- Latest compiled and minified CSS -->
	<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css">

	<!-- jQuery library -->
	<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>

	<!-- Popper JS -->
	<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>

	<!-- Latest compiled JavaScript -->
	<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js"></script>
	<meta name='viewport' content='width=device-width, initial-scale=1'>
	<script src='https://kit.fontawesome.com/a076d05399.js'></script>
	<style type="text/css">
		.total{
			background-color: #FFFFCC;
			margin: 0 auto;
			width: 60%;
			border: 1px grey solid;
			padding: 10px;

		}
		.header{
			background-color:  #FFFFCC;
			margin-top: 10px;
			color: #0000CC;
			font: Arial;
		}

	</style>
</head>
<body>
<div class="total">
	<div class="header">
		ĐĂNG NHẬP HỆ THỐNG
	</div>
	<div class="row">
		<div class="col-md-4"><img src="photos/login.png"></div>
	    <div class="col-md-8">
	    	<form method="post" onsubmit="return checkData();" id="myForm">
					<div class="form-group">
					  <label for="tk">Tài khoản</label>
					  <input required="true" type="text" class="form-control" id="tk" name="taikhoan" value="">
					</div>
					<div class="form-group">
					  <label for="mk">Mật khẩu</label>
					  <input required="true" type="mk" class="form-control" id="mk" name="mk">
					</div>
		
	</div>
</div>
<div style="text-align: center; margin-top: 20px;">
			<button type="dangnhap" onclick="register()">Đăng nhập</button>
			<button type="nhaplai">Nhập lại</button>
		</div>
<script type="text/javascript">
	$(function() {
		})

		function register() {
			alert("Đăng nhập thành công"<br> "Ok")
</script>

</body>
</html>

[Examination] Bài Thi Thực Hành HTML/CSS/JS

Tags:

Phản hồi từ học viên

5

vuong huu phu

#bai2.html

Đỗ Mạc Nam

#cancel.png

#index.html

#log_in.png

#login.png

#regis.png

#style.css

Triệu Văn Lăng

#exam2.html

Nguyễn đình quân

Triệu Văn Lăng

#exam.html

Bùi Văn Mạnh

#baithithuchanh.html

Triệu Văn Lăng

#exam.css

Trần Thị Khánh Huyền

#bai 2.html

Triệu Văn Lăng

#exam.css

Trần Thị Khánh Huyền

#bai 1.html

Đăng nhập để làm bài kiểm tra

Chưa có kết quả nào trước đó