HTML+CSS Balises HTML de base pour une saisie facile (1)

Commentaires en html

Il existe de nombreuses balises HTML. Vous pouvez vous référer au manuel. Ensuite, nous expliquerons certaines des balises que nous utilisons couramment

Tout d'abord, parlons du paragraphe de la balise P (p)

<!DOCTYPE html>
<html>
<head>
	<title></title>
</head>
<body>
		<p>大家好</p>
</body>
</html>

Ensuite, nous allons parcourir Exécuter sur l'ordinateur, le résultat est : Bonjour à tous

Regardez le code suivant :

<!DOCTYPE html>
<html>
<head>
	<title></title>
</head>
<body>
		<p>大家好</p>
		<p>大家好！</p>
</body>
</html>

Le paragraphe s'enroulera tout seul, donc le résultat est :

Bonjour à tous

<meta>----- est une balise auxiliaire dans la balise head, généralement utilisée pour définir l'encodage , et optimiser les mots-clés pour la promotion, etc.

<br> -------Saut de ligne

<font> ---------Formater le texte

<table>------Tableau

<span> ------Balise en ligne

Conseils et notes :

Conseil : utilisez <span> pour regrouper les éléments en ligne afin de les formater avec des styles.

Remarque : span n'a pas de représentation au format fixe. Cela ne change visuellement que lorsque vous lui appliquez un style.

<h1> à <h6>-----Contrôler la taille de la police

<div>----- --Diviser le document en parties indépendantes et différentes (nous l'expliquerons lorsque nous apprendrons le CSS)

<hr>-------Titre et titre séparés par des lignes horizontales Paragraphe

Ensuite, expliquons d'abord ces balises simples

Le code suivant :

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title></title>
</head>
<body>
		<p>大家好<span>123456</span></p>
		<p>大家好</p>
		
		111111111111111<br>1111111111111111 <!--换行-->

		<hr>  <!--用来和以上隔开，有一条黑色的直线-->

		<font size='18' color="red">我们都一样</font>   <!--font设置字体大小，颜色-->

		<hr>

		<h1>中国</h1>
		<h2>中国</h2>
		<h3>中国</h3>
		<h4>中国</h4>
		<h5>中国</h5>
		<h6>中国</h6>

</body>	
</html>

Tout le monde copie le code sur votre ordinateur, créez un fichier avec le suffixe .html puis Double-cliquez pour prévisualiser le

Table

Veuillez consulter le code suivant :

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title></title>
</head>
<body>
		<table>
			<tr>
				<th>美国</th>
				<th>日本</th>
				<th>中国</th>
			</tr>

			<tr>
				<td>123</td>
				<td>456</td>
				<td>789</td>
			</tr>

			<tr>
				<td>123</td>
				<td>456</td>
				<td>789</td>
			</tr>
		</table>
</body>
</html>

Le tableau est composé de lignes et de colonnes. Pour être précis, il ne peut pas être appelé colonnes, il ne peut être appelé que des cellules

La balise <tr> <td> représente les cellules. Mais nous prévisualisons Il est affiché sous forme de tableau, il est donc appelé 3 lignes et 3 colonnes

<th> pour les titres. Par exemple, nous faisons un planning hebdomadaire du lundi au dimanche. Ces mots doivent être en gras, etc.

Le code ci-dessus exécute les résultats :

États-Unis Japon Chine

123 456 789

Nous ne sommes pas habitués à voir un tel tableau, alors permettez-moi d'ajouter une bordure au tableau

dans le code ci-dessus . On ajoute border='1' à la balise table puis on ajoute une largeur et une hauteur au tableau width="300" height="200"

Le code spécifique est le suivant :

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title></title>
</head>
<body>
		<table border="1" width="300" height="200">
			<tr>
				<th>美国</th>
				<th>日本</th>
				<th>中国</th>
			</tr>

			<tr>
				<td>123</td>
				<td>456</td>
				<td>789</td>
			</tr>

			<tr>
				<td>123</td>
				<td>456</td>
				<td>789</td>
			</tr>
		</table>
</body>
</html>

Formation continue

nouveau fichier

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> </head> <body> <table border="1" width="300" height="200"> <tr> <th>美国</th> <th>日本</th> <th>中国</th> </tr> <tr> <td>123</td> <td>456</td> <td>789</td> </tr> <tr> <td>123</td> <td>456</td> <td>789</td> </tr> </table> </body> </html>

soumettre Réinitialiser le code

Opération automatique

HTML+CSS Balises HTML de base pour une saisie facile (1)

ÉlémentaireTutoriel de site Web d'imitation d'entreprise Imperial CMS

ÉlémentaireLes débutants sans aucune base dans WordPress créent des blogs personnels et des sites Web d'entreprise

ÉlémentaireVidéo d'instructions sur la création de sites Web à base zéro Ultimate CMS

ÉlémentaireProjet front-end-Shangyou [Pratique complète de la technologie HTML/CSS/JS]

IntermédiaireVue3.0 de 0 pour créer une pratique de projet de système de gestion backend universel

ÉlémentaireCours frontal base zéro [Vue apprentissage avancé et application pratique]

ÉlémentaireTutoriel WEB front-end [HTML5+CSS3+JS]

ÉlémentaireIntroduction rapide à apipost

IntermédiaireTutoriel pratique Vue3+TypeScript au niveau de l'entreprise

ÉlémentaireParlons brièvement de la création d'une entreprise en PHP

IntermédiaireProjet de commerce électronique VUE (combat réel de projet double front-end et back-end)

ÉlémentaireApplication pratique Apipost [api, interface, tests automatisés, mock]