display: flex속성을 이용해서 간편하게 버튼 정렬하기

See the Pen display-flex by gogiso (@gogiso) on CodePen.

'pusblishing > CSS' 카테고리의 다른 글

cubic-bezier  (0) 2019.03.04
크로스브라우징에 대해서  (0) 2019.01.29
[CSS] 속성 축약형으로 작성하기   (0) 2018.07.11

신분증 사진

신분증 들고있는 본인사진

/*css*/.plus_area{width:100px; height:87px; background-color:#49d094; display:block; border-radius:15px; overflow:hidden; box-shadow: 0px 5px 20px rgba(0,69,191,0.2);}.plus_area p{width:30px; height:30px; background:#8adab2; color:white; font-size:28px; border-radius:50px; text-align:center; line-height:23px; margin:0 auto; margin-top:29px; font-weight:100;}.plus_area>img{width:100%; height:100%; float:left;}#imgInp1,#imgInp2{display:none;}.pic_tt{font-size:10px; color:#5a5a5a; text-align:center; width:100px;}.inline{ float: left; margin-right: 2%;}/*제이쿼리*/ function readURL1(input) { if (input.files && input.files[0]) { if( !(/image/i).test(input.files[0].type ) ){ alert('이미지파일을 선택해주세요.'); return false; } var reader = new FileReader(); reader.onload = function (e) { $('#blah1').attr({ src:e.target.result, style:'display:block' }); } reader.readAsDataURL(input.files[0]); } } function readURL2(input) { if (input.files && input.files[0]) { if( !(/image/i).test(input.files[0].type ) ){ alert('이미지파일을 선택해주세요.'); return false; } var reader = new FileReader(); reader.onload = function (e) { $('#blah2').attr({ src:e.target.result, style:'display:block' }); } reader.readAsDataURL(input.files[0]); } } $("#imgInp1").change(function(){ readURL1(this); }); $("#imgInp2").change(function(){ readURL2(this); });

내가 약한 부분 : 로고 그라데이션 넣는 기업형 ci 가 감이 안잡힌다 ㅇㅅㅇ,,

강점이자 특징 : 아기자기한 디자인

+ Recent posts