By GokiSoft.com| 20:12 06/04/2022|
Học HTML5 - CSS3

[Source Code] Khóa học html5/css3 - Lesson 2

#readme.txt


Nội dung kiến thức:
	- Formatting text trong html
	- Image, Link, Table, Form trong HTML
	- Tim hiểu 1 vài thuộc tính CSS căn bản
=======================================================


#vidu.html


<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>HTML tutorial</title>
</head>
<body style="background-color: #a9daf5">
<!-- Heading -->
<h1 style="color: red">H1 Heading</h1>
<h2 style="color: #13eba6">H2 Heading</h2>
<h3 style="color: rgb(16, 143, 222);">H3 Heading</h3>
<h4>H4 Heading</h4>
<h5>H5 Heading</h5>
<h6>H6 Heading</h6>

<!-- Phan 2 -->
<h2>Using HTML Formatting Elements</h2><br>
<b>This text is displayed in bold.</b><br>
<i>This text is displayed in italic.</i><br>
<u>This text is underlined.</u><br>
<small style="font-size: 60px; color: green; background-color: yellow;">This text is displayed smaller.</small>

<!-- Phan 3 -->
<h3>Updating, Emphasizing, and Shifting Text</h3>
This is an example of <del>deleted</del> <ins>inserted
</ins> text.<br/>
The is an example of <strong>Strong</strong> text.<br/>
The is an example of <sub>subscript</sub>text.<br/>
The is an example of <sup>superscript</sup> text.<br/>
<p>ax<sup>2</sup> + bx + c = 0</p>

log<sub>5</sub><sup>12</sup>

<!-- Phan 4 -->
<br/>
<center>Xin chao</center>

<!-- Phan 5 -->
<h2>Days in a Week:</h2>
<ol style="list-style-type: upper-roman; background-image: url(https://i.ytimg.com/vi/3dcli9i_pvA/hqdefault.jpg); background-size: cover; background-repeat: no-repeat; height: 300px; background-position: center;">
	<li>Sunday</li>
	<li>Monday</li>
	<li>Tuesday</li>
	<li>Wednesday</li>
	<li>Thursday</li>
	<li>Friday</li>
	<li>Saturday</li>
</ol>

<!-- Phan 5 -->
<h2>Days in a Week:</h2>
<ul style="list-style-type: circle;">
	<li>Sunday</li>
	<li>Monday</li>
	<li>Tuesday</li>
	<li>Wednesday</li>
	<li>Thursday</li>
	<li>Friday</li>
	<li>Saturday</li>
</ul>

<!-- Hien hinh anh link tren mang -->
<img src="https://i.ytimg.com/vi/dip_8dmrcaU/maxresdefault.jpg" style="width: 300px">

<br/>
<img src="photos/hinh-anh-1.webp" style="width: 480px">
<br/>

<br/>
<a href="https://gokisoft.com/share-code-huong-dan-thiet-ke-layout-htmlcss-lap-trinh-htmlcssjs.html" target="_self">Hướng dẫn thiết kế layout HTML/CSS - Lập trình HTML/CSS/JS</a>

<br/>
<a href="https://gokisoft.com/share-code-huong-dan-thiet-ke-layout-htmlcss-lap-trinh-htmlcssjs.html" target="_blank">Hướng dẫn thiết kế layout HTML/CSS - Lập trình HTML/CSS/JS</a>

<br/>
<a href="tel:0967025996">0967.025.996</a>

<br/>
<a href="mailto:gokisoft.com@gmail.com">gokisoft.com@gmail.com</a>

<p>
	<a href="vidu2.html">Next Page</a>
</p>
</body>
</html>


#vidu2.html


<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>Table & Form in HTML</title>
</head>
<body>
<h1>Table</h1>
<table border="1" style="width: 100%" cellpadding="5">
	<tr>
		<th>1 Header</th>
		<th>2 Header</th>
		<th>3 Header</th>
	</tr>
	<tr>
		<td>1 data</td>
		<td>1 data</td>
		<td>1 data</td>
	</tr>
	<tr>
		<td>1 data</td>
		<td>1 data</td>
		<td>1 data</td>
	</tr>
	<tr>
		<td>1 data</td>
		<td>1 data</td>
		<td>1 data</td>
	</tr>
	<tr>
		<td>1 data</td>
		<td>1 data</td>
		<td>1 data</td>
	</tr>
	<tr>
		<td>1 data</td>
		<td>1 data</td>
		<td>1 data</td>
	</tr>
	<tr>
		<td>1 data</td>
		<td>1 data</td>
		<td>1 data</td>
	</tr>
</table>
<h2>Vi du 2: Table</h2>
<table border="1" style="width: 100%" cellpadding="5">
	<tr>
		<th rowspan="2"></th>
		<th colspan="2">Average</th>
		<th rowspan="2">Red Eyes</th>
	</tr>
	<tr>
		<th>Height</th>
		<th>Width</th>
	</tr>
	<tr>
		<td>1</td>
		<td>1</td>
		<td colspan="2" rowspan="2">1</td>
	</tr>
	<tr>
		<td>1</td>
		<td>1</td>
	</tr>
</table>
</body>
</html>


#vidu3.html


<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>Form tutorial</title>
</head>
<body>
<label>Ho & Ten: </label>
<br/>
<input type="text" style="width: 420px" placeholder="Nhap ho & ten">

<br/><br/>
<label>Email: </label>
<br/>
<input type="email" style="width: 420px" placeholder="Nhap email">

<br/><br/>
<label>Password: </label>
<br/>
<input type="password" style="width: 420px" placeholder="Nhap mat khau">

<br/><br/>
<label>Birthday: </label>
<br/>
<input type="date" style="width: 420px">

<br/><br/>
<label>Color: </label>
<br/>
<input type="color" style="width: 420px">

<br/><br/>
<label>Gioi Tinh: </label>
<br/>
<select style="width: 420px">
	<option value="">-- Chon --</option>
	<option value="Name">Nam</option>
	<option value="Nu">Nu</option>
</select>

<br/><br/>
<button>Register</button>
<button>Reset</button>
</body>
</html>




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

5

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

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

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