1. Qu'est-ce que le HTML ?
HTML (Hyper Text Markup Language), c'est-à-dire Hyper Text Markup Language. En termes simples, c'est le langage de base pour la production de pages Web. Il s'agit d'un langage de balisage qui décrit les pages Web via un balisage. Chaque page Web peut être composée de plusieurs éléments de page Web (tels que du texte, des images, des vidéos, de l'audio, etc.). La fonction principale du HTML est d'organiser le texte, les images, l'audio, la vidéo et autres informations de contenu et de format saisies par l'utilisateur pour former un document de page Web, qui est analysé et restitué par le navigateur et finalement présenté à l'utilisateur.
2. Balises HTML
Les balises HTML sont le concept de base du HTML. Ce sont des commandes placées entre crochets qui indiquent au navigateur comment afficher le texte. Les balises HTML incluent une balise de début (par exemple, <head>
), une balise de fin (par exemple, </head>
) ou une balise unique (pour exemple, <img>).
<head>
)、结束标签(例如</head>
)或单个标签(例如<img>
)。
在编写 HTML 时,必须遵循以下规则:
<tag>
和结束标签</tag>
中闭合。对于单个标签,可以使用自闭合标签<tag />
来表示。<html>
标签是根标签,表示整个 HTML 文档的开始。在所有 HTML 元素中必须包含 <html>
标签。<head>
和<body>
标签。<head>
标签包含文档的元数据,如文档的标题,关键字等。<body>
标记包含可见的页面内容,如文本、图像等。以下是一个HTML模板示例:
<!DOCTYPE html> <html> <head> <title>标题</title> </head> <body> <h1>标题 1</h1> <p>这是一个段落。</p> </body> </html>
三、CSS
CSS (Cascading Style Sheets),即层叠样式表,是一个描述网页样式和布局的语言。它与HTML一起用于创建美观的网页。CSS 可以控制诸如字体、颜色、背景、边框和布局等方面的网页显示。
在HTML中嵌入CSS样式有两种方式:内部样式和外部样式。
内部样式是在页面代码的<head>
标签中添加CSS代码样式,例如:
<!DOCTYPE html> <html> <head> <title>标题</title> <style> h1 { color: blue; font-family: Arial; } </style> </head> <body> <h1>标题 1</h1> <p>这是一个段落。</p> </body> </html>
外部样式表是将样式规则添加到外部文件中,例如:
在样式文件style.css中:
h1 { color: blue; font-family: Arial; }
在HTML页面中添加外部样式:
<!DOCTYPE html> <html> <head> <title>标题</title> <link rel="stylesheet" type="text/css" href="style.css"> </head> <body> <h1>标题 1</h1> <p>这是一个段落。</p> </body> </html>
四、JavaScript
JavaScript 是一种用于控制 HTML 内容,以及使网页交互和动态的脚本语言。它可以被用于与用户的交互,如表单验证、图像切换,动态更新页面等等。
在HTML页面中嵌入JavaScript有两种方式:内部脚本和外部脚本。
内部脚本是在页面代码的<head>
或<body>
中添加 JavaScript 代码,例如:
<!DOCTYPE html> <html> <head> <title>标题</title> <script> function sayHello() { alert("Hello!"); } </script> </head> <body> <button onclick="sayHello()">点击这里</button> </body> </html>
外部脚本是将脚本代码添加到外部文件中,例如:
在脚本文件script.js中:
function sayHello() { alert("Hello!"); }
在HTML页面中添加外部脚本:
<!DOCTYPE html> <html> <head> <title>标题</title> <script src="script.js"></script> </head> <body> <button onclick="sayHello()">点击这里</button> </body> </html>
五、制作一个HTML页面
以下是一个简单的 HTML 页面制作步骤:
.html
<tag>
et la balise de fermeture </tag>
Fermé au milieu. Pour une seule balise, vous pouvez utiliser la balise à fermeture automatique <tag />
. La balise <html>
est la balise racine, indiquant le début de l'ensemble du document HTML. La balise <html>
doit être incluse dans tous les éléments HTML. Chaque page HTML doit contenir les balises <head>
et <body>
. La balise <head>
contient les métadonnées du document, telles que le titre du document, les mots-clés, etc. La balise <body>
contient le contenu visible de la page, tel que du texte, des images, etc. En HTML, les balises et les attributs ne sont pas sensibles à la casse, mais il est recommandé d'utiliser des lettres minuscules pour améliorer la lisibilité du code. <!DOCTYPE html> <html> <head> <title>我的HTML页面</title> <style> body { background-color: #f2f2f2; font-family: Arial; } h1 { color: #009900; font-size: 36px; text-align: center; margin-top: 50px; } </style> <script> function sayHello() { alert("Hello!"); } </script> </head> <body> <h1>欢迎访问我的HTML页面</h1> <button onclick="sayHello()">点击这里</button> </body> </html>
<head>
du code de la page, par exemple : 🎜rrreee 🎜Les feuilles de style externes permettent d'ajouter des règles de style aux fichiers externes, par exemple : 🎜🎜Dans Dans le fichier de style style.css : 🎜rrreee🎜 Ajoutez des styles externes à la page HTML : 🎜rrreee🎜 4. JavaScript🎜🎜JavaScript est un langage de script utilisé pour contrôler le contenu HTML et rendre les pages Web interactives et dynamiques. Il peut être utilisé pour l'interaction avec les utilisateurs, comme la validation de formulaires, le changement d'image, la mise à jour dynamique des pages, etc. 🎜🎜Il existe deux manières d'intégrer du JavaScript dans des pages HTML : un script interne et un script externe. 🎜🎜Le script interne consiste à ajouter du code JavaScript dans <head>
ou <body>
du code de la page, par exemple : 🎜rrreee🎜Le script externe consiste à ajouter un script coder Dans un fichier externe, par exemple : 🎜🎜 Dans le fichier script script.js : 🎜rrreee🎜 Ajoutez un script externe à la page HTML : 🎜rrreee🎜 5. Créez une page HTML 🎜🎜Ce qui suit est une simple page HTML étapes de production : 🎜🎜Ouvrez un éditeur de texte tel que Notepad ou Sublime Text. 🎜🎜Créez un nouveau fichier texte et enregistrez-le au format de fichier .html
. 🎜🎜Écrivez du code HTML, y compris la déclaration du type de document, les balises d'éléments HTML et le contenu. 🎜🎜Ajoutez des styles CSS pour contrôler l'apparence et le style de vos pages Web. 🎜🎜Ajoutez des scripts JavaScript pour contrôler l'interactivité et la dynamique des pages Web. 🎜🎜Ouvrez le fichier HTML avec un navigateur pour prévisualiser et tester la page. 🎜🎜🎜Par exemple, voici un exemple de page HTML contenant CSS et JavaScript : 🎜rrreee🎜 6. Résumé 🎜🎜HTML est le langage de base pour la production de pages Web, utilisé pour décrire et présenter le contenu des pages Web. CSS et JavaScript peuvent améliorer l'apparence et l'interactivité des pages Web, les rendant ainsi plus attrayantes. Créer une page HTML nécessite de suivre les règles des balises HTML, d'ajouter des styles et des scripts, et enfin de la tester dans le navigateur. En apprenant HTML, CSS et JavaScript, vous pouvez acquérir des connaissances de base en développement front-end et établir une base solide pour la conception et le développement Web. 🎜Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!