Avis sur mon code HTML5 et CSS3
Bonjour .
Je suis un nouveau membre de développez.com.
J'aimerais que vous me donniez vos avis sur le code html5 et css3 de mon site web que voici , je suis encore un grand débutant pourriez vous me donnez quelques conseils et une note sur 20 ? Merci d'avance !
Voici mes codes
index.html :
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
| <!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Up Your Account</title>
<link rel="stylesheet" href="css.css" type="text/css" />
</head>
<body>
<header>
</header>
<div class="rouge"><h2 class="rapide">Rapide</h2><p class="p1"> Notre service vous permet de bla bla bla bla</p></div>
<div class="bleu"><h2 class="fiable">Fiable</h2><p class="p2"> Notre service vous permet de bla bla bla bla</p></div>
<footer>
<span class="bleuban"></span>
<span class="jauneban"></span>
<span class="vertban"></span>
<span class="rougeban"></span>
<nav>
<ul>
<li class="support"><a href="mailto:maildusupport.com">● Un problème , une question ?</a></li>
<li class="achat"><a href="Achat/index.html">● Achat</a></li>
<li class="info"><a href="info/info.html">● Informations complémentaires</a></li>
</ul>
</nav>
</footer>
</body>
</html> |
css.css
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
| @media all and (max-width: 620px) {
body{
background-image:url(../ressources/images/backgroundmobile.jpg);
}
}
@media all and (min-width: 621px) and (max-width:1000px){
body{
background-image:url(../ressources/images/backgroundtablette.jpg);
}
}
@media all and (min-width:1001px) and (max-width:1280px){
body{
background-image:url(../ressources/images/background.jpg);
background-repeat:no-repeat;
}
}
@media all and (min-width:1281px){
body{
background-image:url(../ressources/images/grandbackground.jpg);
background-repeat:no-repeat;
}
}
@media all and (max-width:740px){
.info{
display:none;
}
}
header{
height:150px;
background-image:url(../ressources/images/logo.png);
background-repeat:no-repeat;
background-position:center;
background-color:rgb(251,253,252);
border-bottom:3px black solid;
position:absolute;
top:0;
left:0;
right:0;
}
.rouge{
margin-top:190px;
height:150px;
width:150px;
border-top-left-radius:72px;
border-bottom-right-radius:72px;
background-color:#c1574c;
}
.bleu{
float:right;
margin-top:-150px;
height:150px;
width:150px;
border-bottom-left-radius:72px;
border-top-right-radius:72px;
background-color:#637e9f;
margin-bottom:450px;
}
div h2{
color:white;
font-size:1.5em;
}
.rapide{
margin-left:50px;
}
.fiable{
margin-top:-1px;
margin-left:25px;
}
.p1{
margin-left:10px;
}
.p2{
margin-left:15px;
}
footer{
clear:both;
position:fixed;
bottom:0;
left:0;
right:0;
height:50px;
background-color:black;
}
/* Les span qui se trouvent dans le footer */
footer span{
float:left;
width:25%;
height:5px;
}
.bleuban{
background-color:#637e9f;
}
.jauneban{
background-color:#e28913;
}
.vertban {
background-color:#2e9e6d
}
.rougeban {
background-color:#c1574c
}
li{
color:white;
display:inline-block;
}
.support{
float:left;
}
.achat{
width:4em;
margin-left:32%;
}
.info{
float:right;
margin-right:15px;
} |
