스파르타 1주차 숙제 - 상품 판매페이지 작성

================================================

<!doctype html>
<html lang="en">

<head>
    <!-- Required meta tags -->
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

    <!-- Bootstrap CSS -->
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css"
        integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">

    <!-- Optional JavaScript -->
    <!-- jQuery first, then Popper.js, then Bootstrap JS -->
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js"
        integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q"
        crossorigin="anonymous"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"
        integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl"
        crossorigin="anonymous"></script>

    <title>상품 판매 사이트</title>
 
<link href="https://fonts.googleapis.com/css2?family=Nanum+Myeongjo&display=swap" rel="stylesheet">
    <style>* {
            font-family: 'Nanum Myeongjo', serif;
            }
        div.버튼 {
            margin:auto;
            width: 300px;
            padding: 50px 20px;
            text-align:center;


            }
        div.내용 {
            margin:auto;
            padding: 15px;
            text-align:center;

            color:magenta;
            font-size: 16px;

        }

        .mytitle4 {
            margin: auto;
            width: 500px;
            background-color:blue ;
            color: white;

            height: 200px;

            background-image: url("https://mp-seoul-image-production-s3.mangoplate.com/keyword_search/meta/pictures/mx_pxagniork7ma4.png");
            background-position: center;
            background-size: cover;
            border-radius: 5px;
            text-align: justify;
            padding-top: 200px;
        }
        .wrap {
            margin: auto;
            width: 500px;
        }
    </style>




</head>

 <body>
  <div class="wrap">

  <div class="mytitle4">

        </div>

      <div class="내용">
          <h2>김밥 팝니당😁</h2>
            <h4>야채,참치,치즈김밥 팔아요</h4>
            <h5> 010-1234-5678 매주 월요일 쉽니다다</h5>
     </div>

    <div class="input-group mb-3">
  <div class="input-group-prepend">
    <span class="input-group-text" id="inputGroup-sizing-default">주문자 이름</span>
  </div>
  <input type="text" class="form-control" aria-label="Default" aria-describedby="inputGroup-sizing-default">
</div>
<!-- 주문자 이름 -->
  <div class="input-group mb-3">
  <div class="input-group-prepend">
    <span class="input-group-text" id="inputGroup-sizing-default">주소</span>
  </div>
  <input type="text" class="form-control" aria-label="Default" aria-describedby="inputGroup-sizing-default">
</div>
<!--주소-->
  <div class="input-group mb-3">
  <div class="input-group-prepend">
    <span class="input-group-text" id="inputGroup-sizing-default">전화번호</span>
  </div>
  <input type="text" class="form-control" aria-label="Default" aria-describedby="inputGroup-sizing-default">
</div>
<!--전화번호-->
  <div class="input-group mb-3">
  <div class="input-group-prepend">
    <label class="input-group-text" for="inputGroupSelect01">주문 수량</label>
  </div>
  <select class="custom-select" id="inputGroupSelect01">
<!--    <option selected>Choose...</option>-->
    <option value="1">1개</option>
    <option value="2">2개</option>
    <option value="3">3개</option>
  </select>
</div>




  <div class = "버튼">
    <button class="btn btn-primary" type="submit">주문하기</button>
  </div>


  </div>
</body>

</html>

Author And Source

이 문제에 관하여(스파르타 1주차 숙제 - 상품 판매페이지 작성), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://velog.io/@kgw5911/스파르타-1주차-숙제-상품-판매페이지-작성

우수한 개발자 콘텐츠 발견에 전념 (Collection and Share based on the CC Protocol.)

스파르타 1주차 숙제 - 상품 판매페이지 작성

Author And Source

좋은 웹페이지 즐겨찾기