Quel type de programmation pour créé un site

Fermé

calatador Messages postés 14 Date d'inscription dimanche 21 novembre 2010 Statut Membre Dernière intervention 19 juin 2011 - 11 mars 2011 à 22:38
Sixtinestudio Messages postés 72 Date d'inscription vendredi 11 mars 2011 Statut Membre Dernière intervention 14 juillet 2011 - 11 mars 2011 à 22:59

Bonjour,

quel type de programmation pour créé un site qui se base sur de 2 image au centre

exemple

http://tunistwestival.com/

ou le deux image sont
http://tunistwestival.com/img/page_background.png
http://tunistwestival.com/img/body_background.jpg

A voir également:

Quel type de programmation pour créé un site
Site de telechargement - Guide
Site de vente entre particulier - Guide
Créer un compte gmail - Guide
Créer un compte google - Guide
Site inaccessible - Guide

1 réponse

Réponse 1 / 1

Sixtinestudio Messages postés 72 Date d'inscription vendredi 11 mars 2011 Statut Membre Dernière intervention 14 juillet 2011 46
11 mars 2011 à 22:45

Quelle est la question ?

Avec quoi a été fait ce site ?
XHTML et CSS pour l'affichage
PHP pour envoyer le formulaire sur un bdd je suppose.

calatador Messages postés 14 Date d'inscription dimanche 21 novembre 2010 Statut Membre Dernière intervention 19 juin 2011
11 mars 2011 à 22:48

merci pour votre repense
mais peut tu me montre comment je peut faire la partie d'affichage?

Sixtinestudio Messages postés 72 Date d'inscription vendredi 11 mars 2011 Statut Membre Dernière intervention 14 juillet 2011 46
11 mars 2011 à 22:59

Le html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
	<meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
	<title>Tunis Twestival </title>
	<link type="text/css" rel="stylesheet" href="css/style.css" media="all" />
	<script type="text/javascript">

	  var _gaq = _gaq || [];
	  _gaq.push(['_setAccount', 'UA-21930038-1']);
	  _gaq.push(['_trackPageview']);

	  (function() {
		var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
		ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
		var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
	  })();

	</script>
	</head>
<body>
	<div id="page">

		<div id="main">
			<div id="leftCol">
				<form action="" method="post" id="inscriptionForm" onsubmit="return veriForm(this)">
					<div class="line">
						<input type="text" class="field" name="name" id="name" />
						<label class="label" for="name">Nom</label>
					</div>
					<div class="line">

						<input type="text" class="field" name="aftername" id="aftername" />
						<label class="label" for="after-name">Prénom</label>
					</div>
					<div class="line">
						<div class="field">
							<input type="radio" name="gender" id="Mr" value="Mr" />
							<label for="Mr">Mr</label>
							
							<input type="radio" name="gender" id="Mlle" value="Mlle" />

							<label for="Mlle">Mlle</label>
							
							<input type="radio" name="gender" id="Mme" value="Mme" />
							<label for="Mme">Mme</label>
						</div>
						<label class="label" class="label">Civilité</label>
					</div>
					<div class="line">

						<input type="text" class="field" name="email" id="email" />
						<label class="label" for="email">E-mail</label>
					</div>
					<div class="line">
						<input type="text" class="field" name="mobile" id="mobile" />
						<label class="label" for="mobile">Mobile</label>
					</div>
					<span class="caption">Tous les champs sont obligatoires</span>

					<input type="submit" class="submit noTxt" value="Inscription" />
					<script type="text/javascript">
						function veriForm(form){
							var $gender = "";
							var mobileRegex = new RegExp(/^(99|98|97|96|95|94|93|55|50|40|20|21|22|23|24|25|26|27)[0-9]{6}/gi);
							var mailRegex = new RegExp('^[a-z0-9]+([_|\.|-]{1}[a-z0-9]+)*@[a-z0-9]+([_|\.|-]{1}[a-z0-9]+)*[\.]{1}[a-z]{2,6}$', 'i');
							for( i = 0; i < form.gender.length; i++ ){
								if( form.gender[i].checked == true )
									$gender = form.gender[i].value;
							}
							
							if(form.name.value == ""){
								alert("Veuillez indiquer votre nom")
								return false;
							}
							
							if(form.aftername.value == ""){
								alert("Veuillez indiquer votre prénom")
								return false;
							}
							
							if($gender == ""){
								alert("Veuillez indiquer votre civilité")
								return false;
							}
							
							if(!mailRegex.test(form.email.value)){
								alert("Veuillez indiquer une adresse E-mail correcte")
								return false;
							}
							
							if(!mobileRegex.test(form.mobile.value)){
								alert("Veuillez indiquer un numéro mobile correcte")
								return false;
							}
							return true;
						}
					</script>
				</form>
			</div>
			<div id="rightCol">
				<p><b>Twestival se déroule dans plus de 200 villes au Monde simultanément. C'est un rassemblement d'internautes, soutenant une cause locale ou globale.</b></p>
				<p>Twestival est la plus grande initiative globale de collecte de fonds réalisée à travers les  média sociaux. Depuis 2009, les bénévoles ont amassé près de 1,2 million de dollars pour 137 organismes sans but lucratif. Tous les événements  locaux sont organisés à 100% par des bénévoles et 100% des ventes de billets ainsi que des dons vont directement aux projets.<br />Cette année et pour la première fois en Tunisie les fond seront reversés a l'association Les chomeurs de Rayhana</p>

				<p>
					<b>
						<span>JEUDI 24 MARS 2011de 20H à Minuit à l'acropolium de carthage</span><br />billet 10 DT<br />dons: 30, 50 et 100 DT
					</b>
				</p>
				<div class="sponsors">
					<span class="label">Les sponsors :</span>
					<div class="picKeeper">

						<img src="img/partners.gif" alt="Code - Syauctura - Tunisie Telecom - Hexabyte" />
					</div>
				</div>
				<div class="miniLink"><a href="https://www.facebook.com/tunistwestival" target="_blank">Facebook</a> | <a href="https://twitter.com/tunistwestival" target="_blank">Twitter</a></div>
			</div>
		</div>
	</div>

</body>
</html>

le css :

*{
	padding:0;
	margin:0;
	border:none;
	outline:0;
	list-style:none;
}
.noTxt{
	text-align:left !important;
	font-size:0 !important;
	line-height:0 !important;
	text-indent:-9999px !important;
	overflow:hidden !important;
}
body{
	font-size:12px;
	color:#858585;
	font-family:Arial, Helvetica, sans-serif;
	background:#528dab url(../img/body_background.jpg) top center no-repeat;
}
#page{
	width:100%;
	overflow:hidden;
	background:url(../img/page_background.png) center top no-repeat;
}
#main{
	width:876px;
	margin:0 auto;
	padding:360px 81px 20px;
	overflow:hidden;
}
#leftCol{
	position:relative;
	float:left;
	width:365px;
	height:400px;
	padding-top:30px;
}
#leftCol .line{
	clear:both;
	padding:8px 0;
	overflow:hidden;
}
#leftCol .line .label{
	float:right;
	line-height:30px;
	padding-right:15px;
	color:#858585;
	font-size:14px;
	font-weight:bold;
}
#leftCol .line .field{
	float:right;
	height:30px;
	width:243px;
	font-size:14px;
	color:#666665;
	overflow:hidden;
}
#leftCol .line input.field{
	width:233px;
	padding:0 5px;
	font-size:12px;
	color:#858585;
	background:url(../img/input_background.gif) right bottom no-repeat;
}
#leftCol .line .field label{
	cursor:pointer;
	line-height:30px;
	margin:0 20px 0 5px;
}
#leftCol .caption{
	display:block;
	width:243px;
	float:right;
	padding-left:5px;
	color:#858585;
	font-size:11px;
}
#leftCol .submit{
	position:absolute;
	bottom:27px;
	right:55px;
	display:block;
	height:90px;
	width:230px;
	cursor:pointer;
	background:none;
}
#rightCol{
	position:relative;
	float:left;
	width:460px;
	height:400px;
	overflow:hidden;
	padding-left:25px;
}
#rightCol .sponsors{
	height:40px;
	padding-top:20px;
	overflow:hidden;
}
#rightCol .sponsors .label{
	float:left;
	line-height:40px;
	padding-right:10px;
	color:#5d9fc1;
	font-size:12px;
	font-weight:bold;
}
#rightCol .sponsors .picKeeper{
	float:left;
	height:40px;
	line-height:40px;
	overflow:hidden;
}
#rightCol .miniLink{
	position:absolute;
	bottom:0px;
	right:0;
	color:#FFF;
	font-size:12px;
	line-height:39px;
}
#rightCol .miniLink a{
	color:#FFF;
	padding:0 5px;
	text-decoration:none;
}
#rightCol .miniLink a:hover{
	text-decoration:underline;
}
#rightCol p{
	display:block;
	font-size:14px;
	color:#858585;
	padding:7px 0;
	overflow:hidden;
	text-align:justify;
}
#rightCol p b{
	color:#686868;
}
#rightCol p a{
	color:#ea4353;
	text-decoration:underline;
}
#rightCol p span{
	color:#5d9fc1;
}

Discussions similaires

'Votre colis est dans le site de livraison qui dessert votre adresse' que faire

programme qui n'affiche pas le mot secret

Colis en cours de transport vers votre site de livraison ?

créer une adresse gmail pour une autre personne

Discussions similaires

Newsletters