일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | |||
5 | 6 | 7 | 8 | 9 | 10 | 11 |
12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | 22 | 23 | 24 | 25 |
26 | 27 | 28 | 29 | 30 | 31 |
- 자바스크립트
- 프로젝트 매니저
- 쇼핑몰
- 서비스기획
- 데이터
- CSS
- UI
- SpringBoot
- kpt회고
- 생활코딩
- 코드스테이츠
- db
- 회고
- javascript
- PO
- 서비스 기획
- UX
- PM부트캠프
- PM
- 프로덕트 매니저
- tag
- 스프링
- 코딩
- 회고록
- 데이터분석
- 스프링부트
- 서비스 기획자
- 서비스분석
- html
- jquery
- Today
- Total
목록HTML, CSS (9)
콘텐츠기획자의 IT입문서
네이버페이 연동을 위해서 사업자정보를 넣어야 한다. (없으면 검수 과정에서 피드백이 오니 빠르게 대응해서 재검수 요청하면 됨!) 그중 사업자정보확인이 가능하게 구현해야하는 것이 필수인데 스타일난다 쇼핑몰의 푸터를 보면 이런 식으로 들어가 있다! 아래 링크의 개발 가이드에서 상세하게 알려주니 코드를 그대로 복붙하면 끝!! https://www.ftc.go.kr/www/bizCommList.do?key=3765 등록현황 - 공정거래위원회 본자료는 전자상거래시장에서 소비자가 정확한 사업자 정보를 가지고 안전한 거래를 할 수 있도록 전국 시,군,구에 신고된 통신판매업자의 신원정보를 전자상거래소비자보호법 제12조4항 에 따 www.ftc.go.kr HTML [사업자정보확인] SCRIPT *물음표 부분에 사업자번호..
IMG MAP 이미지의 부분마다 링크를 다르게 연결하고 싶다면 을 사용해주면 된다. 이미지 태그에는 usemap="#맵핑명" 을 추가해주고 맵 태그에는 name="맵핑명" 으로 연결해주면 적용이 된다 :) 좌표는 어떻게 구할까? 라고 한다면 포토샵, 그림판과 같은 이미지 에디터 프로그램을 통해 구할 수 있다. 포토샵으로도 좌표를 구해봤지만 이상한 곳으로 좌표가 찍히길래 그림판으로 좌표를 찾아서 적용했더니 정상 작동한다! 참고로 서치하다 image map 에디터 사이트를 발견해서 나중에 쓸 일 있을까 해서 기록해 둔다. http://maschek.hu/imagemap/imgmap/ maschek.hu - Online Image Map Editor maschek.hu 반응형 MAP 좌표 기준이기 때문에 ..
김버그의 HTML & CSS 강의를 결제하고 강의 극초반에는 내용에 비해 비싸다고 생각했는데 26% 들은 지금 시점에서 드는 생각은 잘 선택했다는 것!!! HTML, CSS 기본이야 어디서든 무료로 배울 수 있지만 본 강의는 +어떻게 제대로 사용하는지 알려줘서 도움이 된다 :) 👇 내가 듣고 있는 강의는 요고! 👇 이미지를 사용할 때도 그 의미를 파악하는 것이 좋다. 단순하게 이미지를 넣으려면 태그를 쓰면 되지 않나? 라고 생각할 수 있지만 정말 의미가 있는 이미지가 아니라면 태그를 사용하기 보단 CSS에서 이미지를 넣어주는 것이 더 의미에 부합하다는 것! 가령 아래와 같은 카드 뉴스 형태를 제작해야 한다고 할때 어떤 방식으로 코드를 짤 것인가? 가장 먼저 생각나는 코드는 단순하게 태그를 쓰는 것인데, ..
CSS 길이 단위는 생각보다 많다..! 그래서 실제로 뭘 써야할지 잘 모르겠다ㅜ 우선 고정은 px, 반응형에 따라 사이즈 변화가 필요할 경우 %, em을 쓰고 있긴한데 (이유도 모른체 폰트 사이즈도 px로 주는 나란 사람..ㅎ) 그외 다양한 단위들은 왜 있는 것이며... 어떤 경우에 써야하는지 문득 궁금해져서 서치 후 정리해본다. CSS 길이 단위 1. 절대 단위 단위 사이즈 (px 기준 반올림 적용) 설명 cm 37.8px mm 3.8px in 96px px 1px - 모니터에 따라 상대적인 크기를 가짐 - PC버전 코딩에서 주로 사용 pt 1.3px - 인쇄용 단위 - 주로 문서에서 많이 사용하는 단위 - 크로스 브라우저 결과가 매우 다를 수 있어 웹에서는 사용하지 않는 편 pc 15.6px 2. 상..
여태 사용하는 태그 위주로 사용하다보니 Semantic하게 작성하지 못하는 듯 해서 정리하는 ! HTML을 작성 할 때 염두해야 할 사항 1. 정보전달을 위해 Semantic하게 작성 할 것 2. 위계 질서를 잘 정리하여 한 눈에 파악하기 용이할 것 내용 태그는 일반적으로 열린 태그, 닫힌 태크가 쌍으로 이룬다. attribute는 태그의 성격을 조금 더 디테일하게 만들기 위한 것으로 value와 함께 사용한다. 예) 안녕하세요 1. 구획 구분 (Sectioning Elements) *Sectioning Element 내에는 반드시 heading 태그가 포함되어야 함. (책의 목차와도 같은 의미이기 때문) 구분 태그 추가 설명 +) 추가적으로 구역을 나눌 때 알아둬야 할 태그 : 도입부 (어디든 사용 가..
맥북 계산기 따라 만들기 계산기 구조 form, input 태그만으로 계산기 구성한다. 계산기 결과창 및 버튼인 input 태그들을 div로 감싼 뒤 id를 주어 묶는다. input태그들의 클래스는 버튼 색상을 참고하여 result, clear, zero, operator로 구성. type이 button인 input 태그는 버튼 클릭시 document.forms.result.value로 작동하도록 구성. CSS를 통해 스타일 디자인 음.. 그리드로 해서인지 result 부분만 별도 높이 조절을 못하겠다 ^_ㅠ 그래서 아직은 미완성이나 작동은 잘 됨!
HyperText Markup Language 정보를 표현하기 위해 방법들을 구조화한 언어 HTML의 구성 요소들은...? 1. 태그 : 정보 전달을 위해 각각의 의미에 맞춰서 사용해야 한다. 2. 속성값 3. 텍스트 : 보여지는 문자 정보 HTML의 구조와 필수 TAG 구분 태그 설명 문서 형식 선언 - Document Type Declaration - HTML에서는 필수적으로 사용해야한다. - 선언을 하지 않으면 문서를 대충 자기방식대로 표현하기 때문!! 즉, 오류 없이 잘 렌더링 해달라는 선언 HTML - 제작하고 있는 html 문서의 시작과 끝 - , 만이 안에 속 할 수 있음 - 화면에 보여지는 정보를 어떻게 보이게 할 것인지에 대한 정보 - 필수 태그 : - 그외 포함하는 태그 : , , - ..
HTML은 왜 중요할까? 아래 비슷해 보이지만 다른 두 제목이 있다. coding vs coding 1. 좌측 : font size 22, bold 시각적으로만 제목처럼 보이는 글자 coding 2. 우측 : format에서 '제목1' 처리 html 상에서 '제목'으로 분류 되는 글자 coding 여태까지 나는 블로그를 작성할 때 좌측 방식을 사용했었다. 원하는 제목 스타일이 format에서 찾을 수 없는 경우가 많기도 했고 크게 디자인이 다르지 않기 때문에 왜 format에서 굳이 설정을 해줘야 하는지 몰랐기 때문이다. 우리가 우측의 방식을 택해야하는 이유는 크게 2가지가 있다. 1. 정보성 우선 좌측 coding이 더 깔끔한 코딩이라는 것에는 코드를 보면 명확하게 알 수 있다. 별거 아닌 사소한 차이..