본문 바로가기
728x90
300x250
SMALL

Front-end312

여러가지색 그라데이션 :: 그라디언트 적용 지원하지 않는 브라우저도 고려해서 단색도 넣어준다 1234567 #footer { background: #a93952; background: -webkit-linear-gradient( top, #a93952, #df4148, #ea8350, #f8d681, #117fa1); /* 초기 모던 브라우저 */ background: -moz-linear-gradient( bottom, #a93952, #df4148, #ea8350, #f8d681, #117fa1); /* 초기 모던 브라우저 */ background: -o-linear-gradient( bottom, #a93952, #df4148, #ea8350, #f8d681, #117fa1); /* 초기 모던 브라우저 */ background: linear.. 2019. 3. 25.
svg 이미지 만들기 svg는 확대가 가능하고 자연스럽게 이미지 조절이 가능한 이미지 입니다.jpg/jpeg, png 파일은 확대하면 깨지지만 svg는 벡터 기반이라서 확대해도 깨지지 않습니다. svg는 최근 브라우저에서 지원하면서 로고나 차트, 그래프 등에 많이 사용되고 있습니다. svg 참고사이트http://d3js.org/ http://dmitrybaranovskiy.github.io/raphael/ svg 만드는 방법 1. 일러스트에서 이미지를 그립니다. 2. save as에서 svg를 선택하면 파일이 만들어집니다. svg는 대부분의 브라우저에서 지원하지만 익스 8이하 버전이나 안드로이드 2.3이하버전에서는 svg파일을 표시할 수 없습니다.그래서 이런경우 svg대신 png를 사용해야 한다.이럴때는 사용자의 브라우저가 .. 2019. 3. 11.
파비콘 만들기및 등록하기 파비콘(favicon)은 즐겨찾기Favorite와 아이콘 icon 합성어로 조소창 옆에 표시되는 조그마한 아이콘을 말한다. 파비콘의 크기는 16x16, 32x32, 64x64픽셀이 될 수 있고 8비트, 24비트, 32비트 색상이 가능하다. 파비콘은 ico파일로 제작되어야 하며 PNG, GIF, JPEG 사용은 가능하지만 익스에서는 지원되지 않는다. 그렇기 때문에 ico파일로 변경해줘야 한다. ▶ 어지간한 사이트는 하나씩 가지고 있는 파비콘을 만드는 방법 먼저 파비콘으로 등록할 아이콘을 png 파일로 준비한다. https://www.favicon-generator.org/ 위주소로 들어가서 준비해둔 png 파일을 불러오고 Create Favicon을 눌러준다. 밑줄 친 Download the generat.. 2019. 3. 10.
햄버거메뉴 코딩으로 만들기 이미지 없이 코딩으로 표현한 햄버거 메뉴 css12345678910111213141516171819202122232425262728293031323334353637.toggle{ position: absolute; top: 99px; z-index: 999999; width: 15px; height: 11px; left: 10px; } .toggle span{ position: relative; display: block; } .toggle span, .toggle span:after, .toggle span:before { width: 100%; height: 1px; background-color: #fff; transition: all 0.3s; backface-visibility: hidden; .. 2019. 2. 9.
728x90
반응형
LIST