first push

main
licencep 5 months ago
commit ce4a254f34

@ -0,0 +1,31 @@
img {
width: 250px;
}
h1{
font-size: xx-large;
font-weight: bold;
}
p{
color: red;
}
.citation{
font-style: italic;
}
.important{
font-weight: bold;
}
#citationorange{
color: orange;
}
h1{
position: middle;
right: 50%;
}
.shift{
margin-left: 50px;
}

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.0 MiB

@ -0,0 +1,72 @@
<!DOCTYPE html>
<htlm>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Des photos de chat</title>
<link
rel="stylesheet"
href="https://cdn.jsdelivr.net/npm/bulma@1.0.0/css/bulma.min.css"
>
<link rel="stylesheet" href="./css/style.css" />
</head>
<body>
<div class="container">
<h1>Cahier des charges</h1>
<h2>Arboresance</h2>
<ol>
<li><strong>Acceuil</strong>
<ol class="shift">
<li>Afficher une introduction au site avec une brève description du thème des chats.</li>
<li>Afficher une photo de chat en illustration principale</li>
</ol>
</li>
</br>
<li><strong>Races de chats</strong>
<ol class="shift">
<li>Afficher une liste des races de chats.</li>
<li>Présenter des informations de base sur chaque race</li>
</ol>
</li>
<br>
<li><strong>Photos de chats</strong>
<ol class="shift">
<li>Afficher une galerie de photos de chats.</li>
<li>Permettre aux utilisateurs de cliquer sur chaque photo pour les agrandir.</li>
</ol>
</li>
<br>
<li><strong>Contact</strong>
<ol class="shift">
<li>Afficher un formulaire de contact simple.</li>
</ol>
</li>
<li><strong>Identité visuel</strong></li>
<ol>
<li><iframe width="560" height="315" src="https://www.youtube.com/embed/hbMSt-hEZmU?si=qI-NSB54ar7McUFf" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe></li>
<li><img src="img/cat2.jpg" alt="photo de chats"></li>
<li><img src="" alt="photo de chats" ></li>
</ol>
</ol>
<h3></h3>
<p class="important">Les chats sont des créatures honorables et dignes de respect, ils sont souvent traités avec gentilles et admiration</p>
<p class="citation">Dans notre monde complexe, ou meme les plus petites créeature ont leur place, les chats se tiennent en majestté</p>
<p class="citation" id="citationorange">Chat orange c'est le meme chose que un nigga?</p>
<a href="https://www.nationalgeographic.com/animals/mammals/facts/domestic-cat"><img src="img/cat1.jpg" alt="photo de chat"></a>
</div>
</body>
</html>

@ -0,0 +1,45 @@
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Des photos de chat</title>
<link
rel="stylesheet"
href="https://cdn.jsdelivr.net/npm/bulma@1.0.0/css/bulma.min.css">
<link rel="stylesheet" href="./style.css" />
</head>
<body class="container">
<nav class="navbar" role="navigation" aria-label="main navigation">
<div class="navbar-brand">
<a class="navbar-item" href="/">
<img src="image/logo.jpg" alt="logo chat">
</a>
<a role="button" class="navbar-burger" aria-label="menu" aria-expanded="false" data-target="My-navbar">
<span aria-hidden="true"></span>
<span aria-hidden="true"></span>
<span aria-hidden="true"></span>
<span aria-hidden="true"></span>
</a>
</div>
<div id="My-navbar" class="navbar-menu">
<div class="navbar-start">
<a class="navbar-link" href="index.html">Home</a>
<a class="navbar-link" href="races.html">Races des Chats</a>
<a class="navbar-link" href="contact.html">Contact</a>
</div>
</div>
</nav>
<p>No tienes calle</p>
</div>
</nav>
</body>
</html>

@ -0,0 +1,45 @@
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Des photos de chat</title>
<link
rel="stylesheet"
href="https://cdn.jsdelivr.net/npm/bulma@1.0.0/css/bulma.min.css">
<link rel="stylesheet" href="./style.css" />
</head>
<body class="container">
<nav class="navbar" role="navigation" aria-label="main navigation">
<div class="navbar-brand">
<a class="navbar-item" href="/">
<img src="image/logo.jpg" alt="logo chat">
</a>
<a role="button" class="navbar-burger" aria-label="menu" aria-expanded="false" data-target="My-navbar">
<span aria-hidden="true"></span>
<span aria-hidden="true"></span>
<span aria-hidden="true"></span>
<span aria-hidden="true"></span>
</a>
</div>
<div id="My-navbar" class="navbar-menu">
<div class="navbar-start">
<a class="navbar-link" href="index.html">Home</a>
<a class="navbar-link" href="races.html">Races de Chats</a>
<a class="navbar-link" href="alimentation.html">Alimentation</a>
</div>
</div>
</nav>
<p>No tienes calle</p>
</div>
</nav>
</body>
</html>

Binary file not shown.

After

Width:  |  Height:  |  Size: 152 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.0 MiB

@ -0,0 +1,59 @@
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Des photos de chat</title>
<link
rel="stylesheet"
href="https://cdn.jsdelivr.net/npm/bulma@1.0.0/css/bulma.min.css">
<link rel="stylesheet" href="./style.css" />
</head>
<body>
<!--<header>
<h1>Bienvenue sur le site des Chats !</h1>
<img src="pricipal image" alt="Photo de chat principale">
</header>-->
<nav class="navbar" role="navigation" aria-label="main navigation">
<div class="navbar-brand">
<a class="navbar-item" href="/">
<img src="image/logo.jpg" alt="logo chat">
</a>
<a role="button" class="navbar-burger" aria-label="menu" aria-expanded="false" data-target="My-navbar">
<span aria-hidden="true"></span>
<span aria-hidden="true"></span>
<span aria-hidden="true"></span>
<span aria-hidden="true"></span>
</a>
</div>
<div id="My-navbar" class="navbar-menu">
<div class="navbar-start">
<a class="navbar-link" href="races.html">Races de Chats</a>
<a class="navbar-link" href="contact.html">Contact</a>
<a class="navbar-link" href="alimentation.html">Alimentation</a>
</div>
</div>
</nav>
<!--<ol>
<li><a href="races.html">Races de Chats</a></li>
<li><a href="photos.html">Photos de Chats</a></li>
<li><a href="contact.html">Contact</a></li>
<li><a href="races.html">Races de Chats</a></li>
</ol>-->
<main>
<h2>Découvret le monde fascinant des chats</h2>
<p>Les chats, ces félins mystérieux et fascinants, ont captivé l'attention de l'humanité depuis des millénaires. Leur grâce, leur agilité et leur indépendance en font des compagnons adorés à travers le monde.</p>
<p>Sur notre site dédié aux chats, vous trouverez une mine d'informations sur ces merveilleuses créatures, des détails sur les différentes races aux conseils pour prendre soin de votre félin bien-aimé. Que vous soyez un amoureux des chats chevronné ou un novice curieux, notre site est là pour répondre à toutes vos questions et vous plonger dans l'univers magique des chats.</p>
<p>Nous vous invitons à explorer nos pages et à découvrir tout ce que vous avez toujours voulu savoir sur les chats. Bonne visite !</p>
</main>
<footer>
<p>&copy; 2024 Site sur les Chats - Tous droits réservés</p>
</footer>
</body>
</html>

@ -0,0 +1,103 @@
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Des photos de chat</title>
<link
rel="stylesheet"
href="https://cdn.jsdelivr.net/npm/bulma@1.0.0/css/bulma.min.css">
<link rel="stylesheet" href="./style.css" />
</head>
<body class="container">
<nav class="navbar" role="navigation" aria-label="main navigation">
<div class="navbar-brand">
<a class="navbar-item" href="/">
<img src="image/logo.jpg" alt="logo chat">
</a>
<a role="button" class="navbar-burger" aria-label="menu" aria-expanded="false" data-target="My-navbar">
<span aria-hidden="true"></span>
<span aria-hidden="true"></span>
<span aria-hidden="true"></span>
<span aria-hidden="true"></span>
</a>
</div>
<div id="My-navbar" class="navbar-menu">
<div class="navbar-start">
<a class="navbar-link" href="index.html">Home</a>
<a class="navbar-link" href="contact.html">Contact</a>
<a class="navbar-link" href="alimentation.html">Alimentation</a>
</div>
</div>
</nav>
<div class="section">
<div class="columns">
<div class="column">
<div class="card">
<div class="card-image">
<figure class="image is-4by3">
<img
src="https://bulma.io/assets/images/placeholders/1280x960.png"
alt="Placeholder image"
/>
</figure>
</div>
<div class="card-content">
<div class="media">
<div class="media-left">
<figure class="image is-48x48">
<img
src="https://bulma.io/assets/images/placeholders/96x96.png"
alt="Placeholder image"
/>
</figure>
</div>
<div class="media-content">
<p class="title is-4">Races de Chat</p>
<p class="subtitle is-6">Races de Chats</p>
</div>
</div>
<div class="content">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus nec
iaculis mauris.
</div>
<br>
<div class="card">
<div class="card-image">
<figure class="image is-4by3">
<img
src="https://bulma.io/assets/images/placeholders/1280x960.png"
alt="Placeholder image"
/>
</figure>
</div>
<div class="card-content">
<div class="media">
<div class="media-left">
<figure class="image is-48x48">
<img
src="https://bulma.io/assets/images/placeholders/96x96.png"
alt="Placeholder image"
/>
</figure>
</div>
<div class="media-content">
<p class="title is-4">Races de Chat</p>
<p class="subtitle is-6">Races de Chats</p>
</div>
</div>
<div class="content">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus nec
iaculis mauris.
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<p>No tienes calle</p>
</body>
</html>
Loading…
Cancel
Save