<![CDATA[
<p> </p><p><span style="color: #000000;">################### 로그인 페이지 css ###################</span></p><p> </p><p><span style="color: #000000;">body {</span></p><p><span style="color: #000000;">top: 50%;</span></p><p><span style="color: #000000;">left: 50%;</span></p><p><span style="color: #000000;">display: flex;</span></p><p><span style="color: #000000;">flex-direction: column;</span></p><p><span style="color: #000000;">justify-content: center;</span></p><p><span style="color: #000000;">align-items: center;</span></p><p> </p><p><span style="color: #000000;">}</span></p><p><span style="color: #000000;">.wrap {</span></p><p> </p><p><span style="color: #000000;">width: 100%;</span></p><p><span style="color: #000000;">height: 100%;</span></p><p><span style="color: #000000;">border: 1px solid lightgray;</span></p><p><span style="color: #000000;">padding: 10px 10px 10px 10px;</span></p><p><span style="color: #000000;">border-radius:8px;</span></p><p><span style="color: #000000;">}</span></p><p> </p><p><span style="color: #000000;">#logo {</span></p><p><span style="color: #000000;">width:150px;</span></p><p><span style="color: #000000;">height:150px;</span></p><p><span style="color: #000000;">}</span></p><p> </p><p><span style="color: #000000;">img {</span></p><p><span style="color: #000000;">width:150px;</span></p><p><span style="color: #000000;">height:150px;</span></p><p><span style="color: #000000;">}</span></p><p> </p><p> </p><p><span style="color: #000000;">#memId {</span></p><p><span style="color: #000000;">justify-content: center;</span></p><p><span style="color: #000000;">align-items: center;</span></p><p><span style="color: #000000;">width: 400px;</span></p><p><span style="color: #000000;">height: 38px;</span></p><p><span style="color: #000000;">font-size: 25px;</span></p><p><span style="color: #000000;">text-align: center;</span></p><p><span style="color: #000000;">border-radius:8px;</span></p><p><span style="color: #000000;">border: 1px solid lightgray;</span></p><p> </p><p> </p><p><span style="color: #000000;">}</span></p><p><span style="color: #000000;">#memId::placeholder{</span></p><p><span style="color: #000000;">color: #CFCFCF;</span></p><p><span style="color: #000000;">font-size: 18px;</span></p><p><span style="color: #000000;">}</span></p><p> </p><p><span style="color: #000000;">#memPw {</span></p><p><span style="color: #000000;">margin-top:0;</span></p><p><span style="color: #000000;">width: 400px;</span></p><p><span style="color: #000000;">height: 38px;</span></p><p><span style="color: #000000;">font-size: 25px;</span></p><p><span style="color: #000000;">text-align: center;</span></p><p><span style="color: #000000;">border-radius:8px;</span></p><p><span style="color: #000000;">border: 1px solid lightgray;</span></p><p><span style="color: #000000;">}</span></p><p> </p><p><span style="color: #000000;">#memPw::placeholder{</span></p><p><span style="color: #000000;">color:#CFCFCF;</span></p><p><span style="color: #000000;">font-size: 18px;</span></p><p> </p><p><span style="color: #000000;">}</span></p><p> </p><p><span style="color: #000000;">#submit {</span></p><p><span style="color: #000000;">margin-top:0;</span></p><p><span style="color: #000000;">width: 408px;</span></p><p><span style="color: #000000;">height: 45px;</span></p><p><span style="color: #000000;">font-size: 18px;</span></p><p><span style="color: #000000;">text-align: center;</span></p><p><span style="color: #000000;">background-color: #5D5D5D;</span></p><p><span style="color: #000000;">border-radius:8px;</span></p><p><span style="color: #000000;">border: 1px solid lightgray;</span></p><p><span style="color: #000000;">color:white;</span></p><p> </p><p><span style="color: #000000;">}</span></p><p> </p><p><span style="color: #000000;">p2 {</span></p><p><span style="color: #000000;">font-size: 20px;</span></p><p><span style="color: #000000;">color: gray;</span></p><p><span style="color: #000000;">}</span></p><p> </p><p><span style="color: #000000;">#button {</span></p><p><span style="color: #000000;">width: 460px;</span></p><p><span style="color: #000000;">height: 80px;</span></p><p><span style="color: #000000;">font-size: 18px;</span></p><p><span style="color: #000000;">text-align: center;</span></p><p><span style="color: #000000;">background-color: lightpink;</span></p><p><span style="color: #000000;">border-radius:3px;</span></p><p><span style="color: #000000;">border: 1px solid lightgray;</span></p><p><span style="color: #000000;">color:white;</span></p><p><span style="color: #000000;">}</span></p><p> </p><p><span style="color: #000000;">.tab {</span></p><p><span style="color: #000000;">display:flex;</span></p><p><span style="color: #000000;">flex-direction: row;</span></p><p><span style="color: #000000;">gap: 60px;</span></p><p><span style="color: #000000;">margin: 0;</span></p><p><span style="color: #000000;">}</span></p><p> </p><p><span style="color: #000000;">.tab .item1 a{</span></p><p><span style="color: #000000;">gap: 30px;</span></p><p><span style="color: #000000;">font-size : 12px;</span></p><p><span style="color: #000000;">color: gray;</span></p><p><span style="color: #000000;">text-decoration: none;</span></p><p><span style="color: #000000;">}</span></p><p> </p><p><span style="color: #000000;">.tab .item2 a{</span></p><p><span style="color: #000000;">gap: 30px;</span></p><p><span style="color: #000000;">font-size : 12px;</span></p><p><span style="color: #000000;">color: gray;</span></p><p><span style="color: #000000;">text-decoration: none;</span></p><p><span style="color: #000000;">}</span></p><p> </p><p><span style="color: #000000;">.tab .item3 a{</span></p><p><span style="color: #000000;">gap: 30px;</span></p><p><span style="color: #000000;">font-size : 12px;</span></p><p><span style="color: #000000;">color: gray;</span></p><p><span style="color: #000000;">text-decoration: none;</span></p><p><span style="color: #000000;">}</span></p><p> </p><p><span style="color: #000000;">.tab2 {</span></p><p><span style="color: #000000;">display:flex;</span></p><p><span style="color: #000000;">flex-direction: row;</span></p><p><span style="color: #000000;">gap: 30px;</span></p><p><span style="color: #000000;">margin: 0;</span></p><p><span style="color: #000000;">}</span></p><p> </p><p><span style="color: #000000;">.tab2 .item4 a{</span></p><p><span style="color: #000000;">gap: 30px;</span></p><p><span style="color: #000000;">font-size : 12px;</span></p><p><span style="color: #000000;">color: gray;</span></p><p><span style="color: #000000;">text-decoration: none;</span></p><p><span style="color: #000000;">}</span></p><p> </p><p><span style="color: #000000;">.tab2 .item5 a{</span></p><p><span style="color: #000000;">gap: 30px;</span></p><p><span style="color: #000000;">font-size : 12px;</span></p><p><span style="color: #000000;">color: gray;</span></p><p><span style="color: #000000;">text-decoration: none;</span></p><p><span style="color: #000000;">}</span></p><p> </p><p><span style="color: #000000;">.tab2 .item6 a{</span></p><p><span style="color: #000000;">gap: 30px;</span></p><p><span style="color: #000000;">font-size : 12px;</span></p><p><span style="color: #000000;">color: gray;</span></p><p><span style="color: #000000;">text-decoration: none;</span></p><p><span style="color: #000000;">}</span></p><p> </p><p>#################### Musichot css #####################</p><p> </p><p><span style="color: #000000;">@charset "EUC-KR";</span></p><p> </p><p><span style="color: #000000;">body{</span></p><p><span style="color: #000000;">width:100%;</span></p><p><span style="color: #000000;">height:100%;</span></p><p><span style="color: #000000;">color: gray;</span></p><p><span style="color: #000000;">}</span></p><p><span style="color: #000000;">.container1 {</span></p><p><span style="color: #000000;">display:flex;</span></p><p><span style="color: #000000;">justify-content: space-around</span></p><p> </p><p><span style="color: #000000;">}</span></p><p><span style="color: #000000;">.container1 .album1{</span></p><p><span style="color: #000000;">border:1px solid lightgray;</span></p><p><span style="color: #000000;">padding:15px 15px 15px 15px;</span></p><p><span style="color: #000000;">margin-bottom:20px;</span></p><p><span style="color: #000000;">}</span></p><p><span style="color: #000000;">.container1 .album2{</span></p><p><span style="color: #000000;">border:1px solid lightgray;</span></p><p><span style="color: #000000;">padding:15px 15px 15px 15px;</span></p><p><span style="color: #000000;">margin-bottom:20px;</span></p><p><span style="color: #000000;">}</span></p><p><span style="color: #000000;">.container2 {</span></p><p><span style="color: #000000;">display:flex;</span></p><p><span style="color: #000000;">justify-content: space-around</span></p><p><span style="color: #000000;">}</span></p><p><span style="color: #000000;">.container2 .album3{</span></p><p><span style="color: #000000;">border:1px solid lightgray;</span></p><p><span style="color: #000000;">padding:15px 15px 15px 15px;</span></p><p><span style="color: #000000;">margin-bottom:20px;</span></p><p><span style="color: #000000;">}</span></p><p><span style="color: #000000;">.container2 .album4{</span></p><p><span style="color: #000000;">border:1px solid lightgray;</span></p><p><span style="color: #000000;">padding:15px 15px 15px 15px;</span></p><p><span style="color: #000000;">margin-bottom:20px;</span></p><p><span style="color: #000000;">}</span></p><p> </p><p> </p><p> </p>
<!-- -->
]]>
카페 게시글
허진서님
css 스타일링
팅커벨
추천 0
조회 6
23.05.11 22:44
댓글 0
다음검색
