thienth · minhhien103 · Jul 23, 2017 · Jul 23, 2017 · Jul 23, 2017 · Jul 24, 2017
diff --git a/.DS_Store b/.DS_Store
diff --git a/l01/.DS_Store b/l01/.DS_Store
diff --git a/l01/icon.jpg b/l01/icon.jpg
diff --git a/l01/index.html b/l01/index.html
diff --git a/l02/.DS_Store b/l02/.DS_Store
diff --git a/l02/ex1.html b/l02/ex1.html
diff --git a/l02/ex2.html b/l02/ex2.html
diff --git a/l02/form.html b/l02/form.html
diff --git a/l02/index.html b/l02/index.html
diff --git a/l02/media.html b/l02/media.html
diff --git a/l02/public/.DS_Store b/l02/public/.DS_Store
diff --git a/l02/public/audios/test-audio.mp3 b/l02/public/audios/test-audio.mp3
diff --git a/l02/public/images/icon.jpg b/l02/public/images/icon.jpg
diff --git a/l02/public/videos/.DS_Store b/l02/public/videos/.DS_Store
diff --git a/l02/public/videos/test-video.mp4 b/l02/public/videos/test-video.mp4
diff --git a/l02/table.html b/l02/table.html
diff --git a/l02/webpage/test.html b/l02/webpage/test.html
diff --git a/l04/index.html b/l04/index.html
diff --git a/l04/layout-ex.html b/l04/layout-ex.html
diff --git a/l04/navigation.html b/l04/navigation.html
diff --git a/l04/public/css/style.css b/l04/public/css/style.css
diff --git a/l05/.DS_Store b/l05/.DS_Store
diff --git a/l05/index.html b/l05/index.html
diff --git a/l05/layout-ex.html b/l05/layout-ex.html
diff --git a/l05/layout.html b/l05/layout.html
diff --git a/l05/navigation.html b/l05/navigation.html
diff --git a/l05/public/.DS_Store b/l05/public/.DS_Store
diff --git a/l05/public/css/grid.css b/l05/public/css/grid.css
diff --git a/l05/public/css/style.css b/l05/public/css/style.css
diff --git a/l05/public/images/.DS_Store b/l05/public/images/.DS_Store
diff --git a/l05/public/images/logo.png b/l05/public/images/logo.png
diff --git a/l05/public/plugins/.DS_Store b/l05/public/plugins/.DS_Store
diff --git a/l05/public/plugins/font-awesome/.DS_Store b/l05/public/plugins/font-awesome/.DS_Store
diff --git a/l05/public/plugins/font-awesome/HELP-US-OUT.txt b/l05/public/plugins/font-awesome/HELP-US-OUT.txt
diff --git a/l05/public/plugins/font-awesome/css/font-awesome.css b/l05/public/plugins/font-awesome/css/font-awesome.css
diff --git a/l05/public/plugins/font-awesome/css/font-awesome.min.css b/l05/public/plugins/font-awesome/css/font-awesome.min.css
diff --git a/l05/public/plugins/font-awesome/fonts/FontAwesome.otf b/l05/public/plugins/font-awesome/fonts/FontAwesome.otf
diff --git a/l05/public/plugins/font-awesome/fonts/fontawesome-webfont.eot b/l05/public/plugins/font-awesome/fonts/fontawesome-webfont.eot
diff --git a/l05/public/plugins/font-awesome/fonts/fontawesome-webfont.svg b/l05/public/plugins/font-awesome/fonts/fontawesome-webfont.svg
diff --git a/l05/public/plugins/font-awesome/fonts/fontawesome-webfont.ttf b/l05/public/plugins/font-awesome/fonts/fontawesome-webfont.ttf
diff --git a/l05/public/plugins/font-awesome/fonts/fontawesome-webfont.woff b/l05/public/plugins/font-awesome/fonts/fontawesome-webfont.woff
diff --git a/l05/public/plugins/font-awesome/fonts/fontawesome-webfont.woff2 b/l05/public/plugins/font-awesome/fonts/fontawesome-webfont.woff2
diff --git a/l05/public/plugins/font-awesome/less/animated.less b/l05/public/plugins/font-awesome/less/animated.less
diff --git a/l05/public/plugins/font-awesome/less/bordered-pulled.less b/l05/public/plugins/font-awesome/less/bordered-pulled.less
diff --git a/l05/public/plugins/font-awesome/less/core.less b/l05/public/plugins/font-awesome/less/core.less
diff --git a/l05/public/plugins/font-awesome/less/fixed-width.less b/l05/public/plugins/font-awesome/less/fixed-width.less
diff --git a/l05/public/plugins/font-awesome/less/font-awesome.less b/l05/public/plugins/font-awesome/less/font-awesome.less
diff --git a/l05/public/plugins/font-awesome/less/icons.less b/l05/public/plugins/font-awesome/less/icons.less
diff --git a/l05/public/plugins/font-awesome/less/larger.less b/l05/public/plugins/font-awesome/less/larger.less
diff --git a/l05/public/plugins/font-awesome/less/list.less b/l05/public/plugins/font-awesome/less/list.less
diff --git a/l05/public/plugins/font-awesome/less/mixins.less b/l05/public/plugins/font-awesome/less/mixins.less
diff --git a/l05/public/plugins/font-awesome/less/path.less b/l05/public/plugins/font-awesome/less/path.less
diff --git a/l05/public/plugins/font-awesome/less/rotated-flipped.less b/l05/public/plugins/font-awesome/less/rotated-flipped.less
diff --git a/l05/public/plugins/font-awesome/less/screen-reader.less b/l05/public/plugins/font-awesome/less/screen-reader.less
diff --git a/l05/public/plugins/font-awesome/less/stacked.less b/l05/public/plugins/font-awesome/less/stacked.less
diff --git a/l05/public/plugins/font-awesome/less/variables.less b/l05/public/plugins/font-awesome/less/variables.less
diff --git a/l05/public/plugins/font-awesome/scss/_animated.scss b/l05/public/plugins/font-awesome/scss/_animated.scss
diff --git a/l05/public/plugins/font-awesome/scss/_bordered-pulled.scss b/l05/public/plugins/font-awesome/scss/_bordered-pulled.scss
diff --git a/l05/public/plugins/font-awesome/scss/_core.scss b/l05/public/plugins/font-awesome/scss/_core.scss
diff --git a/l05/public/plugins/font-awesome/scss/_fixed-width.scss b/l05/public/plugins/font-awesome/scss/_fixed-width.scss
diff --git a/l05/public/plugins/font-awesome/scss/_icons.scss b/l05/public/plugins/font-awesome/scss/_icons.scss
diff --git a/l05/public/plugins/font-awesome/scss/_larger.scss b/l05/public/plugins/font-awesome/scss/_larger.scss
diff --git a/l05/public/plugins/font-awesome/scss/_list.scss b/l05/public/plugins/font-awesome/scss/_list.scss
diff --git a/l05/public/plugins/font-awesome/scss/_mixins.scss b/l05/public/plugins/font-awesome/scss/_mixins.scss
diff --git a/l05/public/plugins/font-awesome/scss/_path.scss b/l05/public/plugins/font-awesome/scss/_path.scss
diff --git a/l05/public/plugins/font-awesome/scss/_rotated-flipped.scss b/l05/public/plugins/font-awesome/scss/_rotated-flipped.scss
diff --git a/l05/public/plugins/font-awesome/scss/_screen-reader.scss b/l05/public/plugins/font-awesome/scss/_screen-reader.scss
diff --git a/l05/public/plugins/font-awesome/scss/_stacked.scss b/l05/public/plugins/font-awesome/scss/_stacked.scss
diff --git a/l05/public/plugins/font-awesome/scss/_variables.scss b/l05/public/plugins/font-awesome/scss/_variables.scss
diff --git a/l05/public/plugins/font-awesome/scss/font-awesome.scss b/l05/public/plugins/font-awesome/scss/font-awesome.scss
diff --git a/l05/table-display.html b/l05/table-display.html
diff --git a/l06/.DS_Store b/l06/.DS_Store
diff --git a/l06/layout.html b/l06/layout.html
diff --git a/l06/public/.DS_Store b/l06/public/.DS_Store
diff --git a/l06/public/css/grid.css b/l06/public/css/grid.css
diff --git a/l06/public/css/style.css b/l06/public/css/style.css
diff --git a/l06/public/images/.DS_Store b/l06/public/images/.DS_Store
diff --git a/l06/public/images/cock-tail.jpg b/l06/public/images/cock-tail.jpg
diff --git a/l06/public/images/gia-dinh.jpg b/l06/public/images/gia-dinh.jpg
diff --git a/l06/public/images/kem-que.jpg b/l06/public/images/kem-que.jpg
diff --git a/l06/public/images/logo.png b/l06/public/images/logo.png
diff --git a/l06/public/images/menu-image.jpg b/l06/public/images/menu-image.jpg
diff --git a/l06/public/images/rau-qua.jpg b/l06/public/images/rau-qua.jpg
diff --git a/l06/public/plugins/.DS_Store b/l06/public/plugins/.DS_Store
diff --git a/l06/public/plugins/font-awesome/.DS_Store b/l06/public/plugins/font-awesome/.DS_Store
diff --git a/l06/public/plugins/font-awesome/HELP-US-OUT.txt b/l06/public/plugins/font-awesome/HELP-US-OUT.txt
diff --git a/l06/public/plugins/font-awesome/css/font-awesome.css b/l06/public/plugins/font-awesome/css/font-awesome.css
diff --git a/l06/public/plugins/font-awesome/css/font-awesome.min.css b/l06/public/plugins/font-awesome/css/font-awesome.min.css
diff --git a/l06/public/plugins/font-awesome/fonts/FontAwesome.otf b/l06/public/plugins/font-awesome/fonts/FontAwesome.otf
diff --git a/l06/public/plugins/font-awesome/fonts/fontawesome-webfont.eot b/l06/public/plugins/font-awesome/fonts/fontawesome-webfont.eot
diff --git a/l06/public/plugins/font-awesome/fonts/fontawesome-webfont.svg b/l06/public/plugins/font-awesome/fonts/fontawesome-webfont.svg
diff --git a/l06/public/plugins/font-awesome/fonts/fontawesome-webfont.ttf b/l06/public/plugins/font-awesome/fonts/fontawesome-webfont.ttf
diff --git a/l06/public/plugins/font-awesome/fonts/fontawesome-webfont.woff b/l06/public/plugins/font-awesome/fonts/fontawesome-webfont.woff
diff --git a/l06/public/plugins/font-awesome/fonts/fontawesome-webfont.woff2 b/l06/public/plugins/font-awesome/fonts/fontawesome-webfont.woff2
diff --git a/l06/public/plugins/font-awesome/less/animated.less b/l06/public/plugins/font-awesome/less/animated.less
diff --git a/l06/public/plugins/font-awesome/less/bordered-pulled.less b/l06/public/plugins/font-awesome/less/bordered-pulled.less
diff --git a/l06/public/plugins/font-awesome/less/core.less b/l06/public/plugins/font-awesome/less/core.less
diff --git a/l06/public/plugins/font-awesome/less/fixed-width.less b/l06/public/plugins/font-awesome/less/fixed-width.less
diff --git a/l06/public/plugins/font-awesome/less/font-awesome.less b/l06/public/plugins/font-awesome/less/font-awesome.less
diff --git a/l06/public/plugins/font-awesome/less/icons.less b/l06/public/plugins/font-awesome/less/icons.less
diff --git a/l06/public/plugins/font-awesome/less/larger.less b/l06/public/plugins/font-awesome/less/larger.less
diff --git a/l06/public/plugins/font-awesome/less/list.less b/l06/public/plugins/font-awesome/less/list.less
diff --git a/l06/public/plugins/font-awesome/less/mixins.less b/l06/public/plugins/font-awesome/less/mixins.less
diff --git a/l06/public/plugins/font-awesome/less/path.less b/l06/public/plugins/font-awesome/less/path.less
diff --git a/l06/public/plugins/font-awesome/less/rotated-flipped.less b/l06/public/plugins/font-awesome/less/rotated-flipped.less
diff --git a/l06/public/plugins/font-awesome/less/screen-reader.less b/l06/public/plugins/font-awesome/less/screen-reader.less
diff --git a/l06/public/plugins/font-awesome/less/stacked.less b/l06/public/plugins/font-awesome/less/stacked.less
diff --git a/l06/public/plugins/font-awesome/less/variables.less b/l06/public/plugins/font-awesome/less/variables.less
diff --git a/l06/public/plugins/font-awesome/scss/_animated.scss b/l06/public/plugins/font-awesome/scss/_animated.scss
diff --git a/l06/public/plugins/font-awesome/scss/_bordered-pulled.scss b/l06/public/plugins/font-awesome/scss/_bordered-pulled.scss
diff --git a/l06/public/plugins/font-awesome/scss/_core.scss b/l06/public/plugins/font-awesome/scss/_core.scss
diff --git a/l06/public/plugins/font-awesome/scss/_fixed-width.scss b/l06/public/plugins/font-awesome/scss/_fixed-width.scss
diff --git a/l06/public/plugins/font-awesome/scss/_icons.scss b/l06/public/plugins/font-awesome/scss/_icons.scss
diff --git a/l06/public/plugins/font-awesome/scss/_larger.scss b/l06/public/plugins/font-awesome/scss/_larger.scss
diff --git a/l06/public/plugins/font-awesome/scss/_list.scss b/l06/public/plugins/font-awesome/scss/_list.scss
diff --git a/l06/public/plugins/font-awesome/scss/_mixins.scss b/l06/public/plugins/font-awesome/scss/_mixins.scss
diff --git a/l06/public/plugins/font-awesome/scss/_path.scss b/l06/public/plugins/font-awesome/scss/_path.scss
diff --git a/l06/public/plugins/font-awesome/scss/_rotated-flipped.scss b/l06/public/plugins/font-awesome/scss/_rotated-flipped.scss
diff --git a/l06/public/plugins/font-awesome/scss/_screen-reader.scss b/l06/public/plugins/font-awesome/scss/_screen-reader.scss
diff --git a/l06/public/plugins/font-awesome/scss/_stacked.scss b/l06/public/plugins/font-awesome/scss/_stacked.scss
diff --git a/l06/public/plugins/font-awesome/scss/_variables.scss b/l06/public/plugins/font-awesome/scss/_variables.scss
diff --git a/l06/public/plugins/font-awesome/scss/font-awesome.scss b/l06/public/plugins/font-awesome/scss/font-awesome.scss
diff --git a/l07/.DS_Store b/l07/.DS_Store
diff --git a/l07/index.html b/l07/index.html
diff --git a/l07/layout.html b/l07/layout.html
diff --git a/l07/public/.DS_Store b/l07/public/.DS_Store
diff --git a/l07/public/css/grid.css b/l07/public/css/grid.css
diff --git a/l07/public/css/responsive.css b/l07/public/css/responsive.css
diff --git a/l07/public/css/style.css b/l07/public/css/style.css
diff --git a/l07/public/images/.DS_Store b/l07/public/images/.DS_Store
diff --git a/l07/public/images/cock-tail.jpg b/l07/public/images/cock-tail.jpg
diff --git a/l07/public/images/gia-dinh.jpg b/l07/public/images/gia-dinh.jpg
diff --git a/l07/public/images/kem-que.jpg b/l07/public/images/kem-que.jpg
diff --git a/l07/public/images/logo.png b/l07/public/images/logo.png
diff --git a/l07/public/images/menu-image.jpg b/l07/public/images/menu-image.jpg
diff --git a/l07/public/images/rau-qua.jpg b/l07/public/images/rau-qua.jpg
diff --git a/l07/public/plugins/.DS_Store b/l07/public/plugins/.DS_Store
diff --git a/l07/public/plugins/bootstrap/css/bootstrap-theme.css b/l07/public/plugins/bootstrap/css/bootstrap-theme.css
diff --git a/l07/public/plugins/bootstrap/css/bootstrap-theme.css.map b/l07/public/plugins/bootstrap/css/bootstrap-theme.css.map
diff --git a/l07/public/plugins/bootstrap/css/bootstrap-theme.min.css b/l07/public/plugins/bootstrap/css/bootstrap-theme.min.css
diff --git a/l07/public/plugins/bootstrap/css/bootstrap-theme.min.css.map b/l07/public/plugins/bootstrap/css/bootstrap-theme.min.css.map
diff --git a/l07/public/plugins/bootstrap/css/bootstrap.css b/l07/public/plugins/bootstrap/css/bootstrap.css
diff --git a/l07/public/plugins/bootstrap/css/bootstrap.css.map b/l07/public/plugins/bootstrap/css/bootstrap.css.map
diff --git a/l07/public/plugins/bootstrap/css/bootstrap.min.css b/l07/public/plugins/bootstrap/css/bootstrap.min.css
diff --git a/l07/public/plugins/bootstrap/css/bootstrap.min.css.map b/l07/public/plugins/bootstrap/css/bootstrap.min.css.map
diff --git a/l07/public/plugins/bootstrap/fonts/glyphicons-halflings-regular.eot b/l07/public/plugins/bootstrap/fonts/glyphicons-halflings-regular.eot
diff --git a/l07/public/plugins/bootstrap/fonts/glyphicons-halflings-regular.svg b/l07/public/plugins/bootstrap/fonts/glyphicons-halflings-regular.svg
diff --git a/l07/public/plugins/bootstrap/fonts/glyphicons-halflings-regular.ttf b/l07/public/plugins/bootstrap/fonts/glyphicons-halflings-regular.ttf
diff --git a/l07/public/plugins/bootstrap/fonts/glyphicons-halflings-regular.woff b/l07/public/plugins/bootstrap/fonts/glyphicons-halflings-regular.woff
diff --git a/l07/public/plugins/bootstrap/fonts/glyphicons-halflings-regular.woff2 b/l07/public/plugins/bootstrap/fonts/glyphicons-halflings-regular.woff2
diff --git a/l07/public/plugins/bootstrap/js/bootstrap.js b/l07/public/plugins/bootstrap/js/bootstrap.js
diff --git a/l07/public/plugins/bootstrap/js/bootstrap.min.js b/l07/public/plugins/bootstrap/js/bootstrap.min.js
diff --git a/l07/public/plugins/bootstrap/js/npm.js b/l07/public/plugins/bootstrap/js/npm.js
diff --git a/l07/public/plugins/font-awesome/.DS_Store b/l07/public/plugins/font-awesome/.DS_Store
diff --git a/l07/public/plugins/font-awesome/HELP-US-OUT.txt b/l07/public/plugins/font-awesome/HELP-US-OUT.txt
diff --git a/l07/public/plugins/font-awesome/css/font-awesome.css b/l07/public/plugins/font-awesome/css/font-awesome.css
diff --git a/l07/public/plugins/font-awesome/css/font-awesome.min.css b/l07/public/plugins/font-awesome/css/font-awesome.min.css
diff --git a/l07/public/plugins/font-awesome/fonts/FontAwesome.otf b/l07/public/plugins/font-awesome/fonts/FontAwesome.otf
diff --git a/l07/public/plugins/font-awesome/fonts/fontawesome-webfont.eot b/l07/public/plugins/font-awesome/fonts/fontawesome-webfont.eot
diff --git a/l07/public/plugins/font-awesome/fonts/fontawesome-webfont.svg b/l07/public/plugins/font-awesome/fonts/fontawesome-webfont.svg
diff --git a/l07/public/plugins/font-awesome/fonts/fontawesome-webfont.ttf b/l07/public/plugins/font-awesome/fonts/fontawesome-webfont.ttf
diff --git a/l07/public/plugins/font-awesome/fonts/fontawesome-webfont.woff b/l07/public/plugins/font-awesome/fonts/fontawesome-webfont.woff
diff --git a/l07/public/plugins/font-awesome/fonts/fontawesome-webfont.woff2 b/l07/public/plugins/font-awesome/fonts/fontawesome-webfont.woff2
diff --git a/l07/public/plugins/font-awesome/less/animated.less b/l07/public/plugins/font-awesome/less/animated.less
diff --git a/l07/public/plugins/font-awesome/less/bordered-pulled.less b/l07/public/plugins/font-awesome/less/bordered-pulled.less
diff --git a/l07/public/plugins/font-awesome/less/core.less b/l07/public/plugins/font-awesome/less/core.less
diff --git a/l07/public/plugins/font-awesome/less/fixed-width.less b/l07/public/plugins/font-awesome/less/fixed-width.less
diff --git a/l07/public/plugins/font-awesome/less/font-awesome.less b/l07/public/plugins/font-awesome/less/font-awesome.less
diff --git a/l07/public/plugins/font-awesome/less/icons.less b/l07/public/plugins/font-awesome/less/icons.less
diff --git a/l07/public/plugins/font-awesome/less/larger.less b/l07/public/plugins/font-awesome/less/larger.less
diff --git a/l07/public/plugins/font-awesome/less/list.less b/l07/public/plugins/font-awesome/less/list.less
diff --git a/l07/public/plugins/font-awesome/less/mixins.less b/l07/public/plugins/font-awesome/less/mixins.less
diff --git a/l07/public/plugins/font-awesome/less/path.less b/l07/public/plugins/font-awesome/less/path.less
diff --git a/l07/public/plugins/font-awesome/less/rotated-flipped.less b/l07/public/plugins/font-awesome/less/rotated-flipped.less
diff --git a/l07/public/plugins/font-awesome/less/screen-reader.less b/l07/public/plugins/font-awesome/less/screen-reader.less
diff --git a/l07/public/plugins/font-awesome/less/stacked.less b/l07/public/plugins/font-awesome/less/stacked.less
diff --git a/l07/public/plugins/font-awesome/less/variables.less b/l07/public/plugins/font-awesome/less/variables.less
diff --git a/l07/public/plugins/font-awesome/scss/_animated.scss b/l07/public/plugins/font-awesome/scss/_animated.scss
diff --git a/l07/public/plugins/font-awesome/scss/_bordered-pulled.scss b/l07/public/plugins/font-awesome/scss/_bordered-pulled.scss
diff --git a/l07/public/plugins/font-awesome/scss/_core.scss b/l07/public/plugins/font-awesome/scss/_core.scss
diff --git a/l07/public/plugins/font-awesome/scss/_fixed-width.scss b/l07/public/plugins/font-awesome/scss/_fixed-width.scss
diff --git a/l07/public/plugins/font-awesome/scss/_icons.scss b/l07/public/plugins/font-awesome/scss/_icons.scss
diff --git a/l07/public/plugins/font-awesome/scss/_larger.scss b/l07/public/plugins/font-awesome/scss/_larger.scss
diff --git a/l07/public/plugins/font-awesome/scss/_list.scss b/l07/public/plugins/font-awesome/scss/_list.scss
diff --git a/l07/public/plugins/font-awesome/scss/_mixins.scss b/l07/public/plugins/font-awesome/scss/_mixins.scss
diff --git a/l07/public/plugins/font-awesome/scss/_path.scss b/l07/public/plugins/font-awesome/scss/_path.scss
diff --git a/l07/public/plugins/font-awesome/scss/_rotated-flipped.scss b/l07/public/plugins/font-awesome/scss/_rotated-flipped.scss
diff --git a/l07/public/plugins/font-awesome/scss/_screen-reader.scss b/l07/public/plugins/font-awesome/scss/_screen-reader.scss
diff --git a/l07/public/plugins/font-awesome/scss/_stacked.scss b/l07/public/plugins/font-awesome/scss/_stacked.scss
diff --git a/l07/public/plugins/font-awesome/scss/_variables.scss b/l07/public/plugins/font-awesome/scss/_variables.scss
diff --git a/l07/public/plugins/font-awesome/scss/font-awesome.scss b/l07/public/plugins/font-awesome/scss/font-awesome.scss
diff --git a/l08/index.html b/l08/index.html
diff --git a/l08/main.js b/l08/main.js
diff --git a/l09/index.html b/l09/index.html
diff --git a/l09/main.js b/l09/main.js
diff --git a/l10/form.html b/l10/form.html
@@ -10,7 +10,14 @@
 			width: 40px;
 			height: 40px;
 			border: 1px solid #000;
+			text-align: center;
+			font-size: 30px;
 		}
+		table{
+			border-spacing: 0;
+    		border-collapse: collapse;
+		}
+
 	</style>
 </head>
 <body>

diff --git a/l10/index.html b/l10/index.html
diff --git a/l10/public/images/anh1.jpg b/l10/public/images/anh1.jpg
diff --git a/l10/public/images/anh2.jpg b/l10/public/images/anh2.jpg
diff --git a/l10/public/images/anh3.jpg b/l10/public/images/anh3.jpg
diff --git a/l10/public/js/form.js b/l10/public/js/form.js
@@ -13,19 +13,66 @@
 var selectTag = document.getElementById('select-cell');
 var tbodyTag = document.getElementById('playground');
 var option = '';
-for (var i = 1; i <=30 ; i++) {
+for (var i = 5; i <=30 ; i++) {
 	option += "<option value=" + i + ">"+i+"</option>";
 }
 selectTag.innerHTML = option;
+
+var turn = "X";
+var color = 'lightgreen';
 function start(){
 	var tbodyContent = "";
 	var playgroundSize = selectTag.value;
 	for (var i = 0; i < playgroundSize; i++) {
 		tbodyContent += "<tr>";
 		for (var j = 0; j < playgroundSize; j++) {
-			tbodyContent += "<td x=" + j + " y=" + i +"></td>";
+			tbodyContent += "<td onclick='check(this)' x=" + j + " y=" + i +"></td>";
 		}
 		tbodyContent += "</tr>";
 	}
 	tbodyTag.innerHTML = tbodyContent;
-}
+}
+
+function check(element){
+	if(element.innerText == ""){
+		element.innerText = turn;
+		element.style.color = color;
+		var winner = checkWinner(element);
+		if(winner) {
+			alert("chuc mung ban da chien thang");
+			start();
+			return;
+		}
+		color = turn == "X" ? "red" : "lightgreen";
+		turn = turn == "X" ? "O" : "X";
+
+	}
+}
+
+function checkWinner(element){
+	var flag = false;
+	// check hang ngang (y = nhau)
+	var listTd = 
+			document.querySelectorAll('[y="'+element.attributes.y.value+'"]');
+	var countTurn = 0;
+	for (var i = 0; i < listTd.length; i++) {
+		// listTd[i].style.background = "#ccc";
+		if(listTd[i].innerText == turn){
+			countTurn++;
+		}else{
+			countTurn = 0;
+		}
+
+		if(countTurn >= 5){
+			flag = true;
+			break;
+		}
+	}
+
+	// neu thang thi return true, chua thang return false
+	return flag;
+}
+
+
+
+
diff --git a/l10/public/js/main.js b/l10/public/js/main.js
diff --git a/l11/ex.html b/l11/ex.html
@@ -0,0 +1,30 @@
+<!DOCTYPE html>
+<html>
+<head>
+	<meta charset="utf-8">
+	<meta http-equiv="X-UA-Compatible" content="IE=edge">
+	<title></title>
+	<link rel="stylesheet" href="">
+</head>
+<body>
+
+	<div>
+		<p><b>B1:</b> Đếm có bao nhiêu khoảng trắng trong chuỗi.</p>
+		<input type="text" id="b1" >
+		<button type="button" onclick="bai1()">bai1</button>
+	</div>
+	<div>
+		<p><b>B6:</b> Viết chương trình đổi những kí tự đầu tiên của mỗi từ thành chữ in hoa.</p>
+		<input type="text" id="b6" >
+		<button type="button" onclick="bai6()">bai6</button>
+	</div>
+	<div>
+		<p><b>B9:</b> Viết chương trình tìm kiếm 1 kí tự xem có trong chuỗi không, nếu có xuất ra vị trí của từ chứ kí tự  đó. (Vd: xâu a là “ho chi minh”: nhập ‘m’=>kết quả là 3)</p>
+		<input type="text" id="b9" >
+		<input type="text" id="b9Char" placeholder="character">
+		<button type="button" onclick="bai9()">bai6</button>
+	</div>
+
+	<script src="public/js/ex.js"></script>
+</body>
+</html>
diff --git a/l11/public/js/ex.js b/l11/public/js/ex.js
@@ -0,0 +1,35 @@
+function bai1(){
+	var str = document.getElementById('b1').value;
+	var arr = str.split(" ");
+	console.log(arr.length-1);
+}
+function bai6(){
+	var str = document.getElementById('b6').value;
+	var arr = str.split(" ");
+	var result = "";
+	for (var i = 0; i < arr.length; i++) {
+		var arrStr = arr[i];
+		if(arrStr == undefined || arrStr == null || arrStr == ""){
+			continue;
+		}
+
+		var lst = arrStr[0].toUpperCase();
+		lst += arrStr.slice(1);
+		arr[i] = lst;
+	}
+	result = arr.join(" ");
+	console.log(result);
+}
+function bai9(){
+	var str = document.getElementById('b9').value;
+	var char = document.getElementById('b9Char').value;
+	var arr = str.split(" ");
+
+	for (var i = 0; i < arr.length; i++) {
+		var pos = arr[i].indexOf(char);
+		if(pos != -1){
+			console.log(i+1);
+			break;
+		}
+	}
+}
diff --git a/l11/public/js/form.js b/l11/public/js/form.js
@@ -0,0 +1,149 @@
+var selectTag = document.getElementById('select-cell');
+var tbodyTag = document.getElementById('playground');
+var option = '';
+for (var i = 5; i <=30 ; i++) {
+	option += "<option value=" + i + ">"+i+"</option>";
+}
+selectTag.innerHTML = option;
+
+var turn = "X";
+var color = 'lightgreen';
+function start(){
+	var tbodyContent = "";
+	var playgroundSize = selectTag.value;
+	for (var i = 0; i < playgroundSize; i++) {
+		tbodyContent += "<tr>";
+		for (var j = 0; j < playgroundSize; j++) {
+			tbodyContent += "<td onclick='check(this)' x=" + j + " y=" + i +"></td>";
+		}
+		tbodyContent += "</tr>";
+	}
+	tbodyTag.innerHTML = tbodyContent;
+}
+
+function check(element){
+	if(element.innerText == ""){
+		element.innerText = turn;
+		element.style.color = color;
+		var winner = checkWinner(element);
+		if(winner) {
+			alert("chuc mung ban da chien thang");
+			start();
+			return;
+		}
+		debugger;
+		color = turn == "X" ? "red" : "lightgreen";
+		turn = turn == "X" ? "O" : "X";
+
+	}
+}
+
+function checkWinner(element){
+	var flag = false;
+	// check hang ngang (y = nhau)
+	var listTd = 
+			document.querySelectorAll('[y="'+element.attributes.y.value+'"]');
+	var countTurn = 0;
+	for (var i = 0; i < listTd.length; i++) {
+		// listTd[i].style.background = "#ccc";
+		if(listTd[i].innerText == turn){
+			countTurn++;
+		}else{
+			countTurn = 0;
+		}
+
+		if(countTurn >= 5){
+			flag = true;
+			break;
+		}
+	}
+
+	// neu thang thi return true, chua thang return false
+	if(flag){
+		return flag;
+	}
+
+	countTurn = 0;
+	// Check theo hang doc (x = nhau)
+	var listTd = 
+			document.querySelectorAll('[x="'+element.attributes.x.value+'"]');
+	var countTurn = 0;
+	for (var i = 0; i < listTd.length; i++) {
+		// listTd[i].style.background = "#ccc";
+		if(listTd[i].innerText == turn){
+			countTurn++;
+		}else{
+			countTurn = 0;
+		}
+
+		if(countTurn >= 5){
+			flag = true;
+			break;
+		}
+	}
+
+	// neu thang thi return true, chua thang return false
+	if(flag){
+		return flag;
+	}
+
+	// Check duong cheo tu phai sang trai diem dau tien se co toa do(x+y, 0)
+	countTurn = 0;
+	var customX = parseInt(element.attributes.x.value) 
+						+ parseInt(element.attributes.y.value);
+	var customY = 0;
+	while(customX != -1){
+		var td = document
+			.querySelector('[x="' + customX + '"][y="' + customY + '"]');
+		if(td != null){
+
+			if(td.innerText == turn){
+				countTurn++;
+			}else{
+				countTurn = 0;
+			}
+
+			if(countTurn >= 5){
+				flag = true;
+				break;
+			}
+		}
+		customX--; customY++;
+	}
+
+	if(flag){
+		return flag;
+	}
+
+	// Check duong cheo tu trai sang phai diem dau tien se co toa do(x-y, 0)
+	countTurn = 0;
+	var customX = parseInt(element.attributes.x.value) 
+						- parseInt(element.attributes.y.value);
+	var customY = 0;
+	while(customY <= parseInt(selectTag.value)){
+		var td = document
+			.querySelector('[x="' + customX + '"][y="' + customY + '"]');
+		if(td != null){
+
+			if(td.innerText == turn){
+				countTurn++;
+			}else{
+				countTurn = 0;
+			}
+
+			if(countTurn >= 5){
+				flag = true;
+				break;
+			}
+		}
+		customX++; customY++;
+	}
+	if(flag){
+		return flag;
+	}
+
+}
+
+
+
+
diff --git a/l12/.DS_Store b/l12/.DS_Store
diff --git a/l12/b1.html b/l12/b1.html
@@ -0,0 +1,41 @@
+<!DOCTYPE html>
+<html>
+<head>
+	<meta charset="utf-8">
+	<meta http-equiv="X-UA-Compatible" content="IE=edge">
+	<title></title>
+	<link rel="stylesheet" href="">
+</head>
+<body>
+	<button type="button" imgUrl="http://s3.weddbook.com/t4/2/3/6/2363380/sexy-girl.jpg">Con nguời</button>
+	<button type="button" imgUrl="https://vignette3.wikia.nocookie.net/adventuretimewithfinnandjake/images/0/06/Pig_trans.png/revision/latest?cb=20120812082359">Con heo</button>
+	<button type="button" imgUrl="http://kids.nationalgeographic.com/content/dam/kids/photos/animals/Mammals/H-P/pig-full-body.adapt.945.1.jpg">Con lợn</button>
+	<button type="button" imgUrl="https://www.cesarsway.com/sites/newcesarsway/files/styles/large_article_preview/public/Common-dog-behaviors-explained.jpg?itok=FSzwbBoi">Con chó</button>
+	<button type="button" imgUrl="http://news.nationalgeographic.com/content/dam/news/2016/10/08/drill-monkey-waq/drill-monkey-01.jpg">Con khỉ</button>
+	<button type="button" imgUrl="https://img.purch.com/h/1000/aHR0cDovL3d3dy5saXZlc2NpZW5jZS5jb20vaW1hZ2VzL2kvMDAwLzAzNi85ODgvb3JpZ2luYWwvZWxlcGhhbnRzLmpwZw==">Con voi</button>
+	<h2></h2>
+	<img src="" width='400' alt="">
+
+	<style type="text/css" media="screen">
+		.active{
+			border: 5px solid #ccc;
+			border-radius: 10px;
+			width: 600px;
+		}
+	</style>
+	<script type="text/javascript" src="public/js/jquery.min.js"></script>
+	<script>
+		$(document).ready(function(){
+
+			$('button').hover(function(){
+				$('h2').text($(this).text());
+				$('img').attr('src', $(this).attr('imgUrl'));
+				$(this).remove();
+			});
+			$('img').on('mouseover mouseout', function(){
+				$(this).toggleClass('active');
+			});
+		});
+	</script>
+</body>
+</html>
diff --git a/l12/index.html b/l12/index.html
@@ -0,0 +1,34 @@
+<!DOCTYPE html>
+<html>
+<head>
+	<meta charset="utf-8">
+	<meta http-equiv="X-UA-Compatible" content="IE=edge">
+	<title></title>
+	<link rel="stylesheet" href="">
+</head>
+<body>
+	<input type="text" id="target" value="" placeholder="">
+	<input type="radio" name="gender" value="Male" > Male
+	<input type="radio" value="Female"  name="gender" > Female
+	<input type="radio" value="Gay"  name="gender"> Gay
+	<input type="radio" value="Les"  name="gender"> Les
+	<button type="button">Check gender</button>
+	<h2></h2>
+	<h2></h2>
+	<h2></h2>
+	<h2></h2>
+	<script type="text/javascript" src="public/js/jquery.min.js"></script>
+	<script>
+		$(document).ready(function(){
+			$('#target').on('keydown', function(){
+				var value = $('#target').val();
+				$('h2').text(value);
+			});
+
+			$('button').on('click', function(){
+				$('h2').text($('input[type=radio]:checked').val());
+			});
+		});
+	</script>
+</body>
+</html>