html&css 1 페이지

본문 바로가기
사이트 내 전체검색

html&css

Total 42건 1 페이지
  • 42 [ css ] 브라우져 창 너비 높이등에 변하는 가변 폰트( 반응형 글자, 자동 크기 변경 ) 스타일 적용
  • em과 rem을 사용하면 기준이 되는 폰트 크기를 바꾸었을 때, 다른 폰트의 크기들도 지정해둔 것에 따라 차등적으로 바뀌어 적용되기 때문에 편리하다. 하지만 em과 rem은 브라우저의 창의 크기와는 상관이 없는 단위이다. 이와 달리 vw, vh, vmin, vmax는 브라우저 창의 가로 또는 세로 크기에 따라 변하는 폰트 단위이다. vw :viewport width vw단위는 웹 브라우저의 가로폭 (너비)를 기준으로 결정되는 크기다. 만약 웹 ...
  • 웹지기 10-23 18928 0 0 댓글 0개
  • 41 [ CSS ] 텍스트 줄바꿈, 글자자르기
  • white-space공백 줄바꿈문자 처리방법 (띄어쓰기나 줄바꿈으로 이한 공백부분 등)white-space:normal;normal이 기본값, 여러칸의 공백이나 줄바꿈을 공백 1칸으로 인식한다. 지정된 넓이의 끝에서 자동으로줄바꿈한다.- 코드에서의 원래 텍스트여수 밤바다 이 조명에 담긴 아름다운 얘기가 있어 네게 들려주고파white-space:pre;띄어쓰기는 실제 입력한 칸 수대로, 줄바꿈도 엔터를 친 대로 나온다. 넘어가는 부분에서 강제 줄바꿈은 되지 않는다.white-space:nowr...
  • 웹지기 09-11 18669 0 0 댓글 0개
  • 40 [ css ] 글꼴 사이즈를 반응형으로 만들기
  • 반응형 웹에서 골치 아픈 문제 중 하나가 글꼴 사이즈 화면 크기에 비례하는 글꼴 사이즈를 지정할 수 있도록 하기 위해 CSS3 에는 rem(root em) 이라는 단위를 제공 루트 요소인 <html> 요소에 지정한 글꼴 크기를 기준으로 특정 요소의 글꼴 크기를 결정하는 방식으로써 부모 요소의 글꼴 크기를 기준으로 삼는 em 이라는 단위보다 계산하기 편리 또한 페이지 전체적으로 적용되어 있는 서로 다른 크기의 글꼴을 동일한 비율을 적용하여 일괄 변경할 수 있는 방...
  • 웹지기 10-23 17199 0 0 댓글 0개
  • 38 [ html / css ] html / css 효과 튜토리얼 모음
  • HTML / CSS[HTML/CSS] 001.CSS3를 이용한 탭 메뉴(tab menu) 만들기How to Create a CSS3 Tabbed Navigation[미리보기][HTML/CSS] 002.CSS3를 이용한 버티컬 네비게이션 메뉴 만들기Orman Clark’s Vertical Navigation Menu[미리보기][HTML/CSS] 003.CSS3를 이용한 오목한 버튼 이미지 코딩하기Tagtastic Tag Cloud with CSS Transformations[미리보기][HTML/CS...
  • 웹지기 09-28 11787 0 0 댓글 0개
  • 37 [ css ] 최고의 반응형 CSS 프레임워크 18선
  • 1. Bootstrap가장 많은 사람들이 쓰고 가장 널리 알려진 부트스트랩입니다. LESS를 사용하였으며 12컬럼 반응형 그리드 시스템,수많은 위젯, 컴포넌트, 자바스크립트 플러그인을 지원하며 다운받을때 원하는 기능만 커스터마이즈 할수있습니다.2. Foundation013년 2월에 최초의 Mobile first 프레임워크라는 캐치로 릴리즈된 Foundation4. Sass와 Compass를 사용부트스트랩보다 더 오래된 프레임워크로 현재 부트스트랩 아성에 버티는 거의 유일한 프레임워크https://...
  • 웹지기 10-03 9362 0 0 댓글 0개
+1
  • 33 [ css ] 반응형 웹을 위한 em, rem 디자인
  • em과 rem은 무엇인가? w3c의 css3 스펙 중 distance unit을 살펴봤다. css의 거리 단위는 크게 상대적 길이와 절대적 길이가 있다.상대적 길이는 em, ex, ch, rem, vw, vh, vmin, vmax가 있고절대적 길이는 cm, mm, q, in, pt, pc, px가 있다. 대개 크로스 브라우징이나 쉬운 계산 때문에 강제적으로 길이를 px로 많이 사용한다. 여러 디바이스를 모두 대응해야 하는 문제 때문에 em을 사용하기도 했는데, css3에는 rem이라는 새로운 거...
  • 웹지기 10-23 7253 0 0 댓글 0개
  • 32 [ css ] textFit 간편한 텍스트 피팅(입히기)
  • 한 줄 및 여러줄의 텍스트를 해당 컨테이너의 너비 및 높이에 빠르게 맞추는 종속성없는 텍스트 크기 조정 요소 ●기능 = textFit : - 빠른 속도로 바이너리 검색을 사용하여 텍스트를 컨테이너에 신속하게 맞춰 log n대부분의 솔루션보다 훨씬 빠릅니다. - 가장 적합 <1ms합니다. 구현 세부 정보를 참조 하십시오 . - 종속성이 없습니다. - 작은. 4.1KB축소 및 1.5KBgzipped. - 최대의 정확성을 위해 Flexbox로 수평 ...
  • 웹지기 10-23 7035 0 0 댓글 0개
  • 31 [ html ] 특수문자 코드표
  • 표현문자 숫자표현 문자표현 설명 - � -  - 사용하지 않음 space 	 - 수평탭 ...
  • 웹지기 07-31 6951 0 0 댓글 0개
  • 29 [ css ] keyframe - css 애니메이션 기능 적용해보기
  • keyframe - css 애니메이션 기능 적용해보기 html <p>동해물과 백두산이 마르고 닳도록 하나님이 보우하사 우리나라 만세</p> css p { animation-duration: 3s; animation-name: slidein; } @keyframes slidein { from { margin-left: 100%; width: 300% } to { margin-lef...
  • 웹지기 11-23 6013 0 0 댓글 0개
게시물 검색

notice

회원로그인

접속자집계

오늘
3,671
어제
15,369
최대
33,828
전체
8,340,461
그누보드5
Copyright © funyphp.com. All rights reserved.