목록전체 글 (192)
jineecode
1. 네트워크 로딩 체크 (3초 이내) 2. image 크기 압축. imagecompressor.com/ Online Image Сompressor Optimizilla is the ultimate image optimizer to compress your images in JPEG and PNG formats to the minimum possible size. imagecompressor.com www.iloveimg.com/resize-image Resize multiple images at once! Resize multiple JPG, PNG, SVG or GIF images in seconds for free. Bulk resize by defining pixels or percentages...
첫 번째 프로젝트를 수행했을 땐 검색 form을 post 형식으로 사용했었다. 이럴 때 생기는 문제는 페이지 이동이 불편해지는데에 있다. method=POST 형식으로 쓰인 검색 폼 뒤로 가기를 눌렀더니...? 이러한 점 때문에 검색 내용과 검색 유형은 GET 방식으로 받아온다. 서버의 정보를 바꾸는 게 아니라, 서버에 값을 전달하고 그 값을 토대로 데이터를 얻어오는 것이기 때문이다. 진행중인 프로젝트에서 method를 get 방식으로 바꾸어주었다. 전체 제목 내용 별 차이가 없어보이지만 주소창에 변화가 생긴다 뒤로가기를 눌러도 제대로 표시가 된다. 깃허브
먼저 저는 php를 전문적으로 공부하지 않았으며 문제 해결 기록용으로 남깁니다. 제가 구현하는 게시판은 키 값이 글 번호이며 이러한 로직은 게시판의 게시물이 삭제되었을 때 문제가 발생한다는 것을 염두해주세요. 게시판 테이블 테이블명: opc_qna 컬럼명은 아래와 같습니다. qna.php opc_qna 테이블로부터 5개까지만 역순으로 OPC_QNA_num를 불러옵니다. 쿼리를 날려주고 while 반복문을 작성해줍니다. 게시판 제목에 걸려있는 태그 $qna_detail_num=$_GET['num']; 주소창 뒤에 붙은 num을 get방식으로 가져와 $qna_detail_num 에 저장합니다. // 해당 게시물 정보 위와 같은 방식으로 opc_qna 테이블을 불러옵니다. 달라진 점은 hit 수 증가인데 이 ..
textarea에 있는 text를 데이터에 저장할 때 nl2br을 써서 저장하는데, 이 게시글을 수정하려고 하였을 때 이 딸려오는 문제. 대략 이런 느낌이다. qna_insert.php 코드 '$qna_desc' 가 'textarea' 자리이다.
순조롭게 font-face로 편하게 폰트 작업을 하던 와중 내 눈에 밟히는 이상한 현상이 발견되었으니... 뭐지 이 따로 노는 폰트의 콜라보는...? 급히 렌더링 된 폰트를 확인해보았다. input 태그: 맑은 고딕 textarea 태그: gulimche button 태그: 맑은 고딕 WHAT....? 멘붕이 온 나머지 구글에 검색을 해보았더니 다음 요소는 body에 걸린 font-family에 상속받지 않는다고 한다. stackoverflow.com/questions/2874813/why-textarea-and-textfield-not-taking-font-family-and-font-size-from-body
nav 로직 menu를 클릭했을 때 클릭 이벤트가 발생하여 해당 nav에 show 클래스가 들어가게 되고, show 클래스에 미리 따로 스타일을 주어 nav를 화면에 비추어준다. 이번에 적용한 nav는 위에서 아래로 내려오는 구조이다. header__nav를 평소에는 top: -150%를 주었다가 show가 들어가면 top: 0%를 주는 스타일. position은 fixed로 주었는데 이때 창의 높이가 낮아졌을 때 nav가 화면에 먹히게 되는 문제가 생겼다. 내비게이션이 잘림 HTML 오픈콘서트 공연목록 공지사항 Q&A 굿즈스토어 /* NAV */ .header__nav { width: 100%; height: 100%; position: fixed; top: -150%; left: 0; backgrou..
나는 보통 css로 폰트 스타일을 줄 때 @import url ( ~ ) 을 하여 body {font-family: ~ 를 적용하지만 한글과 영어에 다른 폰트를 적용하고 싶을 때 몹시 일이 번거로워진다. 퍼블리싱을 하면서 해당 컨텐츠가 영어인지 한글인지 확인하기도 귀찮고 계속 font-family: ~~ 를 적는 것도 귀찮고 심지어 font-family는 자동완성을 안 해준다. 근본적인 해결은 안 되는 기분에 더 쉽게 해결할 수 있는 방법을 찾아보았다. @font-face 지시어를 사용하면 된다. font-face에 대한 깊은 이해와 설명은 설명이 아주 잘 되어있는 블로그로 대체한다. webclub.tistory.com/261 Web Font - @font-face 적용 방법 Font(서체)의 사용 좀 ..
content의 높이가 작으면 footer 가 아래에 있지 않고 애매하게 중간에 있는 경우가 있다. 관리자도구를 확인해보면 html 자체의 높이가 작아서 나타나는 문제이다. 컨텐츠만큼 html의 height가 auto로 늘어나있기 때문에 height를 100%로 맞춰준다. 차례로 컨텐츠를 감싸고 있는 body에 height: 100%를 주고 wrap을 min-height : 100%; 으로 맞춰준다. (wrap이 min-height가 아닌 height: 100%;를 주면 창의 높이를 낮춰봤을 때 footer가 wrap 중간에 오고만다.) wrap 안에 담길 footer 자리를 아래에 만들어주자. padding-bottom 으로 footer 높이 만큼의 높이를 남겨준다. 또한 footer의 부모가 wrap..