By GokiSoft.com| 21:22 16/10/2023|
Học HTML5 - CSS3

Tìm hiểu hiển thị TEXT trong HTML5 và CSS - Phần advanced

Trước khi bắt đầu làm bài này. Bạn có thể làm bài tập đơn giản hơn về Text trong HTML5

Vui lòng xem tại đây => Tìm hiểu hiển thị TEXT trong HTML5 và CSS - Phần basic

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

5

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

Nguyễn Hải Long [community,C2110I]
Nguyễn Hải Long

2021-12-27 15:01:00

https://gnoliah97.github.io/1554-Gokisoft/TouristAttractions.html


hohuy1610@gmail.com [community,C2108L]
hohuy1610@gmail.com

2021-11-17 09:07:29

https://github.com/HoGiaHuy2003/C2108L-HTML-CSS-JS/tree/master/day-3/bt1554


Cao Thái Tuân [community,C2108L]
Cao Thái Tuân

2021-11-15 01:56:06


#Italy.html


<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="./css/style.css">
    <title>Tourist Attractions in Europe</title>
</head>
<body>
    <h1 class="heading"> 
        <big>E</big>urope <big>T</big>ourist <big>A</big>ttractions

    </h1>
    <br>
    
    <p class="place">italy</p>
    <br>
    <ul>
        <li>The Vatican</li>
        <li>Turin has the....</li>
        <li>The Learning town..</li>
    </ul>
<br>
<a href="TouristAttractions.html"; target="_blank">Back</a>
  


    
</body>
</html>


#London.html


<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="./css/style.css">
    <title>Tourist Attractions in Europe</title>
</head>
<body>
    <h1 class="heading"> 
        <big>E</big>urope <big>T</big>ourist <big>A</big>ttractions

    </h1>
    <br>
    
    <p class="place">london</p>
    <br>
    <ul>
        <li>Famous...</li>
        <li>Tower of London</li>
        <li>Big ben</li>
    </ul>
    <br>
    <a href="TouristAttractions.html"; target="_blank">Back</a>
  


    
</body>
</html>


#Paris.html


<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="./css/style.css">
    <title>Tourist Attractions in Europe</title>
</head>
<body>
    <h1 class="heading"> 
        <big>E</big>urope <big>T</big>ourist <big>A</big>ttractions

    </h1>
    <br>
    
    <p class="place">paris</p>
    <br>
    <ul>
        <li>Lovure  Museum</li>
        <li>The Chomps Elysees...</li>
    </ul>
</ul>
<br>
<a href="TouristAttractions.html"; target="_blank">Back</a>
  


    
</body>
</html>


#TouristAttractions.html


<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="./css/style.css">
    <title>Tourist Attractions in Europe</title>
</head>
<body>
    <h1 class="heading"> 
        <big>E</big>urope <big>T</big>ourist <big>A</big>ttractions

    </h1>
    <br>

    <p class="general">Some of the must visit tourist places in Europe:</p>
    <br>

    <p class="place"><a href="London.html"; target="_blank">london</a></p>
<br>
    <p class="place"> <a href="Paris.html"; target="_blank">paris</a></p>
<br>
    <p class="place"><a href="Italy.html"; target="_blank">italy</a></p>


    
</body>
</html>


#style.css


*{
    padding: 0;
    margin: 0;

}
/* css cho Tousis.html */

li{
    font-size: small;
    font-family:Verdana, Geneva, Tahoma, sans-serif;
    text-align: justify;
    margin-left: 20px;

}

.heading{
    font-family: Arial, Helvetica, sans-serif;
    font-size: x-large;
    font-weight: bold;
    text-transform:uppercase ;
    text-decoration:underline;
    cursor: pointer;
}

.general{
    font-style: italic;
    margin: 10px;
}

.place{
    text-decoration:underline;
    font-family: cursive;
    font-size: medium;
    text-transform:capitalize;
    padding: 15px;
}

/* Css cho London.html */
a{
    padding: 10px;
}




Cao Thái Tuân [community,C2108L]
Cao Thái Tuân

2021-11-15 01:43:29

https://github.com/TuanMoKua/C2108L



Ngô Quang Huy [community,C2108L]
Ngô Quang Huy

2021-11-13 09:17:39


#Italy.html


<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="style1.css">
    <title>Tourist Attractions in Europe</title>
</head>

<body>
    <p class="heading">Europe Tourist Attractions</p>
    <p class="places">London</p>
    <ul style="list-style-type: square;">
        <li>The Vatican.</li>
        <li>Turin has the Ergizio Museum.</li>
        <li>The Leaning Tower of Pisa.</li>
    </ul>
    <a href="TouristAttractions.html">Back</a>
</body>

</html>


#London.html


<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="style1.css">
    <title>Tourist Attractions in Europe</title>
</head>

<body>
    <p class="heading">Europe Tourist Attractions</p>
    <p class="places">London</p>
    <ul style="list-style-type: square;">
        <li>Famous for Buckingham Paclace, the resident of Queen Elizabeth.</li>
        <li>Tower of London.</li>
        <li>Big Ben.</li>
    </ul>
    <a href="TouristAttractions.html">Back</a>
</body>

</html>


#Paris.html


<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="style1.css">
    <title>Tourist Attractions in Europe</title>
</head>

<body>
    <p class="heading">Europe Tourist Attractions</p>
    <p class="places">Paris</p>
    <ul style="list-style-type: square;">
        <li>Louvre Museum.</li>
        <li>The Champ Elysees and Arch du Triomph.</li>
    </ul>
    <a href="TouristAttractions.html">Back</a>
</body>

</html>


#style1.css


.heading{
    text-decoration-line: underline;
    font-family: Arial;
    font-size: x-large;
    font-weight: bold;
    text-transform: uppercase;
}
.general{
    text-align: justify;
    font-style: italic;
}
.places{
    text-decoration-line: underline;
    font-family: cursive;
    font-size: medium;
    text-transform: capitalize;
}
* {
    font-size: small;
    font-family: verdana;
}


#TouristAttractions.html


<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Tourist Attractions in Europe</title>
    <link rel="stylesheet" href="style1.css">
</head>
<body>
    <p class="heading"><b style="font-size: x-large;">E</b>urope <b style="font-size: x-large;">T</b>ourist <b style="font-size: x-large;">A</b>ttractions</p>
    <p class="general">Some of the must visit tourist places in Europe</p>
    <a href="London.html" class="places">London</a><br>
    <a href="Paris.html" class="places">Paris</a><br>
    <a href="Italy.html" class="places">Italy</a>
</body>
</html>



Dương Văn Hoàng [community]
Dương Văn Hoàng

2021-11-13 07:13:02

#TouristAttractions.html



<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="style.css">
    <title>Tourist Attractions in Europe</title>
</head>

<body>
    <p class="heading">Europe Tourist Attractions</p>
    <p class="general">Some of the must visit tourist places in Europe</p>
    <a href="London.html" class="places">London</a><br>
    <a href="Paris.html" class="places">Paris</a><br>
    <a href="Italy.html" class="places">Italy</a>
</body>

</html>

#London.html
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="style.css">
    <title>Tourist Attractions in Europe</title>
</head>

<body>
    <p class="heading">Europe Tourist Attractions</p>
    <p class="places">London</p>
    <ul style="list-style-type: square;">
        <li>Famous for Buckingham Paclace, the resident of Queen Elizabeth.</li>
        <li>Tower of London.</li>
        <li>Big Ben.</li>
    </ul>
    <a href="TouristAttractions.html">Back</a>
</body>

</html>

#Paris.html
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="style.css">
    <title>Tourist Attractions in Europe</title>
</head>

<body>
    <p class="heading">Europe Tourist Attractions</p>
    <p class="places">Paris</p>
    <ul style="list-style-type: square;">
        <li>Louvre Museum.</li>
        <li>The Champ Elysees and Arch du Triomph.</li>
    </ul>
    <a href="TouristAttractions.html">Back</a>
</body>

</html>

#Italy.html
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="style.css">
    <title>Tourist Attractions in Europe</title>
</head>

<body>
    <p class="heading">Europe Tourist Attractions</p>
    <p class="places">London</p>
    <ul style="list-style-type: square;">
        <li>The Vatican.</li>
        <li>Turin has the Ergizio Museum.</li>
        <li>The Leaning Tower of Pisa.</li>
    </ul>
    <a href="TouristAttractions.html">Back</a>
</body>

</html>

#style.css
.heading {
    text-decoration-line: underline;
    font-family: arial;
    font-size: x-large;
    font-weight: bold;
    text-transform: uppercase;
}

.general {
    font-style: italic;
    text-align: justify;
}

.places {
    text-decoration-line: underline;
    font-family: cursive;
    font-size: medium;
    text-transform: capitalize;
}

* {
    font-size: small;
    font-family: verdana;
}



Phạm Ngọc Ninh [C2108L]
Phạm Ngọc Ninh

2021-11-12 14:18:25



.heading{
	text-decoration: underline;
	font-family: arial;
	font-size: x-large;
	font-weight: bold;
	text-transform: uppercase;
	text-transform: capitalize; 
}
.general{
	font-style: italic;
	text-align: justify;
}
.places{
	text-decoration: underline;
	font-family: cursive;
	font-size: medium;
	text-transform: capitalize;
}
ul li{
	font-size: small;
	font-family: verdana;
}



Phạm Ngọc Ninh [C2108L]
Phạm Ngọc Ninh

2021-11-12 14:10:26



<!DOCTYPE html>
<html>
<head>
	<title>Tourist Attractions in Europe</title>
	<link rel="stylesheet" type="text/css" href="dingdang.css">
</head>
<body>
	<h1 class="heading">Europe Tourist Attractions</h1>
	<p><u>Italy</u></p>
	<ul>
		<li>The Vatican.</li>
		<li>Turin has the Ergizio Museum</li>
		<li>The Leaning Tower of Pisa.</li>
	</ul><br/>
	<a href="tourisattrractions.html">Back</a>

</body>
</html>



Phạm Ngọc Ninh [C2108L]
Phạm Ngọc Ninh

2021-11-12 13:53:15





<!DOCTYPE html>
<html>
<head>
	<title>Tourist Attractions in Europe</title>
	<link rel="stylesheet" type="text/css" href="dingdang.css">
</head>
<body>
	<h1 class="heading">Europe Tourist Attractions</h1>
	<p><u>Paris</u></p>
	<ul>
		<li>Louvre Museum.</li>
		<li>The Champs Elusees and Arch du Triomph.</li>
	</ul><br/>
	<a href="tourisattrractions.html">Back</a>

</body>
</html>



Phạm Ngọc Ninh [C2108L]
Phạm Ngọc Ninh

2021-11-12 13:41:19



<!DOCTYPE html>
<html>
<head>
	<title>Tourist Attractions in Europe</title>
	<link rel="stylesheet" type="text/css" href="dingdang.css">
</head>
<body>
	<h1 class="heading">Europe Tourist Attractions</h1>
	<p><u>London</u></p>
	<ul>
		<li>Famous for Buckingham Palace, the ressidence of Queen Elizabeth.</li>
		<li>Tower of London.</li>
		<li>Big Ben.</li>
	</ul><br/>
	<a href="tourisattrractions.html">Back</a>
	
</body>
</html>



London.html