HTML5 17

[CSS] border 속성

[개요] border 속성은 태그의 테두리를 설정하는 속성으로, background 속성과 비슷하게 세부적인 속성들을 한번에 쓸 수 있는 속성입니다. width-style-color 의 순서로 사용합니다. border-width 테두리의 두꼐로, 주로 px단위를 사용합니다. border-style 테두리의 스타일로 실선, 점선, 이중선 등의 옵션이 존재합니다. border-color 테두리의 색상으로, 값은 color 속성의 포맷을 사용합니다. [예시] [결과] [방향] 테두리의 특정 방향만 따로 설정할 수도 있습니다. border-top border-bottom border-left border-right border-bottom-color 처럼 방향과 색, 두께, 스타일을 따로 설정할 수도 있습니다...

STUDY/디자인 2020.12.09

[CSS] background 속성

[개요] background 속성은 태그의 배경을 지정하는 속성으로, font 속성과 비슷하게 세부적인 속성들을 한번에 쓸 수 있는 속성입니다. 아래의 세부적인 속성을 가집니다. background-color 배경 색 background-image 배경 이미지 background-repeat 배경 이미지 반복 여부 background-position 배경 이미지 위치 [background-color] 배경색을 의미하며, 값은 color 속성의 포맷을 사용합니다. ※ 태그의 크기가 없을 경우 배경색을 표기되지 않습니다. [예시] [결과] [background-image] 배경 이미지를 설정하며, 주로 이미지 경로를 지정하는 방식으로 사용합니다. 경로는 background-image:url("이미지 경로")..

STUDY/디자인 2020.12.08

[CSS] visibility 속성

[개요] visibility 속성은 태그의 가시성을 결정합니다. 아래의 4가지 값을 가지며, 기본 값은 inherit 입니다. visible : 보임 hidden : 숨김(자신의 영역은 계속 차지) collapse : 겹치도록 지정)테이블의 행과 형 요소만 지정할 수 있으며, 그 외 요소를 지정하면 hidden으로 해석) inherit : 부모 요소의 값을 상속 [사용법] #box1 { visibility: hidden; } [예시] [결과]

STUDY/디자인 2020.12.07

[CSS] border-radius 속성

[개요] border-radius 속성은 요소의 테두리를 둥글게 만들어 줍니다. px 단위와 % 단위를 사용할 수 있으며, border 속성 없이도 사용할 수 있습니다. 총 4개의 모설리를 각각 다른 값으로도 줄 수 있습니다. margin 및 padding 속성 처럼 4개의 값을 띄워쓰면 왼쪽-위-부터 시계 방행으로 각자 다른 값을 지정할 수 있습니다. [사용법] #box{ border-radius: 5px; border-radius: 1px 2px 3px 4px; } [예시] [결과]

STUDY/디자인 2020.12.06

[CSS] font 속성

[개요] font 속성은 글자의 폰트를 정의하는 속성인데, 여러 기능을 동시에 가지고 있는 속성이기도 합니다. 정확히 말하면 6개의 세부적인 글꼴 관련 속성을 font 라는 하나의 속성에 한번에 쓸수 있다는 소리입니다. 세부적인 글꼴 관련 속성은 아래와 같습니다. font-style 이탤릭체 등의 글꼴의 스타일 지정 font-weight 글자 두께 font-variant 글꼴 변형(소문자를 대문자로 바꾸는 동의) font-size 글자 크기 line-height 줄 간격 font-family 글꼴(굴림, 돋움...) font 속성은 다음과 같은 순서로 세부 속성을 한번에 기술합니다. font: font-style font-variant font-weight font-size/line-height font..

STUDY/디자인 2020.12.04

HTML5와 XHTML

[개요] HTML은 한 회사가 단독으로 제작한 언어가 아니며, 상용되고 있는 대다수의 브라우저들이 독자적으로 파일을 해석하므로 표준이 잘 정해져있지 않았습니다. 신기술을 사용하기 위해서 adobe flash 같은 플러그인 형태의 기술을 사용하다가, 이를 HTML 언어 자체적으로 표준화 한 것이 HTML5입니다. HTML5 등장 이전에도 표준이 전혀 없지는 않았는데, 그 이전에는 주로 XHTML이나 HTML4를 사용했습니다. [XHTML] XML + HTML의 합성어로 HTML보다 엄격한 문법을 가집니다. 대표적으로 태그처럼 닫는 태그가 없는 태그는 끝에 공백과 함께 />를 붙여주어야 하고, 태그가 트리구조로 이루어져야 합니다. : 틀림 : 맞음 첫번째 문자두번째 문자 : 틀림 첫번째 문자두번째 문자 : ..

STUDY/HTML 2020.11.09

[HTML] HTML이란?

HTML 이란? HTML은 HyperText Markup Language의 약자 수학에서 덧셈 기호를 +로 나타내고, 뺄셈 기호를 -로 나타내듯 웹 사이트에서 화면에 표시되는 정보를 약속 한 것. HyperText는 단순 텍스트 이상의, 링크 등의 개념이 포함 된 텍스트, Markup은 꺽쇠()로 이루어진 태그를 사용하는 규격으로, 태그들을 이용하여 텍스트 이상의 요소를 정의하는 약속된 언어이다.

STUDY/HTML 2020.01.03