/
index.html
1 lines (1 loc) · 12.9 KB
/
index.html
1
<!doctype html><html lang="fr"><head><meta charset="utf-8"><meta name="description" content="Free Web tutorials"><meta name="keywords" content="HTML, CSS, JavaScript"><meta name="author" content="Amadu Askofare"><meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"><link rel="stylesheet" href="styles/css/reset.css"><link rel="stylesheet" href="styles/css/hover.css"><link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.0/css/bootstrap.min.css" integrity="sha384-9gVQ4dYFwwWSjIDZnLEWnxCjeSWFphJiwGPXr1jddIhOegiu1FwO5qRGvFXOdJZ4" crossorigin="anonymous"><link rel="stylesheet" type="text/css" href="styles/css/slick.css"/><link rel="stylesheet" type="text/css" href="styles/css/slick-theme.css"><link href="https://fonts.googleapis.com/css?family=Roboto" rel="stylesheet"><link href="https://fonts.googleapis.com/css?family=Lato" rel="stylesheet"><link rel="icon" href="images/logo.png" type="image/png" sizes="16x16"><link rel="stylesheet" href="styles/css/main.css"><title>MAD</title></head><body> <header> <nav class="navbar navbar-expand-md navbar-dark fixed-top bg-dark container "> <a class="navbar-brand" href="../index.html"> <img src="images/nav-logo.png" alt="brand-logo" width ="100" > </a> <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarsExampleDefault" aria-controls="navbarsExampleDefault" aria-expanded="false" aria-label="Toggle navigation"> <span class="navbar-toggler-icon"></span> </button><div class="collapse navbar-collapse" id="navbarsExampleDefault"><ul class="navbar-nav mr-auto"><li class="nav-item active"> <a class=" hvr-radial-out nav-link" href="../index.html">Acceuil <span class="sr-only">(current)</span></a></li><li class="nav-item"> <a class=" hvr-radial-out nav-link" href="https://mad-mali.blogspot.ru/">Blog</a></li></ul><ul class="navbar-nav mr-auto "><li class=" mr-1 ml-1 nav-item"> <a class="nav-link" href="#"> <img src="images/ink.png" alt="link to linkedin" width="30" height="30" > </a></li><li class=" mr-1 ml-1 nav-item"> <a class="nav-link" href="https://plus.google.com/u/0/104776672802789561234" target="_blank"> <img src="images/gp.png" alt="link to google plus" width="30" height="30"> </a></li><li class="mr-1 ml-1 nav-item"> <a class="nav-link" href="https://www.facebook.com/pg/maliapdev" target="_blank"> <img src="images/fb.png" alt="link to facebook" width="30" height="30"> </a></li></ul><form class="form-inline my-2 my-lg-0" action="http://www.google.com/search" method="get" target="_blank" > <input class="form-control mr-sm-2" type="text" placeholder="Search" aria-label="Search" name="q"> <button class="btn btn-outline-success my-2 my-sm-0" type="submit">Search</button></form></div> </nav><div class="header-words-container container"><h1 class="font-weight-bold">mali-dev<span>.com</span></h1><h5>Le plus grand site Malien pour les Web deveppeurs</h5></div> </header> <main><div class="container main-container "><div class="main-top"><div class="main-head_left"> <img src="images/bg1.jpg" alt="main_picture"></div><div class="main-head_rigth"><p>"LAISSEZ LIBRE COURS À VOTRE IMAGINATION<br/> <span>FUTIRISTE</span><br/> Laissez vous plonger dans l'ère de la technologie et permettez à vous même de faire la différence, construisons et développons l'Afrique ensemble."</p></div></div><div class="main-middle_top"><ul class="nav nav-pills flex-column col-2 mb-3" id="pills-tab" role="tablist"><li class="nav-item"> <a class=" text-light nav-link active " id="pills-home-tab" data-toggle="pill" href="#pills-home" role="tab" aria-controls="pills-home" aria-selected="true">HTML5</a></li><li class="nav-item"> <a class="text-light nav-link " id="pills-css-tab" data-toggle="pill" href="#pills-css" role="tab" aria-controls="pills-css" aria-selected="false">CSS3</a></li><li class="nav-item"> <a class="text-light nav-link" id="pills-sas-tab" data-toggle="pill" href="#pills-sas" role="tab" aria-controls="pills-sas" aria-selected="false">SASS</a></li><li class="nav-item"> <a class="text-light nav-link " id="pills-js-tab" data-toggle="pill" href="#pills-js" role="tab" aria-controls="pills-js" aria-selected="false">JAVASCRIPT</a></li><li class="nav-item"> <a class="text-light nav-link " id="pills-gulp-tab" data-toggle="pill" href="#pills-gulp" role="tab" aria-controls="pills-gulp" aria-selected="false">GULP</a></li><li class="nav-item"> <a class="text-light nav-link " id="pills-jquery-tab" data-toggle="pill" href="#pills-jquery" role="tab" aria-controls="pills-jquery" aria-selected="false">jQUERY</a></li><li class="nav-item"> <a class="text-light nav-link " id="pills-ajax-tab" data-toggle="pill" href="#pills-ajax" role="tab" aria-controls="pills-ajax" aria-selected="false">AJAX</a></li><li class="nav-item"> <a class="text-light nav-link " id="pills-node-tab" data-toggle="pill" href="#pills-node" role="tab" aria-controls="pills-node" aria-selected="false">NODE.JS</a></li><li class="nav-item"> <a class="text-light nav-link " id="pills-react-tab" data-toggle="pill" href="#pills-react" role="tab" aria-controls="pills-react" aria-selected="false">REACT.JS</a></li></ul><div class="tab-content pl-0 col-10" id="pills-tabContent"><div class="tab-pane fade show active drap pt-2 " id="pills-home" role="tabpanel" aria-labelledby="pills-home-tab"><div class="d-flex flex-row flex-wrap justify-content-around mb-2 cour-content"><div class=""> <iframe src="https://www.youtube.com/embed/nwpARFlhjXQ" allow="encrypted-media" allowfullscreen></iframe><p class="text-dark font-weight-bold text-center" >1.HTML - Eléments, balises, attributs</p></div><div class=""> <iframe src="https://www.youtube.com/embed/KSg2WJ6QK4g" allowfullscreen></iframe><p class="text-dark font-weight-bold text-center" >2.HTML - Structure</p></div><div class=""> <iframe src="https://www.youtube.com/embed/nlrWga5ZiuY" allowfullscreen></iframe><p class="text-dark font-weight-bold text-center" >3.HTML - Affichage</p></div><div class=""> <iframe src="https://www.youtube.com/embed/KgNQcsuCSxo" allowfullscreen></iframe><p class="text-dark font-weight-bold text-center" >4.HTML - Indentation et commentaires</p></div><div class=""> <iframe src="https://www.youtube.com/embed/KxhwraAxKyk" allowfullscreen></iframe><p class="text-dark font-weight-bold text-center" >5.HTML - Titres et paragraphes</p></div><div class=""> <iframe src="https://www.youtube.com/embed/hBfB9N5uZH8" allow="autoplay; encrypted-media" allowfullscreen></iframe><p class="text-dark font-weight-bold text-center" >6.HTML - Espaces et retours à la ligne</p></div><div class=""> <iframe src="https://www.youtube.com/embed/6-Kbwgd6coU" allow="autoplay; encrypted-media" allowfullscreen></iframe><p class="text-dark font-weight-bold text-center" >7.HTML - Strong, em et mark</p></div><div class=""> <iframe src="https://www.youtube.com/embed/QhMLAPxTs5w" allow="autoplay; encrypted-media" allowfullscreen></iframe><p class="text-dark font-weight-bold text-center" >8.HTML - Listes</p></div><div class=""> <iframe src="https://www.youtube.com/embed/Z2-Fmme7NTk" allow="autoplay; encrypted-media" allowfullscreen></iframe><p class="text-dark font-weight-bold text-center" >9.HTML - Liens internes et externes</p></div><div class=""> <iframe src="https://www.youtube.com/embed/Z2-Fmme7NTk" allow="autoplay; encrypted-media" allowfullscreen></iframe><p class="text-dark font-weight-bold text-center" >10.HTML - Autres types de liens</p></div><div class=""> <iframe src="https://www.youtube.com/embed/dsIEW8zpllM" allow="autoplay; encrypted-media" allowfullscreen></iframe><p class="text-dark font-weight-bold text-center" >11.HTML - Images</p></div><div class=""> <iframe src="https://www.youtube.com/embed/V17b1ZJBuXE" allow="autoplay; encrypted-media" allowfullscreen></iframe><p class="text-dark font-weight-bold text-center" >11.HTML - Validation</p></div></div></div><div class="tab-pane fade drap" id="pills-css" role="tabpanel" aria-labelledby="pills-css-tab">...</div><div class="tab-pane fade drap" id="pills-sas" role="tabpanel" aria-labelledby="pills-sas-tab"><div class="d-flex flex-wrap flex-row justify-content-around mb-2"><div class=""> <iframe src="https://www.youtube.com/embed/eU9cW-h2Nos?list=PL0TnHYy48T2zAl4x8I_wFLq36Aqt34Art" allow="autoplay; encrypted-media" allowfullscreen></iframe></div><div class=""> <iframe src="https://www.youtube.com/embed/dx-dzClBSLo?list=PL0TnHYy48T2zAl4x8I_wFLq36Aqt34Art" allow="autoplay; encrypted-media" allowfullscreen></iframe></div><div class=""> <iframe src="https://www.youtube.com/embed/db2u0vekdWU?list=PL0TnHYy48T2zAl4x8I_wFLq36Aqt34Art" allow="autoplay; encrypted-media" allowfullscreen></iframe></div><div class=""> <iframe src="https://www.youtube.com/embed/nHwF5WOXfp0?list=PL0TnHYy48T2zAl4x8I_wFLq36Aqt34Art" allow="autoplay; encrypted-media" allowfullscreen></iframe></div><div class=""> <iframe src="https://www.youtube.com/embed/4VzEMQqu7p4?list=PL0TnHYy48T2zAl4x8I_wFLq36Aqt34Art" allow="autoplay; encrypted-media" allowfullscreen></iframe></div><div class=""> <iframe src="https://www.youtube.com/embed/wz3kElLbEHE" allow="autoplay; encrypted-media" allowfullscreen></iframe></div></div></div><div class="tab-pane fade drap" id="pills-js" role="tabpanel" aria-labelledby="pills-js-tab">ila</div><div class="tab-pane fade drap" id="pills-gulp" role="tabpanel" aria-labelledby="pills-gulp-tab">ola</div><div class="tab-pane fade drap" id="pills-jquery" role="tabpanel" aria-labelledby="pills-jquery-tab">tola</div><div class="tab-pane fade drap" id="pills-ajax" role="tabpanel" aria-labelledby="pills-ajax-tab">tola</div><div class="tab-pane fade drap" id="pills-node" role="tabpanel" aria-labelledby="pills-node-tab">tola</div><div class="tab-pane fade drap" id="pills-react" role="tabpanel" aria-labelledby="pills-react-tab">tola</div></div></div><div class="blog-articl_header"> <header><h3 class=" font-weight-bold" >BLOG-POSTS</h3> </header></div><div class="blog-container"><div class="blog-content"><div class="card"> <div class="card-body"><h5 class="card-title">Css Outline(Contour)</h5><p class="card-text">Un contour est une ligne qui est dessinée autour des éléments, à l'EXTÉRIEUR des bordures, pour faire "ressortir" l'élément...</p> <a href="https://mad-mali.blogspot.ru/2018/05/css-outlinecontour-un-contour-est-une.html" target="_blank" class="btn-sm btn-primary">LIRE LA SUITE</a></div></div><div class="card"> <div class="card-body"><h5 class="card-title">CSS:box model</h5><p class="card-text">Tous les éléments HTML peuvent etres considérés comme des boites(boxes). En CSS, le terme «box model» (modèle de....</p> <a href="https://mad-mali.blogspot.ru/2018/05/css-box-model-modele-de-boite-tous-les.html" class="btn-sm btn-primary" target="_blank">LIRE LA SUITE</a></div></div><div class="card"> <div class="card-body"><h5 class="card-title">CSS:les bases</h5><p class="card-text">Le css est utilisé pour styler une page html. Genre imaginez que vous vener de construire une maison, et que vous...</p> <a href="https://mad-mali.blogspot.ru/2018/05/css-les-bases-le-css-est-utilise-pour.html" target="_blank" class="btn-sm btn-primary">LIRE LA SUITE</a></div></div><div class="card"> <div class="card-body"><h5 class="card-title">HTML</h5><p class="card-text">HTML (HyperText Markup Language) est un format permettant de définir les éléments variés d'une "page" qu'on...</p> <a href="https://mad-mali.blogspot.ru/2018/02/html-hypertext-markup-language.html" target="_blank" class="btn-sm btn-primary">LIRE LA SUITE</a></div></div></div></div><div class="about_header"> <header><h3 class=" font-weight-bold">À PROPOS</h3> </header></div><div class="main-middle_bottom"><div class="item-left"> <img src="images/asko.jpg" alt="Amadu's image"><p>Amadou Askofare</p><p>Profession : <span>Front-end développeur</span></p><p>Email : <span>amadouaskofare@gmail.com</span></p><p>Tel : <span>+7 (999) 227-89-06</span></p></div><div class="item-right"><p> "Je suis un étudiant malien en Russie.<br> J'ai créé cette page dans l'esprit d'unicité ,pour donner la chance aux jeunes compétents africains qui n'ont pas eu la même chance que moi, d'avoir presque toutes les ressources necessaires pour améliorer leur connaissance."</p></div></div></div> </main> <footer class="container" ><div class="container"><p class="text-light text-center"> © 2018 MAD ML.</p></div> </footer> <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.0/umd/popper.min.js" integrity="sha384-cs/chFZiN24E4KMATLdqdvsezGxaGsi4hLGOzlXwp5UZB1LY//20VyM2taTB4QvJ" crossorigin="anonymous"></script> <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.0/js/bootstrap.min.js" integrity="sha384-uefMccjFJAIv6A+rW+L4AHf99KvxDjWSu1z9VI8SKNVmz4sk7buKt/6v9KI65qnm" crossorigin="anonymous"></script> <script src="//code.jquery.com/jquery-1.11.0.min.js"></script> <script src="//code.jquery.com/jquery-migrate-1.2.1.min.js"></script> <script src="script/slick.min.js"></script> <script src="script/main.js"></script> </body></html>