NONE(3)
-
4-6. Display 속성과 Visivility 속성 알아보기
1. Display 속성 알아보기 "display" 속성은 css의 많은 속성 중에서도 아주 중요합니다. 각 HTML 요소는 블록 혹은 인라인으로 나타나게 되는데, display 속성으로 "block" 혹은 "inline"을 의도적으로 지정할 수 있습니다. 뿐만 아니라 마크업된 요소가 원래 존재하지 않는 것처럼 "none"을 지정할 수도 있습니다. 이외에 많은 값들이 새로 추가되었지만, 익스플로러의 경우는 익스플로러 버전9 이상의 브라우저에서만 안정적으로 지원되며 아직은 그 사용빈도가 높지 않습니다.1-1. "display" 속성으로 block, inline 값 지정하기HTML에서 는 블록 요소이고, 은 인라인 요소지만, 다음 예제에서는 css에서 요소가 ㅇ니라인으로 요소는 블록으로 표현되도록 만들었습니..
2018.02.06 -
4-4. 서체(font)와 글(text) 스타일 - 4
1. 글자 장식하기"text-decoration" 속성으로 선택한 요소의 위, 아래, 가운데에 선을 긋거나 깜박거리게 할 수 있습니다. 그 설정값으로는 다음과 같은 종류가 있습니다.none 장식이 없습니다. underline 밑줄을 만듭니다. overline 윗줄을 만듭니다. line-through 가운데 지나가는 선을 만듭니다. blink 깜박거리게 만듭니다. 1-1. 요소는 기본값으로 밑줄(underline)을 가지고 있는데, "마우스를 올리는 경우(hover)"에 밑줄이 나타나게 하는 방법이 많이 쓰입니다. 1-2. 문장을 깜박거리게 하는 효과는 파이어폭스와 오페라 브라우저에서 지원하는 기능입니다. 주의할 점은 깜박거리는 개체는 3Hz~49Hz 사이인 컨텐츠 요소를 포함해서는 안 된다는 점입니다. ..
2018.01.26 -
display & visibility 차이
1. display display: none - 컨트롤을 생성하지 않도록 설정하여 공간 차지도 하지 않습니다. display: inline - 아무런 선택을 하지않으면 기본값으로 선택되는 속성으로 inline요소로 작용하도록 설정하여 줄바꿈이 일어나지 않습니다. display: block - block요소로 작용하도록 설정하여 줄바꿈이 일어나게 됩니다. display: inline-block - 요소는 inline으로 작용하지만 내부는 block처럼 작용하도록 설정합니다. 2. visibility visibility: visible - 아무런 선택을 하지않으면 기본값으로 선택되는 속성으로 그대로 보여줍니다. visibility: hidden - 요소가 보여지지 않지만 공간은 그대로 차지하고 있도록 요소를..
2017.03.22