html1

 <!doctype HTML>

<html>

<title>KatiaM</title>

<meta name="viewport" content="width=device-width, initial-scale=1.0">

<link href="Style/Style.css" rel="stylesheet" type="text/css">

<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>

<link href="https://fonts.googleapis.com/css2?family=Aclonica&family=Open+Sans:wght@500&family=Oswald:wght@200&family=Source+Sans+Pro:wght@400;600;700&display=swap" rel="stylesheet">

<link rel="stylesheet" type="text/css" href="Java/jquery.fancybox.css?v=2.1.5" media="screen"/>

<head>

<div id="container">

<div id="menu">

<a href="https://www.etsy.com/people/4dk4gx1g839l7rzw" target="_blank">Shop</a>

<a href="Contatti.html">Contatti</a>

</div>

<div id="cover" style="margin-top:0px;" >

<div id="sx">

<a href="KatiaM.html">

<image src="style/Logo3.png" width="20%" height="auto">

</a>

</div>

<div id="dx">

<div id="menu1">

<a href="KatiaM.html">Home</a>

<a href="Portfolio.html">Portfolio</a>

<a href="Prodotti.html">Prodotti</a>

<a href="Links.html">Links</a>

<a href="Chisono.html">Chi sono</a>

</div>

</div>

</div>

</div>

</head>

<body>

<main>

<div id="Titoli">

<p id="titolo"> CHI SONO </p>

<div id="intro">

<div id="intro1" >

<p> Ciao a tutti, io sono Katia, una ragazza di 23 anni che viene da un paesino in provincia di Pisa. 

<br> Ho scoperto il mondo del disegno quando andavo alle scuole medie, con le ore di arte, in cui mi si è rivelata una particolare passione per il disegno realistico, soprattutto dopo aver riprodotto il quadro “la nascita di Venere”. 

<br> In quegli anni ho cominciato a provare varie tecniche di disegno con differenti media, dal carboncino, ai pastelli ad olio, alle tempere, acquerelli, matite colorate, grafite, fino a capire quali fossero i miei punti deboli e i miei punti di forza. 

Mi dedicavo soprattutto ai ritratti, cosa che al momento ho temporaneamente abbandonato per dare spazio ad altre tipologie di disegno. 

</p>

</div>

<div id="intro2" >

<image src="style/Katttt.png" width="70%" height="auto">

</div>


</div>

<div id="leggi" >

<div id="Bottone" >

<a href="Chisono.html"> Leggi di più </a>

</div>

</div>

</div>

<div id="Titoli">

<p id="titolo"> PORTFOLIO </p>

<div id="Port">

<div id="Port1" >

<div id="PortT" >

<p> Disegni </p>

</div>

<div id="PortT2" >

<image src="style/draw/28.jpg" width="100%">

</div>

<div id="Bottone1" >

<a href="Disegni.html"> Guarda di più </a>

</div>

</div>

<div id="Port2" >

<div id="PortT" >

<p> Locandine </p>

</div>

<div id="PortT2" >

<image src="style/Rane.png" width="100%">

</div>

<div id="Bottone1" >

<a href="Photoshop.html"> Guarda di più </a>

</div>

</div>


<div id="Port3" >

<div id="PortT" >

<p> Loghi </p>

</div>

<div id="PortT2" >

<image src="style/1.png" width="93%">

</div>

<div id="Bottone1" >

<a href="Illustrator.html"> Guarda di più </a>

</div>

</div>


<div id="Port4" >

<div id="PortT" >

<p> Video </p>

</div>

<div id="PortT2" >

<image src="style/draw/28.jpg" width="100%">

</div>

<div id="Bottone1" >

<a href="Premiere.html"> Guarda di più </a>

</div>

</div>


</div>

</div>

<div id="Titoli">

<p id="titolo"> IL MIO NEGOZIO ONLINE </p>

<div id="intro">

<div id="intro1" >

<p> LAVORI IN CORSO <br>

Presto sarà disponibile lo shop online, 

Presto sarà disponibile lo shop online,Presto sarà disponibile lo shop online, 

Presto sarà disponibile lo shop online,Presto sarà disponibile lo shop online, 

Presto sarà disponibile lo shop online,Presto sarà disponibile lo shop online, 

Presto sarà disponibile lo shop online,Presto sarà disponibile lo shop online, 

Presto sarà disponibile lo shop online,Presto sarà disponibile lo shop online, 

Presto sarà disponibile lo shop online, </p>

</div>

<div id="intro2" >

<image src="style/draw/1.jpg" width="100%" height="auto">

</div>

</div>

<div id="Bottone" >

<a href="https://www.etsy.com/people/4dk4gx1g839l7rzw"> Il mio shop </a>

</div>

</div>

<div id="Titoli">

<p id="titolo"> MI POTETE TROVARE ANCHE QUI </p>

</div>

<div id="Titoli">

<p id="titolo"> I MIE CONTATTI </p>

</div>

</main>



<footer>

<div id="colonna">

<div id="left">

<a href="KatiaM.html">

<image src="style/Logo.png" width="20%" height="auto">

</a>

<div id="social">

<a href="https://www.instagram.com/ktiamu/" target="_blank">

<image src="Style/IG.png" width="4.5%">

</a>

<a href="https://www.facebook.com/ktiamuart" target="_blank">

<image src="Style/FB.png" width="4.5%">

</a>

<a href="https://tiktok.com/@ktiamu" target="_blank">

<image src="Style/TT.png" width="4.5%">

</a>

<a href="https://youtube.com/channel/ktiamu/videos" target="_blank">

<image src="Style/YT.png" width="4.5%">

</a>

</div>

</div>

<div id="center">

<a href="Portfolio.html">

<p> PORTFOLIO </p>

</a>

<div id="linkfooter">

<a href="Disegni.html">

<p> Disegni </p>

</a>

<a href="Photoshop.html">

<p> Locandine </p>

</a>

<a href="Illustrator.html">

<p> Loghi </p>

</a>

<a href="Premiere.html">

<p> Video </p>

</a>

</div>

</div>

<div id="right">

<a href="KatiaM.html">

<p> SITO </p>

</a>

<div id="sitofooter">

<a href="chisono.html">

<p> Chi sono </p>

</a>

<a href="Contatti.html">

<p> Contatti </p>

</a>

<a href="Links.html">

<p> Link Utili </p>

</a>

<a href="Cookie.html">

<p> Cookie e privacy </p>

</a>

</div>

</div>

<form action="katiam.html">

<div class="newsletter">

<h23>Iscriviti alla newsletter</h3>

</div>


<div class="newsletter">

<input type="text" placeholder="Indirizzo mail" name="mail" required style="width: 210px;">

</div>

<div class="newsletter">

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

</div>

</form>


</div>

<p id="Copyright"> Copyright © KatiaM <br> info@katiam.com

</footer>

</body>


</html>

Commenti

Posta un commento

Post popolari in questo blog

HTML 2

 <!doctype HTML> <html> <head> <title>Model S | Tesla Italia</title> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <link href="Style/Style.css" rel="stylesheet" type="text/css"> <link href="http://fonts.cdnfonts.com/css/gotham" rel="stylesheet"> <link rel="stylesheet" type="text/css" href="Java/jquery.fancybox.css?v=2.1.5" media="screen"/> <script type="text/javascript" src="Java/jquery-1.10.1.min.js"></script> <script type="text/javascript" src="Java/jquery.fancybox.js?v=2.1.5"></script> <script type="text/javascript"> $(document).ready(function() { $('.fancybox').fancybox(); }); </script> </head> <body> <div id="cover" style="m...
Continua a leggere

CSS 1

 #head { Background-color: #303858; } /*container*/ #container { Background-color: #303858; display: flex; flex-direction: column;  } /*Cover*/ #cover { display: flex; flex-direction: column; align-items: center; padding: 0px 0px 15px 0px; } /*SX*/ #sx { text-align: center; } /*DX*/ #dx { text-align: right; } /* Menu link*/ #menu { text-align: right; } #menu a { font-family: 'Source Sans Pro', sans-serif; font-size: 18px; text-decoration: none; padding: 10px 20px 10px 20px; color: #e8d4e1bd; } #menu a:hover{      color: #a46a87bd; } /* Menu link*/ #menu1: { text-align: center; } #menu1 a { font-family: 'Source Sans Pro', sans-serif; font-size: 18px; text-decoration: none; padding: 10px 20px 10px 20px; color: #E8D4E1; } #menu1 a:hover{      color: #A46A87; } /* FORM CONTATTI*/ form { margin: 40px;  font-family: 'Source Sans Pro', sans-serif; font-size: 20px;   display: flex;   flex-direction: column; ...
Continua a leggere

css 3

  /*container per ridimensionare la pagina*/ #container { width:960px; height: 500px; margin: auto; } /*header*/ #header { text-align:center; padding: 20px; } /* titolo */ #titolo {font-size:15px; font-family: 'Aclonica', sans-serif; } /* menu */ #menu { display: flex; justify-content: center;  } /*menu*/ #menu a { color: grey; text-decoration: none;  font-size: 16px; font-weight: 40px; padding-right: 10px; font-style: italic; font-family: sans-serif; } #menu a:last-child { padding-right: 0px; } /* copertina */  #main img {  border: 10px solid white;   background-repeat: no-repeat;   box-sizing: border-box; }  /* barra */ hr { padding: 0px; margin-top: 40px; border-top: 1px solid #c6c6c6; } /*Le offerte*/ h3 { background-color:lightgrey; color:#fff; font-size: 24px; width: 200px; text-align:center; margin:auto; }
Continua a leggere