0% ont trouvé ce document utile (0 vote)
32 vues19 pages

Création de sites web avec HTML5

Ce manuel présente les bases de la création de sites web interactifs en utilisant HTML5 et CSS3. Il couvre la structure d'un document HTML, les balises essentielles, ainsi que l'application de styles CSS pour la mise en forme. Des exemples pratiques illustrent l'utilisation des balises HTML et des propriétés CSS pour concevoir des pages web attrayantes.

Transféré par

sofienmsk2005
Copyright
© All Rights Reserved
Nous prenons très au sérieux les droits relatifs au contenu. Si vous pensez qu’il s’agit de votre contenu, signalez une atteinte au droit d’auteur ici.
Formats disponibles
Téléchargez aux formats PDF, TXT ou lisez en ligne sur Scribd
0% ont trouvé ce document utile (0 vote)
32 vues19 pages

Création de sites web avec HTML5

Ce manuel présente les bases de la création de sites web interactifs en utilisant HTML5 et CSS3. Il couvre la structure d'un document HTML, les balises essentielles, ainsi que l'application de styles CSS pour la mise en forme. Des exemples pratiques illustrent l'utilisation des balises HTML et des propriétés CSS pour concevoir des pages web attrayantes.

Transféré par

sofienmsk2005
Copyright
© All Rights Reserved
Nous prenons très au sérieux les droits relatifs au contenu. Si vous pensez qu’il s’agit de votre contenu, signalez une atteinte au droit d’auteur ici.
Formats disponibles
Téléchargez aux formats PDF, TXT ou lisez en ligne sur Scribd

Manuel de systèmes & technologies de l’informatique

4ème Sciences de l’informatique

Module 1 :
Créer un site web interactif
1. Créer des documents web en utilisant HTML5 :
La structure générale d’un document web :
Pour un document web on trouve plusieurs structures chacun son choix :

<!DOCTYPE html>
<html lang="fr">
<head>
<!--Encodage des caractères-->
<meta charset='utf-8'>
<!--Actualiser le document toutes les 30 secondes-->
<meta http-equiv='refresh' content='30'>
<!--Définissez une description de votre page Web-->
<meta name="description" content="Cours HTML et CSS">
<!--Définissez des mots-clés pour les moteurs de recherche-->
<meta name="keywords" content="html,css">
<!--Définir l'auteur d'une page-->
<meta name="author" content="Ibnou SINA">
<!--Configuration de la fenêtre d'affichage-->
<meta name='viewport' content='width=device-width, initial-scale=1'>
<!--Définir un titre pour la page-->
<title>Page Title</title>
<!--charger un lien vers un fichier css nommé main-->
<link rel='stylesheet' type='text/css' media='screen' href='[Link]'>
<!--charger un lien vers un fichier javascipt nommé main-->
<script src='[Link]'></script>
</head>
<body>
<!-- Le contenu de la page -->
</body>
</html>

46
Manuel de systèmes & technologies de l’informatique
4ème Sciences de l’informatique

Rappel des balises HTML5

Balise Exemple Résultat


<p> <p> Bonjour </p> Bonjour
Paragraphe <p> Hello </p> Hello
<hn> <h1>Bonjour</h1> Bonjour
Titre de niv. 1 à 6 <h4>Bonjour</h4> Bonjour
<em>
Italique <em>Bonjour</em> Bonjour
<strong>
Gras <strong>Bonjour</strong> Bonjour
<mark>
<mark> Bonjour </mark> Bonjour
Surbrillance
<ul> <ul>
Liste non ord <li>Fraises</li> • Fraise
<li> <li>Framboises</li> • Framboise
Elément de liste </ul>
<ol> <ol>
Liste ordonnée <li>Fraises</li> 1. Fraise
<li> <li>Framboises</li> 2. Framboise
Elément de liste </ol>

<a> <a href="[Link]" target="[Link]"


Lien hypertexte title="cliquer ici">MENU </a>

<img> <img src="photos\[Link]" alt="photo de


Image nature" title="belle photo"/>

<audio> <audio src="son.mp3" controls autoplay loop>


Son </audio>

<vidéo> <video src="[Link]" controls


Vidéo ou film poster="[Link]"></video>

<figure> <figure>
Figure <img src="[Link]"
<figcaption> <figcaption>Eléphan</figcaption>
Titre de figure </figure>
<table>
<table border="1">
Tableau
<caption>Client</caption>
<tr>
<tr> <th>Nom</th> <th>Age</th>
Ligne du tableau
</tr>
<th>
<tr> <td>ali</td> < td>33</td>
Cellule entête
</tr>
<td>
<tr> <td>Sonia</td> <td>26 </td>
Cellule donnée
</tr>
<caption>
Titre du tableau </table>

47
Manuel de systèmes & technologies de l’informatique
4ème Sciences de l’informatique

<form> <form name="f" method="post"> </form> Post : envoyer les données par http
Formulaire <form name="f" method="get"> </form> Get : envoyer les données par URL
<input type="text" name="pseudo"
placeholder ="Ex: Zazor" size="30"
maxlength="10">
<input type="password">

<input type="tel" placeholder="216666333">


<input type="number" min="100" max="999
>
<input type="color" >
<input type="image" alt="Login"
src="[Link]">
<input type="email" >

<input type="button" value "envoie" >

<input type="time" >


<input>
Saisie <input type="date" >
<input type="checkbox" name="frites" />
Frites <br/>
<input type="checkbox" name="steak" />
Steak haché <br/>
<input type="radio" name="repas" /> Frites
<br/>
<input type="radio" name=" repas " /> Steak
haché <br/>
<input type="range" name="volume" min="0"
max="11">
<input type="reset" value="Reset">

<input type="submit" value="Submit">


<input type="url"
name="url"placeholder="[Link]
size="30" >
<input list="browsers" >
Input <datalist id="browsers">
Datalist <option value="Edge">
Option <option value="Firefox">
Liste déroulante <option value="Chrome">
</datalist>
textarea <textarea name="story" rows="5"
Texte multiligne cols="33"><texteara>

48
Manuel de systèmes & technologies de l’informatique
4ème Sciences de l’informatique

<select name="pays" >


<select> <option value="it">Italie</option>
<option> <option value="tn">Tunisie</option>
Liste déroulante <option value="ca">Canada</option>
</select>
<fieldset>
Zone de <fieldset>
formulaire <legend> Vos coordonnées </legend>
<legend> </fieldset>
Légende de zone
<hr>
Ligne <hr>
horizontale
<details>
<details>
ce cours est généal.
Zone détails </details>
<details>
< details>
<summary>Cilquer ici</summary>
<summary>
Ce cours est génial.
Entête de détails </details>
<cite> <cite>Celui qui sait commander trouve
Citation toujours ceux qui doivent obéir</cite>
<address>
<adresse>
Lycée IBN SINA 4070 M’saken Lycée IBN SINA 4070 M’saken
Adresse </address>
Onblur
Onclik
Onfocus
Oninput <input type="button" value="Calculer"
Onload onclick="factorielle()"> En cliquant sur Calculer, on appelle
Onmouseover la fonction factorielle.
Onsubmit
Evénement

Activité récapitulative : Activité 1


2. Appliquer des styles CSS3 dans un site web :
Pour appliquer des mises en forme dans le document HTML on a 3 cas, le 1er on applique
la mise en forme au sein de la balise concernée, le 2 ème on utilise la balise <style> dans
la partie <head> et le 3ème qui est le plus conseillé consiste à d’utiliser un fichier externe
CSS qui contient les mises en forme et prévoir un lien avec le document HTML pour
appliquer ces mises en forme sur les documents Web.
Rappel des Codes CSS3 :
On applique la couleur rouge à la police du paragraphe :
1er cas : <p style= "color : red ;" > </p> 3ème cas : [Link]
2ème cas : <head> P{
<style>
color : red ;
p { color : red;}
</style> }
</head>

49
Manuel de systèmes & technologies de l’informatique
4ème Sciences de l’informatique

Syntaxe :

Appliquer un style Exemple en CSS


Appliquer un style a une seule balise h1{ }
Sélectionner plusieurs balises au même temps h1, em{ }
Une balise contenue dans une autre h3 em { }
Utiliser l'attribut class HTML CSS
➔ on peut utiliser classe plusieurs fois dans <h1 class="cl"> </h1> .cl { }
html <p class="cl"> </p>
Utiliser l'attribut id HTML CSS
➔ on utilise id une seule fois dans html <img id="im"> #im { }

* sélectionner toutes les balises * { }


Les unités en CSS
Les unités absolues :

Exemple
Les unités absolues en CSS
L’élément box aura la même
px Pixels .box { dimension (150 x 150 pixels),
in (inch) Pouces width : 150 px ; quelle que soit la taille de
l’écran.
cm Centimètres height : 150 px ;

mm Millimètres

50
Manuel de systèmes & technologies de l’informatique
4ème Sciences de l’informatique

Les unités relatives :


Les unités relatives en CSS
Ou cadratin, unité proportionnelle à la taille de la police de l’élément parent ou du
em
document
rem L’unité rem fait toujours référence à la taille de la police de l’élément racine.
ex Cette unité est relative à la hauteur de la police actuelle en minuscule.
ch Cette unité est elle aussi peu utilisée, elle est relative à la largeur du caractère “0”.
% Relatives à la dimension du conteneur parent.
xx-small, x-small, small, medium, large, x-large, xx-large
Par défaut, 1 em = 16 px si aucune taille de police n’est définie.
Exemple
.box { Le pourcentage fera référence à la largeur calculée de
l'élément parent de la boîte. Ici l’élément box prend 50% de la
width : 50%;
taille de son élément conteneur.
Height: 50%;
Les propriétés de CSS3

Propriété Exemple Affichage


font-size font-size: 14px; Bonjour
font-family: Impact, "Arial Black", Bonjour
font-family
Arial;
font-style font-style: italic; Bonjour
font-style: normal; Bonjour
font-weight: bold; Bonjour
font-weight font-weight: bolder; Bonjour
font-weight: lighter; Bonjour
text-decoration: blink; (clignotte)
text-decoration: underline; Bonjour
text-decoration Bonjour
text-decoration: line-through;
text-decoration: none; Bonjour
text-align:center; Bonjour
text-align:left; Bonjour
text-align Bonjour
text-align:rigth;
text-align:justify; Bonjour
text-transform: capitalize; Bonjour (1ère lettre en majuscule)
text-transform text-transform: uppercase; BONJOUR
text-transform: lowercase; bonjour
Coler:red; Bonjour
color:#000FFF; Bonjour
color
color:rgb(122, 214, 128); Bonjour

background-image:
background-image
url("[Link]");

51
Manuel de systèmes & technologies de l’informatique
4ème Sciences de l’informatique

background-color background-color: blue;

background-repeat:repeat;

background-repeat:repeat-x;

background-repeat
background-repeat:repeat-y;

background-repeat:no-repeat;

background-size:cover;

background-size

background-size: 200px 100px;


background-repeat: no-repeat;

filter: blur(5px);

filter filter: grayscale(80%);

filter:invert(75%);

table-layout table-layout: auto;

border-collapse: border-collapse: collapse;

52
Manuel de systèmes & technologies de l’informatique
4ème Sciences de l’informatique

border-collapse: separate;

Width width: 150px;


height height:50px;

border-color: red;

border-color
border-color: red yellow blue
green;

border-radius: 30px;

border-radius border-radius: 25% 10%;

border-radius: 10% / 50%;

border-style border-style: dotted;

border-width: thick;
thick:large thin:mince
medium : moyen
border-width
border-width: 0 4px 8px 12px;

Position position: static;

(par défaut)
Définit la façon dont
un élément est position: fixed;
positionné dans un
document. position: relative;
Les propriétés top: 20px; left: 40px;
✓ top, (Décalé, par rapport à lui-même)

53
Manuel de systèmes & technologies de l’informatique
4ème Sciences de l’informatique

✓ right, position: absolute;


✓ bottom top: 20px; left: 40px;
✓ left Il est positionné par rapport à son
déterminent ancêtre le plus proche, aucun
l'emplacement final de espace n'est créé pour l'élément sur
l'élément positionné la page
position: sticky;
top: 100px;
la boîte est décalée par rapport à
son ancêtre de défilement le plus
proche
padding: 1em;

/* On applique la même valeur aux


quatre côtés */

Padding padding: 10% 0;

/* vertical | horizontal */
Ou bien :
✓ padding-right
✓ padding-top padding: 10px 50px 20px;
✓ padding-bottom
✓ padding-left /* haut | horizontal | bas */

padding: 10px 50px 30px 0;

/* haut | droit | bas |gauche */

Margin
Ou bien : margin: 10px 50px 20px 0;
✓ margin-right
✓ margin -top /* haut | droit | bas |gauche */
✓ margin -bottom Meme propriété que padding
✓ margin -left
text-shadow: red 1px 0 10px;
text-shadow /* color | offset-x | offset-y | blur-
radius */

box-shadow box-shadow: 10px 5px 5px red;

box-shadow: 3px 3px red,


box-shadow
-1em 0 .4em olive;

overflow overflow: visible;

54
Manuel de systèmes & technologies de l’informatique
4ème Sciences de l’informatique

overflow: hidden;

overflow: scroll;

overflow: auto;

opacity opacity: 0.33;

list-style-type: circle;

list-style-type list-style-type: upper-roman;

list-style-type:lower-alpha;

list-style-position: inside;
list-style-position
list-style-position: outside;

list-style-image list-style-image: url("[Link]");

a:hover (Quand la
souris est sur le lien)
a
a:active (au moment
{color: red;}
du clic)
a:hover
a:visited (après avoir
{color: green;}
visité le lien)
a:link (lien non visité)

: rotate(45deg);

transform transform: skew(15deg, 15deg);

Transform:translate(-50%,-50%)

55
Manuel de systèmes & technologies de l’informatique
4ème Sciences de l’informatique

HTML
<img src=" [Link]" id="chat" />
CSS
Transition #chat
{width: 250px;
height: 250px;
border-radius: 20% 0% 20% 0%;
transition-property: all;
transition-duration: 2s;
transition-delay: 1s;
}
#chat:hover
{border-radius: 0% 20% 0% 20%;
opacity: 0.2;}

56
Manuel de systèmes & technologies de l’informatique
4ème Sciences de l’informatique

3. Manipulation du langage de script PHP :


Syntaxe de base du PHP :
Pour que le script soit interprété par le serveur, 4 conditions sont nécessaires :
• Le fichier contenant le code doit avoir l'extension telle ".php"
• Le code PHP contenu dans le code HTML doit être délimité par des balises du type
< ? php et ? >
• Le fichier php doit être enregistré dans le répertoire : "www"
• Le fichier php ne sera exécuté qu'à travers son adresse web (utiliser l'option web local).
A NE PAS FAIRE :
aller dans le répertoire www puis dans le répertoire correspondant à votre projet et
double cliquer sur votre page d'exemple ; Vous obtiendrez à coup sûr une page d'erreur.
Structure de données du PHP :
Les constantes :
• Pour définir une constante, on fait appel à la fonction define () :
Syntaxe :
define (nom_constante, valeur_constante, insensible_à_la_casse) ;
Le nom de la constante est sensible à la casse.
La valeur de la constante. En PHP 5, doit être une valeur scalaire (entier, nombre
décimal, chaîne de caractères, booléen, ou null) En PHP 7, les valeurs tableau sont
aussi autorisé.
Exemple 1 :
define ("CONSTANT", "Bonjour le monde.");
echo CONSTANT; // affiche "Bonjour le monde."
echo Constant; // affiche "Constant" et émet une alerte
Exemple 2 :
define("GREETING", "Salut toi.", true);
echo GREETING; // affiche "Salut toi."
echo Greeting; // affiche "Salut toi."
Exemple 3 : Fonctionne depuis PHP 7
define('ANIMALS', array('chien','chat','oiseaux'));
echo ANIMALS[1]; // affiche "chat"
• L'opérateur "." permet la concaténation des contenus des objets.
Les variables :
• Php n'impose pas de déclaration explicite des variables avant de les utiliser.
• Pour déclarer une variable, il suffit de la précéder par le signe $ et lui affecter une
valeur.
• Pour manipuler les variables, on distingue les fonctions suivantes :

72
Manuel de systèmes & technologies de l’informatique
4ème Sciences de l’informatique

isset (nom_variable) — Détermine si une variable est déclarée et est différente de null.
Exemple :
$var = '';
if (isset($var)) // Ceci est vrai
settype (nom_variable, type) — Affecte un type à une variable.
Type peut être : ("boolean" ou "bool", "integer" ou "int", "float" ou "double", "string",
"array", "null")
Exemple :
$foo = "5bar"; // chaîne
$bar = true; // booléen
settype($foo, "integer"); // $foo vaut maintenant 5 (integer)
settype($bar, "string"); // $bar vaut maintenant "1" (string)
Gettype (nom_variable) — Retourne le type de la variable
Exemple :
$foo = "5bar"; // chaîne
echo gettype($foo ); // string
Les opérateurs arithmétiques :
Les opérateurs de calcul permettent de modifier mathématiquement la valeur d'une
variable.
Exemple :
Opérateur Dénomination Effet Exemple Résultat (x=7)
+ Addition Ajoute deux valeurs $x + 3 10
- Soustraction Soustrait deux valeurs $x - 3 4
* Multiplication Multiplie deux valeurs $x * 3 21
/ Division Divise deux valeurs $x / 3 2.333333
Affecte une valeur à une
= Affectation $x = 3 Met 3 dans $x
variable
% Modulo Reste de la division entière $x % 3 1

Les opérateurs de comparaison :


Opérateur Dénomination Effet Résultat
== Egalité $x == 3 Retourne 1 si $x est égal à 3, sinon 0
< Inférieur strict $x < 3 Retourne 1 si $x est inférieur à 3, sinon 0
Retourne 1 si $x est inférieur ou égale à 3,
<= Inférieur ou égale $x <= 3
sinon 0
> Supérieur strict $x > 3 Retourne 1 si $x est supérieur à 3, sinon 0
Retourne 1 si $x est supérieur ou égal à 3,
>= Supérieur ou égale $x >= 3
sinon 0
!= Différent $x ! = 3 Retourne 1 si $x est différent de 3, sinon 0

73
Manuel de systèmes & technologies de l’informatique
4ème Sciences de l’informatique

Les opérateurs logiques :


Opérateur Dénomination Effet Syntaxe
Un des conditions est
|| ou OR Ou logique ((codition1)|| (codition2))
réalisée
Toutes les conditions
&& ou AND Et logique ((codition1) && (codition2))
sont réalisées
Une condition est
XOR Ou Exclusif ((codition1) XOR (codition2))
réalisée
Inverse l’état de la
! Non logique ( ! condition)
variable booléenne

Les entrées/sorties :
✓ Pour entrer des données à une page php vous pouvez :
o Récupérer les données depuis un formulaire on utilisant les tableaux prédéfinis
$_GET['nom_objet'] ou $_POST['nom_objet'] suivant la méthode utilise lors de la
déclaration du formulaire.
o Récupérer les données à travers les paramètres envoyés vers la première page
[Link] & var2=val2...
✓ Pour afficher le contenu d'une variable ou un message, on peut utiliser la méthode
"echo", ou utiliser un objet d'un formulaire :
<input type= "text" name="np" value="< ?php echo($np) ; ?>">
Les structures de contrôle :
Structures conditionnelles :
if … else switch
if (condition) switch (variable)
{ code à exécuter ; } { case valeur1 : liste d’instruction ; break ;
elseif (condition) case valeur2 : liste d’instruction ; break ;
{ code à exécuter ; } ----------------
else case valeurn : liste d’instruction ; break ;
{ code à exécuter ; } default : liste d’instruction ; break ;
}
Exemple : Exemple :
<?php <?php
$t = date("H"); $favcolor = "red";
if ($t < "10") switch ($favcolor) {
case "red":
{echo " bonne matinée!";} echo "Your favorite color is red!"; break;
elseif ($t < "20") case "blue":
{echo "bonjour!";} echo "Your favorite color is blue!";break;
case "green":
else
echo "Your favorite color is green!";break;
{echo "bonne nuit!";} default:
?> echo "Your favorite color is neither red,
blue, nor green!";
}
?>

74
4ème Sciences de l’informatique
Manuel de systèmes & technologies de l’informatique

Structures itératives :
For
for (init compteur ; condition compteur ; incrémenter compteur)
{
Liste d'instructions
}
Exemple :
<?php
for ($x = 0; $x <= 100; $x+=10)
{ echo "The number is: $x <br>"; }
?>
While Do … while
while (condition est vrai) do
{ {
Liste d'instructions Liste d'instructions
} } while (condition est vrai)
Exemple : Exemple :
<?php <?php
$x = 1; $x = 1;
while($x <= 5) { do {
echo "The number is: $x <br>"; echo "The number is: $x <br>";
$x++; $x++;
} } while ($x <= 5);
?> ?>

Les fonctions mathématiques :


abs (nb) : renvoie la valeur absolue (positive) d'un nombre.
Exemple :
<?php
echo(abs(-6.7) . "<br>"); // retourne 6.7
echo(abs(-3) . "<br>"); // retourne 3
?>
rand () ou rand (min , max) : génère un entier aléatoire.
Exemple :
<?php
echo(rand() . "<br>"); // retourne 765439807
echo(rand() . "<br>"); // retourne 12344

echo(rand(10,100)); // retourne 67
?>

75
4ème Sciences de l’informatique
Manuel de systèmes & technologies de l’informatique

round(nb) : arrondit le nombre nb à virgule flottante.


Exemple :
<?php
echo(round(0.60) . "<br>"); // retourne 1
echo(round(0.50) . "<br>"); // retourne 1
echo(round(0.49) . "<br>"); // retourne 0
echo(round(-4.40) . "<br>"); // retourne -4
echo(round(-4.60)); // retourne -5
?>
sqrt (nb) : renvoie la racine carrée du nombre nb.
Exemple :
<?php
echo(sqrt(0) . "<br>"); // retourne 0
echo(sqrt(1) . "<br>"); // retourne 1
echo(sqrt(9) . "<br>"); // retourne 3
echo(sqrt(0.64) . "<br>"); // retourne 0.8
echo(sqrt(-9)); // retourne NAN
?>
Les fonctions sur type chaine :
"." : pour concaténer deux chaines. Une chaine est une suite de caractères entre "" ou ''
chr (ASCII) : renvoie un caractère à partir de la valeur ASCII spécifiée.
Exemple :
<?php
echo chr(65) . "<br>"; // retourne "A"
?>
ord (ch) : renvoie la valeur ASCII du premier caractère d'une chaîne.
Exemple :
<?php
echo ord("A")."<br>"; // retourne 65
echo ord("Ahmed")."<br>"; // retourne 65
?>
strpos(Source, ch, [start] ) : trouve la position de la première occurrence de chaîne ch à
l'intérieur de la chaîne Source en commençant de la position start (optionnel, par défaut
0). Cette fonction est sensible à la casse.
Exemple :

<?php
echo strpos("I love php, I love php too!","php"); // retourne 7
?>

76
4ème Sciences de l’informatique
Manuel de systèmes & technologies de l’informatique

strtoupper (ch) convertit la chaîne ch en majuscule.


Exemple :
<?php
echo strtoupper("Hello WORLD!"); // retourne "HELLO WORLD!"
?>
strtolower (ch) convertit la chaîne ch en minuscule.
Exemple :
<?php
echo strtolower("Hello WORLD."); // retourne "hello world."
?>
strcmp (ch1, ch2) compare deux chaînes, elle est sensible à la casse.
Si elle retourne : 0 les deux chaines sont égales
> 0 ch1 est supérieur à ch2.
< 0 ch1 est inférieur à ch 2.
Exemple :
<?php
echo strcmp("Hello world!","Hello world!"); // 0  les deux chaines sont égales
echo strcmp("Hello world!","Hello"); // 7  ch1 est supérieure à ch2
echo strcmp("Hello world!","Hello world! All!"); // -5  ch1 est inférieure à ch2
?>
substr (source, début, [taille]) : copy la sous chaîne de $source à partir de la position
$début et de longueur $taille.
Si début est positif en commence du début sachant que le 1er caractère a l’indice 0.
Si taille est omise en copie jusqu’à la fin.
Si début est négatif en commence de la fin.
Exemple 1 :
<?php
$rest = substr("abcdef", -1); // retourne "f"
$rest = substr("abcdef", -2); // retourne "ef"
$rest = substr("abcdef", -3, 1); // retourne "d"
?>
Exemple 2 :

<?php
$rest = substr("abcdef", 0, -1); // retourne "abcde"
$rest = substr("abcdef", 2, -1); // retourne "cde"
$rest = substr("abcdef", 4, -4); // retourne ""
$rest = substr("abcdef", -3, -1); // retourne "de"
?>

77
4ème Sciences de l’informatique
Manuel de systèmes & technologies de l’informatique

strlen (source) : retourne la taille de la chaine source.


Exemple :
<?php
$str = 'abcdef';
echo strlen($str); // 6
$str = ' ab cd ';
echo strlen($str); // 7
?>
Str_replace (ch1, ch2, source) : retourne une chaine dont on remplace ch1 par ch2 qui
se trouve dans la chaine source
Exemple :
<?php
$bodytag = str_replace("%body%", "black", "<body text='%body%'>");
// Génère : <body text='black'>
?>
Trim (source) : Supprime les espaces en début et fin de chaîne.
Implode (séparateur, tableau) : Rassemble les éléments d'un tableau en une chaîne
séparer par séparateur.
Exemple :
<?php
$array = ['lastname', 'email', 'phone'];
var_dump(implode(",", $array)); // string(20) "lastname,email,phone"
// Chaîne vide lors de l'emploi d'un tableau vide :
var_dump(implode('hello', [])); // string(0) ""
// Le séparateur est optionnel :
var_dump(implode(['a', 'b', 'c'])); // string(3) "abc"
?>
explode (séparateur, chaine) : découpe une chaîne de caractères en segments séparer
par séparateur dans un tableau.
Exemple 1 :
<?php
$pizza = "piece1 piece2 piece3 piece4 piece5 piece6";
$pieces = explode(" ", $pizza);
echo $pieces[0]; // piece1
echo $pieces[1]; // piece2
?>
Exemple 2 :
<?php
/* Une chaîne qui ne contient pas de délimiteur va retourner un tableau contenant qu'un seul élément représentant la
chaîne originale */
$input1 = "hello";
$input2 = "hello,there";
$input3 = ',';
var_dump( explode( ',', $input1 ) ); //[0] => string(5) "hello" var_dump( explode( ',',
$input2 ) ); //[0] => string(5) "hello"
[1] => string(5) "there"
var_dump( explode( ',', $input3 ) ); //[0] => string(0) ""
[1] => string(0) ""

78
4ème Sciences de l’informatique
Manuel de systèmes & technologies de l’informatique

?>
Les fonctions sur type date :
date() : récupère la date système sous forme de chaine.
Exemple :
<?php
// Aujourd'hui, le 10 Mars 2001, 5:16:18 pm,
$today = date("l"); // Monday
$today = date("F j, Y, g:i a"); // March 10, 2001, 5:16 pm
$today = date("m.d.y"); // 03.10.01
$today = date("j, n, Y"); // 10, 3, 2001
$today = date("Ymd"); // 20010310
?>
Time() : retourne l’heure système en seconde depuis (1er janvier 1970 00:00:00 GMT).
Exemple :
<?php
echo 'Aujourd'hui : '. time(); // Aujourd'hui : 1660338149
?>
strtotime ("date") : analyse une date/heure textuelle en anglais en un horodatage Unix
(le nombre de secondes depuis le 1er janvier 1970 00:00:00 GMT).
Exemple :
<?php
echo (strtotime("now") . "<br>"); //1589972726
echo (strtotime("3 October 2005") . "<br>"); //1128297600
echo (strtotime("+5 hours") . "<br>"); //1589990726
echo (strtotime("+1 week") . "<br>"); //1590577526
echo (strtotime("+1 week 3 days 7 hours 5 seconds") . "<br>");//1590861931
echo (strtotime("next Monday") . "<br>"); //1590364800
echo (strtotime("last Sunday")); //1589673600
?>

79

Vous aimerez peut-être aussi