-3
我有一個簡單的html與我們聯繫的dropbox，它允許我選擇多個selections中的一個，並將其發送到我的電子郵件，但我想要它，所以如果可能，我可以選擇多個選項。病包括HTML和聯繫我們PHP的聯繫我們html複選框論壇
的CSSS
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font: inherit;
vertical-align: baseline;
}
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
display: block;
}
body {
line-height: 1;
}
ol, ul {
list-style: none;
}
blockquote, q {
quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
content: '';
content: none;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
#skills {
color:F0F8FF;
}
.about {
margin: 70px auto 40px;
padding: 8px;
width: 260px;
font: 10px/18px 'Lucida Grande', Arial, sans-serif;
color: #bbb;
text-align: center;
text-shadow: 0 -1px rgba(0, 0, 0, 0.3);
background: #383838;
background: rgba(34, 34, 34, 0.8);
border-radius: 4px;
background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.3));
background-image: -moz-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.3));
background-image: -o-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.3));
background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.3));
-webkit-box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.2), 0 0 6px rgba(0, 0, 0, 0.4);
box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.2), 0 0 6px rgba(0, 0, 0, 0.4);
}
.about a {
color: #eee;
text-decoration: none;
border-radius: 2px;
-webkit-transition: background 0.1s;
-moz-transition: background 0.1s;
-o-transition: background 0.1s;
transition: background 0.1s;
}
.about a:hover {
text-decoration: none;
background: #555;
background: rgba(255, 255, 255, 0.15);
}
.about-links {
height: 30px;
}
.about-links > a {
float: left;
width: 50%;
line-height: 30px;
font-size: 12px;
}
.about-author {
margin-top: 5px;
}
.about-author > a {
padding: 1px 3px;
margin: 0 -1px;
}
/*
* Copyright (c) 2013 Thibaut Courouble
* http://www.cssflow.com
*
* Licensed under the MIT License:
* http://www.opensource.org/licenses/mit-license.php
*/
::-moz-focus-inner {
padding: 0;
border: 0;
}
:-moz-placeholder {
color: #879fa6 !important;
}
::-webkit-input-placeholder {
color: #879fa6;
}
:-ms-input-placeholder {
color: #879fa6 !important;
}
body {
font: 12px/20px 'Lucida Grande', Verdana, sans-serif;
color: #404040;
background: #e4ecef;
}
input, textarea, select, label {
font-family: inherit;
font-size: 12px;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.contact {
position: relative;
margin: 50px auto;
padding: 5px;
width: 320px;
background: #eef5f7;
border: 1px solid #cfd5da;
border-bottom-color: #ccd1d6;
border-radius: 3px;
-webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05);
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05);
}
.contact-inner {
padding: 25px;
background: white;
border-radius: 2px;
}
.contact:before, .contact:after, .contact-inner:before, .contact-inner:after {
content: '';
position: absolute;
top: 100%;
left: 50%;
margin-left: -6px;
width: 1px;
height: 1px;
border: outset transparent;
border-width: 12px 14px 0;
border-top-style: solid;
-webkit-transform: rotate(360deg);
}
.contact:before {
margin-top: 1px;
border-top-color: #d8e1e6;
}
.contact-inner:before {
border-top-color: #ccd1d6;
}
.contact-inner:after {
margin-top: -1px;
border-top-color: #eef5f7;
}
.contact:after {
margin-top: -8px;
border-top-color: white;
}
.contact-input {
overflow: hidden;
margin-bottom: 30px;
padding: 5px;
background: #eef7f9;
border-radius: %px;
}
.contact-input > input, .contact-input > textarea {
display: block;
width: 100%;
height: 29px;
padding: 0 9px;
color: #4d5a5e;
background: white;
border: 1px solid #cfdfe3;
border-bottom-color: #d2e2e7;
border-radius: 2px;
-webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.05), 0 1px rgba(255, 255, 255, 0.2);
box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.05), 0 1px rgba(255, 255, 255, 0.2);
}
.contact-input > input:focus, .contact-input > textarea:focus {
border-color: #93c2ec;
outline: 0;
-webkit-box-shadow: 0 0 0 8px #e1ecf5;
box-shadow: 0 0 0 8px #e1ecf5;
}
.lt-ie9 .contact-input > input, .lt-ie9 .contact-input > textarea {
line-height: 27px;
}
.contact-input > textarea {
padding: 4px 8px;
height: 90px;
line-height: 20px;
resize: none;
}
#email {
color:purple; /*target element with id email and set text color to blue*/
}
#name {
color: purple; /*target element with id name and set text color to red*/
}
#skype {
color: purple; /*target element with id skype and set text color to green*/
}
#skills {
color: purple; /*target element with id why and set text color to orange. in this case, its a select, so all the text within the select - meaning the options text- is orange*/
}
#participate {
color: purple; /*target elements with class yellow (options) inside element id participate (select) and set text color to yellow. in this case, you can select which options to make yellow by adding classes*/
}
#interested {
color: purple; /*target elements with class yellow (options) inside element id participate (select) and set text color to yellow. in this case, you can select which options to make yellow by adding classes*/
}
#message {
color: purple; /*target element with id message and set text color to purple*/
}
#findus {
color: purple; /*target element with id message and set text color to purple*/
}
.select {
display: block;
position: relative;
overflow: hidden;
background: white;
border: 1px solid #d2e2e7;
border-bottom-color: #c5d4d9;
border-radius: 2px;
background-image: -webkit-linear-gradient(top, #fcfdff, #f2f7f7);
background-image: -moz-linear-gradient(top, #fcfdff, #f2f7f7);
background-image: -o-linear-gradient(top, #fcfdff, #f2f7f7);
background-image: linear-gradient(to bottom, #fcfdff, #f2f7f7);
-webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06);
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06);
}
.select:before, .select:after {
content: '';
position: absolute;
right: 11px;
width: 0;
height: 0;
border-left: 3px outset transparent;
border-right: 3px outset transparent;
}
.select:before {
top: 10px;
border-bottom: 3px solid #7f9298;
}
.select:after {
top: 16px;
border-top: 3px solid #7f9298;
}
.select > select {
position: relative;
z-index: 2;
width: 112%;
height: 29px;
line-height: 17px;
padding: 5px 9px;
padding-right: 0;
color: #80989f;
background: transparent;
background: rgba(0, 0, 0, 0);
border: 0;
-webkit-appearance: none;
}
.select > select:focus {
color: #4d5a5e;
outline: 0;
}
.contact-submit {
text-align: right;
}
.contact-submit > input {
display: inline-block;
vertical-align: top;
padding: 0 14px;
height: 29px;
font-weight: bold;
color: #729fb2;
text-shadow: 0 1px rgba(255, 255, 255, 0.5);
background: #deeef4;
border: 1px solid #bed6e3;
border-bottom-color: #accbd9;
border-radius: 15px;
cursor: pointer;
background-image: -webkit-linear-gradient(top, #e6f2f7, #d0e6ee);
background-image: -moz-linear-gradient(top, #e6f2f7, #d0e6ee);
background-image: -o-linear-gradient(top, #e6f2f7, #d0e6ee);
background-image: linear-gradient(to bottom, #e6f2f7, #d0e6ee);
-webkit-box-shadow: inset 0 1px rgba(255, 255, 255, 0.2), 0 1px 1px rgba(0, 0, 0, 0.06), 0 0 0 4px #eef7f9;
box-shadow: inset 0 1px rgba(255, 255, 255, 0.2), 0 1px 1px rgba(0, 0, 0, 0.06), 0 0 0 4px #eef7f9;
}
.contact-submit > input:active {
color: #6a95a9;
text-shadow: 0 1px rgba(255, 255, 255, 0.3);
background: #c9dfe9;
border-color: #a3bed0 #b5ccda #b5ccda;
-webkit-box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.1), 0 1px rgba(255, 255, 255, 0.2), 0 0 0 4px #eef7f9;
box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.1), 0 1px rgba(255, 255, 255, 0.2), 0 0 0 4px #eef7f9;
}
<form name="enq" method="post" action="email/" onsubmit="return validation();">
<fieldset class="contact-inner">
<p class="contact-input">
<input type="text" id="email" value="Your Email.." name="email" placeholder="Your Email..." autofocus>
<input type="text" id="name" value="Your Full Name" name="name" placeholder="Your Full Name." autofocus>
<input type="text" id="skype" value="Your Skype Name" name="skype" placeholder="Your Skype Name." autofocus>
<input type="text" id="findus" value="How Did You Find Us" name="findus" placeholder="How did you find us." autofocus>
</p>
<div id="skills">
<p class="contact-input">
<label for="select" class="select">
<select name="skills" id="skills">
<option value="" selected>Skills</option>
<option value="3D Printing">3D Printing</option>
<option value="Alternative Healers">Alternative Healers</option>
<option value="Aquaponics/Hydroponics">Aquaponics/Hydroponics</option>
<option value="Architecture/Design">Architecture/Design</option>
<option value="Cabinetry/Carpentry">Cabinetry/Carpentry</option>
<option value="Construction">Construction</option>
<option value="Culinary Arts">Culinary Arts</option>
<option value="Electrician">Electrician</option>
<option value="EM Technology">EM Technology</option>
<option value="Free Energy/QEG">Free Energy/QEG</option>
<option value="Hair and/or Nail Stylist">Hair and/or Nail Stylist</option>
<option value="Hemp Farming">Hemp Farming</option>
<option value="Hempcrete">Hempcrete</option>
<option value="Kundalini8 Practitioner">Kundalini8 Practitioner</option>
<option value="Landscaping">Landscaping</option>
<option value="Massage Therapist">Massage Therapist</option>
<option value="Qi Gong Practitioners">Qi Gong Practitioners</option>
<option value="Permaculture">Permaculture</option>
<option value="Recycling">Recycling</option>
<option value="Sewing">Sewing</option>
<option value="Tai Chi Practitioner">Tai Chi Practitioner</option>
<option value="Technology">Technology</option>
<option value="Other">Other</option>
<option value="All">All</option>
<option value="None">None</option>
</select>
<label for="select" class="select">
<select name="participate" id="participate">
<option value="" selected>When can you participate?</option>
<option value="3-6 months from now">3-6 months from now</option>
<option class="purple" value="6-12 months">6-12 months</option>
<option value="Next Year (2016)">Next Year (2016)</option>
<option class="purple" value="Community Crowd Funding">Community Crowd Funding</option>
</select>
</select>
<label for="select" class="select">
<select name="interested" id="interested">
<option value="" selected>I'm interested in</option>
<option value="Include me on Visionary Circle">Include me on Visionary Circle</option>
<option class="purple" value="Can Travel">Can Travel</option>
<option value="Benefactor">Benefactor</option>
<option class="purple" value="Community Crowd Funding">Community Crowd Funding</option>
<option value="Financial Contributor">Financial Contributor</option>
<option value="Have a similar project">Have a similar project</option>
<option value="Special Interest">Special Interest</option>
<option value="Skilled">Skilled</option>
<option value="Skype Chat">Skype Chat</option>
<option value="All">All</option>
<option value="None">None</option>
</select>
</label>
</p>
<p class="contact-input">
<textarea rows="11" name="message" id="message" placeholder="Your Message…">Your Message…</textarea>
</p>
<p class="contact-submit">
<input type="submit" value="Send Your Message" name="submit" id="submitButton" class="btn btn-info pull-right" title="Click here to submit your message!" />
</p>
</fieldset>
</form>
<?php
if(isset($_POST['submit']))
{
$skills = $_POST['skills'];
$email = $_POST['email'];
$name = $_POST['name'];
$participate = $_POST['participate'];
$interested = $_POST['interested'];
$skype = $_POST['skype'];
$findus = $_POST['findus'];
$query = $_POST['message'];
$email_from = $name.'<'.$email.'>';
$to="";
$subject="Contact Form PurpleParadise!";
$headers = 'MIME-Version: 1.0' . "\r\n";
$headers .= 'Content-type: text/html; charset=iso-8859-1' . "\r\n";
$headers .= "From: ".$email_from."\r\n";
$message="
skills:
$skills
<br>
Email-Id:
$email
<br>
name:
$name
<br>
participate:
$participate
<br>
interested:
$interested
<br>
findus:
$findus
<br>
Message:
$query
";
if(mail($to,$subject,$message,$headers))
header("Location:../contact-us.html?msg=Successful Submission! Thankyou for contacting us.");
else
header("Location:../contact-us.html?msg=Error To send Email !");
//contact:[email protected]
}
?>
您是否嘗試過在發佈您的問題之前搜索？這是一個很好的開始，以檢查是否有人曾經有過同樣的問題。有一些類似於你在這裏試圖做的事情：http://stackoverflow.com/questions/14026361/php-multiple-checkbox-array –
這很好。但是你有沒有編程問題？這個網站是爲了問題，而不是「我想...（你爲我做我的工作）」待辦事項清單傾銷 –