순서없는 목록에서 사용하는 블릿 disc : ● circle : ○ square : ■ 순서있는 목록에서 사용하는 번호유형 decimal : 1부터 시작하는 숫자 decimal-leading-zero : 0을 앞에 붙인 숫자 (1부터 시작) lower-roman : 소문자 로마숫자 upper-roman : 대문자 로마숫자 lower-greek : 소문자 그리스 문자 lower-alpha : 소문자 알파벳 lower-latin : 소문자 더 읽기
anchovy3
CSS keyframe 예제
css만으로 슬라이드 배너효과 내기 배경 변화, 반복 움직임
HTML video 태그 샘플
loop 무한반복autoplay 자동재생muted 자동재생하려면 뮤트가 필요playsinline 아이폰에서 자동재생 하려면 꼭 넣어야됨controls 적으면 밑에 컨트롤바가 생긴다
Ajax 개념정리
홈페이지를 만들다보면, 단순 페이지 이동이 아닌, 페이지내에서의 변화나, DB들을 가져오는 경우 등이 있다. 그럴 경우 Ajax 라는 함수를 쓰는데, 불리는건 에이작스, 아작스 등.. 취향에 따라 부르는 것 같다. 에이작스 개념을 정리하기전, 나같은 경우는 load와 Ajax의 차이점을 크게 생각하지 못했다. 레이어팝업의 경우 나는 load를 해서 불러오기도 하는데 불러오긴 Ajax도 마찬가지 아닐까? 더 읽기
JavaScript 쿠키를 이용한 레이어팝업 예제
HTML datalist, input[number]
input태그인데 밑에 보기가 나온다. 숫자입력 태그 최저 15부터 맥스 50까지
CSS 밑줄
밑줄을 border로 만들면 제어하기가 힘들다.그래서 after요소를 이용한다. 밑줄의 길이는 width속성으로 정하고,요소와 밑줄 사이의 간격을 조정하고 싶으면 padding이나 margin 속성을 추가하면 된다.
CSS 웹폰트
@charset “utf-8”; @font-face { font-family: ‘NanumGothic’; src: url(‘font/NanumGothic.eot’); src: url(‘font/NanumGothic.eot?#iefix’) format(’embedded-opentype’), /* ie 6,7,8 적용 embedded-opentype ie 8,9 적용 */ url(‘font/NanumGothic.woff’) format(‘woff’), /* ie 제외한 나머지 */ url(‘font/NanumGothic.ttf’) format(‘truetype’), url(‘font/NanumGothic.svg#NanumGothic’) format(‘svg’); /모바일브라우져를 위해서*/ font-weight: normal; font-style: normal; } //노토산스 Noto Sans KR @import url(http://fonts.googleapis.com/earlyaccess/notosanskr.css); //나눔고딕 NanumGothic @import url(http://fonts.googleapis.com/earlyaccess/nanumgothic.css); //나눔펜글씨 font-family: 더 읽기
CSS 게시판 배치
★text-overflow-visibile : 기본값-scroll : 벗어난 영역을 스크롤 처리-hidden : 벗어난 영역을 숨김 처리-auto : 벗어나는 영역을 스크롤처리, 없는경우 스크롤 숨김-ellipsis 벗어난 텍스트부분 말줄임 ★table-layout-fixed: 테이블을 구조적으로 고정시킬 때 쓴다. ★white-space-nowrap : 자동 줄바꿈이 없이 한줄로-pre : 자동 줄바꿈이 없이 한줄로 &스페이스바 사용한만큼 화면에 나타남 ★word-break-keep-all: 잘 호환이 안되지만 글자가 디스플레이될 더 읽기
CSS 화면배치 float, position
★float:left -float를 주면 div의 블록이 해제. 그 자리에서 붕 뜨므로 밑에 요소들이 들어 갈 수 있게 됨. -float는 센터정렬이 없다. -부모요소에 :after{content:””; display:block; clear:both} 추가하면 아래 요소들이 따라 올라오지 않는다. -크기가 바뀌는 홈페이지에 쓴다. 고정되는 홈페이지라면 position:absolute.을 쓴다. ★position:absolute - 부모요소에는 넓이와 높이를 지정해줘야하고 position:relative 적용해야한다. - position은 되도록 사용하지 더 읽기