stevemuir6.github.io

  • N8_679986
    了解作者
  • 4.6KB
    文件大小
  • zip
    文件格式
  • 0
    收藏次数
  • VIP专享
    资源类型
  • 0
    下载次数
  • 2022-06-03 17:46
    上传日期
stevemuir6.github.io
stevemuir6_github_io-main.zip
  • stevemuir6.github.io-main
  • index.html
    4.9KB
  • script.js
    1.1KB
  • script.babel
    1.1KB
  • style.css
    2.8KB
内容介绍
<!DOCTYPE html> <html lang="en" > <head> <meta charset="UTF-8"> <title>CodePen - Greatest Guitar Player survey</title> <link rel="stylesheet" href="./style.css"> </head> <body> <!-- partial:index.partial.html --> <script src="https://cdn.freecodecamp.org/testable-projects-fcc/v1/bundle.js"></script> <!-- Hello Camper! For now, the test suite only works in Chrome! Please read the README below in the JS Editor before beginning. Feel free to delete this message once you have read it. Good luck and Happy Coding! - The freeCodeCamp Team --> <div class="container"> <header> <h1 id="title" class="text-center">The Greatest Guitar Player of All Time? </h1> <p id="description" class="description text-center"> Help me decide for once and for ALL Time! </p> </header> <form id="survey-form"> <div class="form-group"> <label id="name-label" for="name">Shredder:</label> <input type="text" id="name" name="name" placeholder="Choose Wisely" required> </div> <div class="form-group"> <label id="email-label" for="e-mail"> E-mail:</label> <input type="email" name="email" id="email" class="form-control" placeholder="Enter your Email" required /> </div> <div class="form-group"> <label id="number-label" for="number"> Shred Cred:<span class="clue"></span></label> <input type="number" name="years shredding" id="number" min="1" max="69" class="form-control" placeholder="Years shredding?" required /> </div> <div class="form-group"> <p>Whats your shred style?</p> <select id="dropdown" name="role" class="form-control" required> <option disabled selected value>Select Favorite Style</option> <option value="50rock">'50's Rock 'n Roll</option> <option value="60rock">'60's Psychedelic Rock</option> <option value="70rock">'70's Acid Rock</option> <option value="80rock">'80's Hair Metal</option> <option value="90rock">'90's Grunge</option> <option value="00rock">'00's Nu Metal</option> </select> </div> <div class="form-group"> <p>How Many Axes Do You Own?</p> <label> <input name="user-recommend" value="1-3" type="radio" class="input-radio" checked />1-3</label> <label> <input name="user-recommend" value="4-7" type="radio" class="input-radio" />4-7</label> <label> <input name="user-recommend" value="5-9" type="radio" class="input-radio" />5-9</label> <label> <input name="user-recommend" value=">10" type="radio" class="input-radio" />10 or more</label> </div> <div class="form-group"> <p>Whats most important to your style?</p> <select id="most-like" name="most-like" class="form-control" required> <option disabled selected value>Select an option</option> <option value="Tone">Tone</option> <option value="Feel">Feel</option> <option value="Soul">Soul</option> <option value="Speed">Speed</option> <option value="Technique">Technique</option> <option value="Hair">Hair</option> </select> </div> <div class="form-group"> <p>Type of Pick-ups That You Own</p> <span class="clue"> (Check all that apply)</span> </p> <label> <input name="prefer" value="humbucker" type="checkbox" class="input-checkbox" />Humbucker </label> <label> <input name="prefer" value="single-coil" type="checkbox" class="input-checkbox" />Single-coil </label> <label> <input name="prefer" value="p90" type="checkbox" class="input-checkbox" />P-90 </label> <label> <input name="prefer" value="soapbar" type="checkbox" class="input-checkbox" />Soapbar </label> </div> <div class="form-group"> <p>Additional comments?</p> <textarea id="comments" class="input-textarea" name="comment" placeholder="Explain why you love your choice...."></textarea> </div> <div class="form-group"> <button type="submit" id="submit" class="submit-button">Submit</button> </div> </form> </div> <!-- partial --> <script src="./script.js"></script> </body> </html>
评论
    相关推荐