Une brève introduction aux balises de texte, aux balises de lien hypertexte et aux balises d'image en HTML

Cet article vous apporte une brève introduction aux balises de texte, aux balises de lien hypertexte et aux balises d'image en HTML. Il a une certaine valeur de référence. Les amis dans le besoin peuvent s'y référer.

Balise de texte

• Balise de nouvelle ligne -- br
  est une balise unique, ce qui signifie qu'elle n'a pas de balise de fermeture. Fonctionne comme un saut de ligne forcé

段落中的文字<br>段落中的文字<br>段落中的文字<br>

• Ligne de séparation horizontale - hr

Identique à br, également un étiquette unique. Peut être utilisé pour distinguer différents paragraphes ou textes et titres. La largeur et la hauteur de la ligne de séparation peuvent être définies

设置了50%宽度，50像素且右对齐的分割线
<hr>

• Étiquette de texte pré-formatée -- pré

Conserver le format d'origine du texte

<pre class="brush:php;toolbar:false">文本

• Balise d'exposant, balise d'indice-- sup/sub

Le contenu contenu dans la balise et sa balise de fermeture , en fonction de la moitié actuelle de la hauteur du texte est affichée dans le coin supérieur gauche du texte
Le contenu contenu dans la balise et sa balise de fermeture est affiché dans le coin inférieur gauche du texte à la moitié de la hauteur actuelle du texte

<sup>上标文字内容</sup>
<sub>下标文字内容</sub>

• Balise de citation de bloc - blockquote

signifie que le texte qu'il contient est une citation. Habituellement lors du rendu, cette partie du contenu aura une certaine indentation

<blockquote>引用文字</blockquote>

• balises en ligne de texte ordinaires --span

if sans en appliquant des styles à un span, le texte dans l'élément span ne sera pas visuellement différent des autres textes. Néanmoins, l'élément span dans l'exemple ci-dessus ajoute une structure supplémentaire à l'élément p.

Vous pouvez appliquer des attributs d'identification ou de classe aux travées, ce qui peut ajouter une sémantique appropriée et faciliter l'application de styles aux travées.
Il est possible d'appliquer des attributs class ou id au même élément , mais il est plus courant de n'en appliquer qu'un seul. La principale différence entre les deux est que class est utilisé pour des groupes d'éléments (éléments similaires ou peut être compris comme un certain type d'éléments), tandis que id est utilisé pour identifier des éléments individuels et uniques.

<span>文本内容</span>

• Balise de texte normale -- div

Cela signifie que son contenu démarre automatiquement sur une nouvelle ligne. En fait, les sauts de ligne sont le seul comportement de formatage inhérent à

. Des styles supplémentaires peuvent être appliqués via la classe ou l'identifiant de

.

Il n'est pas nécessaire d'ajouter une classe ou un identifiant à chaque

, bien que cela présente certains avantages.

Il est possible d'appliquer des attributs class ou id au même élément

, mais il est plus courant d'appliquer uniquement l'un ou l'autre. La principale différence entre les deux est que class est utilisé pour des groupes d'éléments (éléments similaires ou peut être compris comme un certain type d'éléments), tandis que id est utilisé pour identifier des éléments individuels et uniques.

<div>文本内容</div>

nbsp;html>


    <meta>
    <title>张阿机</title>


<h1>一级标题</h1>
<span>pre显示</span>
<pre class="brush:php;toolbar:false">
<strong>雨霖铃·寒蝉凄切</strong>
宋代：柳永
寒蝉凄切，对长亭晚，骤雨初歇。都门帐饮无绪，留恋处，兰舟催发。执手相看泪眼，竟无语凝噎。念去去，千里烟波，暮霭沉沉楚天阔。
多情自古伤离别，更那堪，冷落清秋节！今宵酒醒何处？杨柳岸，晓风残月。此去经年，应是良辰好景虚设。便纵有千种风情，更与何人说？

bolckquote显示

雨霖铃·寒蝉凄切 宋代：柳永 寒蝉凄切，对长亭晚，骤雨初歇。都门帐饮无绪，留恋处，兰舟催发。执手相看泪眼，竟无语凝噎。念去去，千里烟波，暮霭沉沉楚天阔。 多情自古伤离别，更那堪，冷落清秋节！今宵酒醒何处？杨柳岸，晓风残月。此去经年，应是良辰好景虚设。便纵有千种风情，更与何人说？

求解数学方程x²+x+6=0.
所得解:x₁=-3,x₂=2

Balise de lien hypertexte

Un site Web est composé de plusieurs pages Web, et les pages dépendent de chacune autres Les liens déterminent la relation de navigation entre eux. Ce n'est que lorsque plusieurs pages Web sont reliées entre elles qu'elles forment un site Web.

超链接标签--<a></a>

1. Lien externe

Si le lien pointe hors du dossier du site, on parle de lien externe. Lors de l'ajout d'un lien externe, utilisez un chemin absolu en saisissant directement le chemin. . Adresse, telle que http://www.baidu.com

2. Les liens internes

font référence à la relation de lien entre différentes pages d'un même site Web, qui peut également être appelée intra-. liens de sites. Lors de l’établissement de liens internes, utilisez des chemins relatifs.

Attributs d'hyperlien -- herf
Lors de l'ajout d'un lien hypertexte, les paramètres d'attribut sont très importants.

<a>设置链接的文字或图片等属性</a>

Attributs de l'hyperlien -- cible
Par défaut, la façon dont un lien hypertexte ouvre une nouvelle page est de l'ouvrir dans la fenêtre actuelle, et les attributs peuvent être utilisés pour définir la façon dont la fenêtre cible est ouverte .

_parent--> Ouvrir dans la fenêtre de niveau supérieur, ce qui entraîne le chargement de la page parent
_blank--->le navigateur ouvre la page Web dans une nouvelle fenêtre

<a>设置链接的文字或图片等属性</a>

![clipboard.png](/img/bVbhvZI)
ml>


    <meta>
    <title>Title</title>


<!--a标签-->

<!--1. 跳转到指定的url地址-->
<a> 百度</a>
<a> 百度</a>
<!--新建一个浏览器窗口并打开-->
<a> 百度</a>

<!--2. 跳转到当前页面的指定位置（锚点）-->
<a>下载python</a>
<a>发展历史</a>
<a>风格</a>
<a>与Matlab对比</a>
<a>设计定位</a>

<h1><a>下载python</a></h1>
在您开始之前，在你的计算机将需要Python，但您可能不需要下载它。首先检查(在命令行窗口输入python)有没有安装Python!如果你看到了一个Python解释器的响应，那么就能在她的显示窗口中得到一个版本号。通常较新的版本都可以做到Python的向后兼容。
如果您需要安装， 您不妨下载最近稳定的版本。 就是那个以没有被标记作为alpha或Beta发行的最高的版本。目前最稳定的版本是Python3.0以上
如果你使用的操作系统是Windows：最稳定的Windows版本下载是"Python 2.5 for Windows"
如果你使用的是Mac，MacOS 10.2 (Jaguar), 10.3 (Panther) and 10.4 (Tiger)已经集成安装了Python，但是你大概需要安装最近通用的构架(build)。
对于Red Hat，安装python2和python2-devel包。
对于Debian，安装python2.5和python2.5-dev包
<h1><a>发展历史</a></h1>
自从20世纪90年代初Python语言诞生至今，它已被逐渐广泛应用于系统管理任务的处理和Web编程。
Python的创始人为Guido van Rossum。1989年圣诞节期间，在阿姆斯特丹，Guido为了打发圣诞节的无趣，决心开发一个新的脚本解释程序，作为ABC 语言的一种继承。之所以选中Python（大蟒蛇的意思）作为该编程语言的名字，是因为他是一个叫Monty Python的喜剧团体的爱好者。
ABC是由Guido参加设计的一种教学语言。就Guido本人看来，ABC 这种语言非常优美和强大，是专门为非专业程序员设计的。但是ABC语言并没有成功，究其原因，Guido 认为是其非开标识
放造成的。Guido 决心在Python 中避免这一错误。同时，他还想实现在ABC 中闪现过但未曾实现的东西。
就这样，Python在Guido手中诞生了。可以说，Python是从ABC发展起来，主要受到了Modula-3（另一种相当优美且强大的语言，为小型团体所设计的）的影响。并且结合了Unix shell和C的习惯。
Python已经成为最受欢迎的程序设计语言之一。自从2004年以后，python的使用率呈线性增长。2011年1月，它被TIOBE编程语言排行榜评为2010年度语言。
由于Python语言的简洁性、易读性以及可扩展性，在国外用Python做科学计算的研究机构日益增多，一些知名大学已经采用Python来教授程序设计课程。例如卡耐基梅隆大学的编程基础、麻省理工学院的计算机科学及编程导论就使用Python语言讲授。众多开源的科学计算软件包都提供了Python的调用接口，例如著名的计算机视觉库OpenCV、三维可视化库VTK、医学图像处理库ITK。而Python专用的科学计算扩展库就更多了，例如如下3个十分经典的科学计算扩展库：NumPy、SciPy和matplotlib，它们分别为Python提供了快速数组处理、数值运算以及绘图功能。因此Python语言及其众多的扩展库所构成的开发环境十分适合工程技术、科研人员处理实验数据、制作图表，甚至开发科学计算应用程序。
2018年3月，该语言作者在邮件列表上宣布Python 2.7将于2020年1月1日终止支持。用户如果想要在这个日期之后继续得到与Python 2.7有关的支持，则需要付费给商业供应商。
<h1><a>风格</a></h1>
Python在设计上坚持了清晰划一的风格，这使得Python成为一门易读、易维护，并且被大量用户所欢迎的、用途广泛的语言。
设计者开发时总的指导思想是，对于一个特定的问题，只要有一种最好的方法来解决就好了。这在由Tim Peters写的Python格言（称为The Zen of Python）里面表述为：There should be one-- and preferably only one --obvious way to do it. 这正好和Perl语言（另一种功能类似的高级动态语言）的中心思想TMTOWTDI（There's More Than One Way To Do It）完全相反。
Python的作者有意的设计限制性很强的语法，使得不好的编程习惯（例如if语句的下一行不向右缩进）都不能通过编译。其中很重要的一项就是Python的缩进规则。
一个和其他大多数语言（如C）的区别就是，一个模块的界限，完全是由每行的首字符在这一行的位置来决定的（而C语言是用一对花括号{}来明确的定出模块的边界的，与字符的位置毫无关系）。这一点曾经引起过争议。因为自从C这类的语言诞生后，语言的语法含义与字符的排列方式分离开来，曾经被认为是一种程序语言的进步。不过不可否认的是，通过强制程序员们缩进（包括if，for和函数定义等所有需要使用模块的地方），Python确实使得程序更加清晰和美观。
<h1><a>与Matlab对比</a></h1>
说起科学计算，首先会被提到的可能是MATLAB。然而除了MATLAB的一些专业性很强的工具箱还无法被替代之外，MATLAB的大部分常用功能都可以在Python世界中找到相应的扩展库。和MATLAB相比，用Python做科学计算有如下优点：
● 首先，MATLAB是一款商用软件，并且价格不菲。而Python完全免费，众多开源的科学计算库都提供了Python的调用接口。用户可以在任何计算机上免费安装Python及其绝大多数扩展库。
● 其次，与MATLAB相比，Python是一门更易学、更严谨的程序设计语言。它能让用户编写出更易读、易维护的代码。
● 最后，MATLAB主要专注于工程和科学计算。然而即使在计算领域，也经常会遇到文件管理、界面设计、网络通信等各种需求。而Python有着丰富的扩展库，可以轻易完成各种高级任务，开发者可以用Python实现完整应用程序所需的各种功能。
<h1><a>设计定位</a></h1>
Python的设计哲学是“优雅”、“明确”、“简单”。因此，Perl语言中“总是有多种方法来做同一件事”的理念在Python开发者中通常是难以忍受的。Python开发者的哲学是“用一种方法，最好是只有一种方法来做一件事”。在设计Python语言时，如果面临多种选择，Python开发者一般会拒绝花俏的语法，而选择明确的没有或者很少有歧义的语法。由于这种设计观念的差异，Python源代码通常被认为比Perl具备更好的可读性，并且能够支撑大规模的软件开发。这些准则被称为Python格言。在Python解释器内运行import this可以获得完整的列表。
Python开发人员尽量避开不成熟或者不重要的优化。一些针对非重要部位的加快运行速度的补丁通常不会被合并到Python内。所以很多人认为Python很慢。不过，根据二八定律，大多数程序对速度要求不高。在某些对运行速度要求很高的情况，Python设计师倾向于使用JIT技术，或者用使用C/C++语言改写这部分程序。可用的JIT技术是PyPy。
Python是完全面向对象的语言。函数、模块、数字、字符串都是对象。并且完全支持继承、重载、派生、多继承，有益于增强源代码的复用性。Python支持重载运算符和动态类型。相对于Lisp这种传统的函数式编程语言，Python对函数式设计只提供了有限的支持。有两个标准库(functools, itertools)提供了Haskell和Standard ML中久经考验的函数式程序设计工具。
虽然Python可能被粗略地分类为“脚本语言”（script language），但实际上一些大规模软件开发计划例如Zope、Mnet及BitTorrent，Google也广泛地使用它。Python的支持者较喜欢称它为一种高级动态编程语言，原因是“脚本语言”泛指仅作简单程序设计任务的语言，如shellscript、VBScript等只能处理简单任务的编程语言，并不能与Python相提并论。
Python本身被设计为可扩充的。并非所有的特性和功能都集成到语言核心。Python提供了丰富的API和工具，以便程序员能够轻松地使用C语言、C++、Cython来编写扩充模块。Python编译器本身也可以被集成到其它需要脚本语言的程序内。因此，很多人还把Python作为一种“胶水语言”（glue language）使用。使用Python将其他语言编写的程序进行集成和封装。在Google内部的很多项目，例如Google Engine使用C++编写性能要求极高的部分，然后用Python或Java/Go调用相应的模块。《Python技术手册》的作者马特利（Alex Martelli）说：“这很难讲，不过，2004 年，Python 已在Google 内部使用，Google 召募许多 Python 高手，但在这之前就已决定使用Python，他们的目的是 Python where we can, C++ where we must，在操控硬件的场合使用 C++，在快速开发时候使用 Python。

Balises d'image

Les images graphiques peuvent donner vie à la page Web et donner aux gens une meilleure impression visuelle que le texte.
Les formats d'image couramment utilisés dans les pages Web incluent « jpeg », « jpg », « gif », « png », « bmp », etc.

图像标签 -- <img  alt="Une brève introduction aux balises de texte, aux balises de lien hypertexte et aux balises d'image en HTML" >

Pour afficher une image sur la page, vous devez utiliser son attribut 'src', qui est l'abréviation de 'source'.

<img  alt="Une brève introduction aux balises de texte, aux balises de lien hypertexte et aux balises d'image en HTML" >

Attributs du fichier source -- alt

est utilisé pour afficher un texte interactif pour l'image, qui peut être personnalisé par l'utilisateur. Lorsque le navigateur ne charge pas complètement l'image ou ne parvient pas à se charger, le contenu textuel interactif s'affiche à la place de l'image.

<img  alt="Une brève introduction aux balises de texte, aux balises de lien hypertexte et aux balises d'image en HTML" >

Alignement des images et du texte --align
L'alignement des images dans les paragraphes de texte comprend l'alignement à gauche et l'alignement à droite. L'alignement des images dans une seule ligne de texte est Il existe trois types de. alignement supérieur, alignement central et alignement inférieur.

<img  alt="Une brève introduction aux balises de texte, aux balises de lien hypertexte et aux balises d'image en HTML" >

nbsp;html>


    
    



<img  alt="Une brève introduction aux balises de texte, aux balises de lien hypertexte et aux balises d'image en HTML" >
  昙花（学名：Epiphyllum oxypetalum  （DC.）Haw ）：附生肉质灌木，高2-6米，老茎圆柱状，木质化。分枝多数，叶状侧扁，披针形至
    长圆状披针形，边缘波状或具深圆齿，基部急尖、短渐尖或渐狭成柄状，深绿色，无毛，中肋粗大，老株分枝产生气根。花单生于枝侧的小窠，漏斗状，于夜间开放，芳香，长25-30厘米，直径10-12厘米；花托绿色，略具角，被三角形短鳞片；瓣状花被片白色，倒卵状披针形至倒卵形，长7-10厘米，宽3-4.5厘米，边缘全缘或啮蚀状。浆果长球形，具纵棱脊，无毛，紫红色。种子多数，卵状肾形，亮黑色，具皱纹，无毛。





<img  alt="Une brève introduction aux balises de texte, aux balises de lien hypertexte et aux balises d'image en HTML" >
  生长地海拔1000-1200米。喜温暖湿润的半阴、温暖和潮湿的环境，不耐霜冻，忌强光暴晒。昙花享有“月下美人”之誉。当花渐渐展开后，过1-2小时又慢慢地枯萎了，整个过程仅4个小时左右。故有“昙花一现”之说。世界各地区广泛栽培；中国各省区常见栽培。





昙花图片：<img  alt="Une brève introduction aux balises de texte, aux balises de lien hypertexte et aux balises d'image en HTML" >

以上就是本篇文章的全部内容，关于HTML的相关知识大家可以参考PHP中文网的HTML开发手册进行学习。

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!