<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>test-page 1 web Gualdo</title><!--change-->
<link rel="stylesheet" href="styles.css">
</head>
<body>
<header>
<h1>Gualdo 2.0</h1>
<h1>Edition critique numérique de</h1>
<h1>l'oeuvre narrative de Luigi Gualdo (1844-1898)</h1>
<img src="../Pictures/lorem_ipsum.png" class="styled-image">
<nav id="menu-deroulant"> <!--rajouter sous-menu-->
<ul>
<li><a href="#accueil"onclick="scrollToSection('accueil')"><button id="openPopupBtn">Accueil</button></a></li>
<div id="popup" class="popup">
<div class="popup-content">
<span class="close-btn" onclick="closePopup()">×</span>
<h2>Accueil</h2>
<p>LOREM IPSUM.LOREM IPSUM. LOREM IPSUM.LOREM IPSUM.LOREM IPSUM.LOREM IPSUM.LOREM IPSUM LOREM IPSUM</p>
</div>
</div>
<li><a href="#luigi Gualdo"onclick="scrollToSection('luigi Gualdo')"><button id="openPopupBtn">Luigi Gualdo</button></a></li> <!--change-->
<div id="popup" class="popup">
<div class="popup-content">
<span class="close-btn" onclick="closePopup()">×</span>
<h3>Luigi Gualdo</h3>
<p>LOREM IPSUM. LOREM IPSUM. LOREM IPSUM.LOREM IPSUM.LOREM IPSUM.LOREM IPSUM.LOREM IPSUM LOREM IPSUM</p> <!--rajouter balise fr/it + fonction scroll-->
</div>
</div>
<div class="dropdown"> <!--menu deroulant-->
<button class="dropbtn" onclick="toggleDropdown()">Gualdo 2.0</button>
<div id="dropdownContent" class="dropdown-content">
<a href="#lorem">Lorem</a>
<a href="#ipsum">Ipsum</a>
</div>
<div class="dropdown"> <!--menu deroulant-->
<button class="dropbtn" onclick="toggleDropdown()">Edition</button>
<div id="dropdownContent" class="dropdown-content">
<a href="#lorem">Lorem</a>
<a href="#ipsum">Ipsum</a>
</div>
<li><input type="text" id="searchInput" placeholder="Rechercher..."></li> <!--barre de recherche-->
<!--fonction a compléter-->
</ul>
</nav>
</header>
<main>
<div id="Content">
<div class="lang"> <!--version bilingue-->
<a href="titre_fr.html">Fr</a> <!--version française: source presentation a rajouter-->
|
<a class="lienInterne" href="titre_it.html">It</a> <!--version italienne: source presentation rajouter-->
</div>
</div>
<div class="carousel"> <!--caroussel images-->
<div class="carousel-inner">
<div class="carousel-item active">
<img src="../Pictures/lorem_ipsum.png" alt="Image 1" class="wrapped-image"> <!--1ère image ok--> <!-- habillage image 1 caroussel-->
<p>Lorem ipsum</p>
</div>
<div class="carousel-item">
<img src="../Pictures/lorem_ipsum.png" alt="Image 2" class="wrapped-image"> <!-- habillage image 2 caroussel-->
<p>Lorem ipsum</p>
</div>
<div class="carousel-item">
<img src="../Pictures/lorem_ipsum.png" alt="Image 3" class="wrapped-image"> <!--habillage image 3 caroussel-->
<p>Lorem ipsum</p>
</div>
</div>
<!--rajout boutons pour caroussel?-->
</div>
<div class="text-block1">
<h2>LOREM IPSUM</h2>
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</p>
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</p>
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</p>
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</p>
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</p>
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</p>
</div>
</main>
<footer>
<p></p> <!--change-->
</footer>
<script src="script.js"></script>
</body>
</html>
test_page_web.html
Ouvrir avec Google Docs
Partager
Page 4 sur 5 Page 3 sur 5 Page 2 sur 5 Page 1 sur 5
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>test-page 1 web Gualdo</title><!--change-->
<link rel="stylesheet" href="styles.css">
</head>
<body>
<header>
<h1>Gualdo 2.0</h1>
<h1>Edition critique numérique de</h1>
<h1>l'oeuvre narrative de Luigi Gualdo (1844-1898)</h1>
<img src="../Pictures/lorem_ipsum.png" class="styled-image">
<nav id="menu-deroulant"> <!--rajouter sous-menu-->
<ul>
<li><a href="#accueil"onclick="scrollToSection('accueil')"><button id="openPopupBtn">Accueil</button></a></li>
<div id="popup" class="popup">
<div class="popup-content">
<span class="close-btn" onclick="closePopup()">×</span>
<h2>Accueil</h2>
<p>LOREM IPSUM.LOREM IPSUM. LOREM IPSUM.LOREM IPSUM.LOREM IPSUM.LOREM IPSUM.LOREM IPSUM LOREM IPSUM</p>
</div>
</div>
<li><a href="#luigi Gualdo"onclick="scrollToSection('luigi Gualdo')"><button id="openPopupBtn">Luigi Gualdo</button></a></li> <!--change-->
<div id="popup" class="popup">
<div class="popup-content">
<span class="close-btn" onclick="closePopup()">×</span>
<h3>Luigi Gualdo</h3>
<p>LOREM IPSUM. LOREM IPSUM. LOREM IPSUM.LOREM IPSUM.LOREM IPSUM.LOREM IPSUM.LOREM IPSUM LOREM IPSUM</p> <!--rajouter balise fr/it + fonction scroll-->
</div>
</div>
<div class="dropdown"> <!--menu deroulant-->
<button class="dropbtn" onclick="toggleDropdown()">Gualdo 2.0</button>
<div id="dropdownContent" class="dropdown-content">
<a href="#lorem">Lorem</a>
<a href="#ipsum">Ipsum</a>
</div>
<div class="dropdown"> <!--menu deroulant-->
<button class="dropbtn" onclick="toggleDropdown()">Edition</button>
<div id="dropdownContent" class="dropdown-content">
<a href="#lorem">Lorem</a>
<a href="#ipsum">Ipsum</a>
</div>
<li><input type="text" id="searchInput" placeholder="Rechercher..."></li> <!--barre de recherche-->
<!--fonction a compléter-->
</ul>
</nav>
</header>
<main>
<div id="Content">
<div class="lang"> <!--version bilingue-->
<a href="titre_fr.html">Fr</a> <!--version française: source presentation a rajouter-->
|
<a class="lienInterne" href="titre_it.html">It</a> <!--version italienne: source presentation rajouter-->
</div>
</div>
<div class="carousel"> <!--caroussel images-->
<div class="carousel-inner">
<div class="carousel-item active">
<img src="../Pictures/lorem_ipsum.png" alt="Image 1" class="wrapped-image"> <!--1ère image ok--> <!-- habillage image 1 caroussel-->
<p>Lorem ipsum</p>
</div>
<div class="carousel-item">
<img src="../Pictures/lorem_ipsum.png" alt="Image 2" class="wrapped-image"> <!-- habillage image 2 caroussel-->
<p>Lorem ipsum</p>
</div>
<div class="carousel-item">
<img src="../Pictures/lorem_ipsum.png" alt="Image 3" class="wrapped-image"> <!--habillage image 3 caroussel-->
<p>Lorem ipsum</p>
</div>
</div>
<!--rajout boutons pour caroussel?-->
</div>
<div class="text-block1">
<h2>LOREM IPSUM</h2>
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</p>
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</p>
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</p>
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</p>
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</p>
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</p>
</div>
</main>
<footer>
<p></p> <!--change-->
</footer>
<script src="script.js"></script>
</body>
</html>