티스토리

Starters
검색하기

블로그 홈

Starters

startersdev.tistory.com/m

Starters 님의 블로그입니다.

구독자
0
방명록 방문하기

주요 글 목록

  • CSS - 박스 테두리 따라 선 흐르는 애니메이션 BUTTON 1 2 3 4 공감수 0 댓글수 0 2020. 9. 13.
  • favicon - 웹사이트에 넣기 ico 파일 만든 후 두가지 다 넣어주어야 IE chrome 등 대부분의 브라우저에서 실행된다. 공감수 0 댓글수 0 2020. 9. 7.
  • CSS - grid 이해하기 flex와 grid의 가장 큰 차이점: - flex는 1차원(한방향) 레이아웃 시스템, grid는 2차원(가로, 세로/ 두방향) 레이아웃 시스템 - grid가 더 복잡한 레이아웃 표현이 가능 IE에서도 지원하지만 방법이 다름 firefox사용하면 그리드 사용하기 더 편리하다고 한다. 1 2 3 4 5 6 7 8 9 부모요소 Grid Container 자식요소 Grid Item 시작 부모요소에 display: grid; Grid Track - grid의 행 또는 열 Grid Cell - grid의 한 칸 의미 Grid Line - gird 셀을 구분하는 선 Grid Number - Grid 라인의 각 번호 Grid Gap - gird 셀 사이의 간격 Grid Area - gird 셀의 집합 컨네이너에 적용.. 공감수 0 댓글수 0 2020. 9. 6.
  • CSS - 마우스 이미지 변경 공감수 0 댓글수 0 2020. 9. 3.
  • CSS + Jquery 이미지 페이드인 슬라이드 만들기 자동 페이드인 슬라이드 HTML Starters Web developers CSS .slide{ height:730px; overflow:hidden; position: relative; top:0; left:0; } .slide > div{ position: absolute; height:100%; } Jquery $(".slide > div:gt(0)").hide(); setInterval(function() { $('.slide > div:first') .fadeOut(2000) .next() .fadeIn(2000) .end() .appendTo('.slide'); }, 6000); - 현재 웹사이트 제작 외주 일에 사용할 판매 사이트에 적용하면서 만든 코드 - setInteval 만들 땐, 뭔지.. 공감수 0 댓글수 0 2020. 9. 3.
  • CSS - grid 사용 정리 공감수 0 댓글수 0 2020. 9. 3.
  • 이미지 위에 텍스트 올리기(overlay) 공감수 0 댓글수 0 2020. 9. 3.
  • CSS 텍스트에 그림자 주기 (text-shodow ) text-shadow: 2px 2px 2px gray; 공감수 0 댓글수 0 2020. 9. 3.
  • 이미지를 div 크기에 맞추기 img { max-width: 100%; max-height: 100%; } 공감수 0 댓글수 0 2020. 8. 19.
  • CSS - 이미지 둥둥 떠있도록(발자국 - 지도 앱 업체) Hover over the image: 공감수 0 댓글수 0 2020. 8. 19.
  • 이미지에 대한 이해 비트맵 이미지(레스터 이미지) - 픽셀이 모여 만들어진 정보 집합 - 픽셀 단위로 렌더링 - 용량관리 하기 용이 - 그림판, 포토샵으로 편집가능 - jpg, png, gif, webp JPG (JPEG) - 표현 색상도 뛰어나 고해상도 표시장치에 적합()24비트 컬러) - 손실압축(이미지를 손상시키면서 저장) -> 높은 압축률 - 이미지의 품질과 용량 쉽게 조절 가능 -가장 널리 쓰임 -> 이미지 용량 최소화 하고 싶을 때 PNG - GIF 의 대체 포멧으로 개발됨 - 비손실 압축 - 8비트(256색상)/ 24비트 컬러 이미지 처리 - 투명도 지원 - W3C 권장 포맷 -> 투명도가 필요할 때 GIF - 비손실 압축 - 여러장 이미지 한 개 파일에 담을 수 있음(영상 같은 이미지) - 8비트(다양한 색상.. 공감수 0 댓글수 0 2020. 8. 17.
  • <cite> - 창작물에 대한 참조를 설정 (책, 논문, 영화, TV프로그램, 노래, 게임 등의 제목) - 이탤릭체로 표시됨 display: inline; 공감수 0 댓글수 0 2020. 8. 17.
  • <abbr> - 약어를 지정 - Abbreviation - title 속성을 사용해 전체 글자 또는 설명 제공 display: inline; 공감수 0 댓글수 0 2020. 8. 17.
  • <blockquote> - 일반적인 인용문을 설정 속성: cite - 인용된 정보의 URL display:block; 공감수 0 댓글수 0 2020. 8. 17.
  • <address> , , 등에서 연락처 정보 제공위해 사용 display : block; 공감수 0 댓글수 0 2020. 8. 17.
    문의안내
    • 티스토리
    • 로그인
    • 고객센터

    티스토리는 카카오에서 사랑을 담아 만듭니다.

    © Kakao Corp.