코린이 공부장

선택자란 CSS로 UI의 어느 부분을 디자인 할지 , 즉 표현할 대상이 되는 부분이다. △CSS로 속성을 부여하는 형식 ※ 이 예문은 h1요소에 배경색을 노란색으로, 글자색을 빨간색으로 지정한다는 의미를 담고 있다. { } 안에 여러 속성을 지정할 수 있고, 각 속성 설정 간에는 ' ; '로 구분해주며 마지막 속성 끝에는 구분 생략가능하다. 속성은 가로로 붙여 써도 되고 한 줄씩 따로 기술해도 된다. type 선택자 html 문서의 태그 이름을 선택자로 사용할 수 있다. ex) p {color: blue;} id 선택자 - HTML 문서 요소 중 같은 요소라도 각기 다른 이름을 지정하여 따로 속성을 부여할 수 있다. - id로 이름을 붙일 때는 유일한 이름을 부여해야한다. - CSS에서는 id 선택자 앞..

See the Pen Tail Animation by lee3ll (@lee3ll) on CodePen.

내부 스타일시트 - CSS를 HTML문서안에 태그로 기재하여 HTML 문서 안에 CSS가 함께 저장되도록 하는 형태이다. 예제 p{ color:red; }의 의미는 p태그 안의 글자 색상을 red로 설정하라는 뜻이다. 외부 스타일시트 - 스타일 속성들을 따로 저장하여 HTML 문서에 파일명으로 연결할 수 있다. -이때 스타일은 *.css 확장자를 가진 별도의 파일로 저장하고 HTML에서는 태그를 이용하여 선언한다. -내부 스타일시트는 그 스타일이 기술된 페이지에만 적용되는 반면, 외부스타일시트는 그 스타일을 선언한 모든 HTML페이지에 적용 된다. @ import - @import는 CSS 안으로 다른 CSS 파일을 불러들일 경우 사용한다. CSS의 맨 윗줄에 기술한다. - @import는 어떤 CSS파..

자료형(data type)이란 - 자료형이란 프로그램에서 처리할 자료의 형태를 말한다. - 예를들어 사람은 1-5를 보면 숫자라는 것을 알 수 있고, '안녕?'을 보면 문자열이라느 것을 알 수 있다. 하지만 컴퓨터에게 일을 시킬 때는 이것은 숫자이니 더하거나 빼야하고, 저것은 문자열이니 더하거나 뺄 수 없다는 것을 따로 알려 주여야 한다. -이렇게 숫자나 문자열처럼 프로그램에서 처리할 자료의 유형을 지정해야 하는데, 이러한 자료의 형태를 '자료형'이라 한다. 자료형의 관계 자료형은 크게 '원시유형' 과 '객체'로 나뉘어진다. 원시유형은 하나의 값만 저장하는 자료형으로 숫자와 문자열, 논리형, undefinde, null, symbol 유형이 있다 그 외에는 모두 객체이다. 숫자형 - 모든 프로그램에서 가..

텍스트 관련요소 요소 유형 태그명 태그의 의미 및 특징 인라인 요소 강조하고 싶은 텍스트를 정의하기 위한 태그이며 기울임체로 표시. 중요한 텐스트를 정의하기 위한 태그이며 굵은체로 표시. 주의 깊게 볼 텍스트 부분을 강조하기 위한 태그이며 노란새으로 표시. 의미를 가지고 있지 않으며 단순히 텍스트를 굵은체로 표시. 주의사항, 법적제한, 저작권 등을 정의하기 위한 태그. 아래첨자 텍스트를 정의하기 위한 태그. 위 첨자 텍스트를 정의하기 위한 태그 △ 예제 ※ 문장에서 특정 단어에 대한 '강조나 중요'의 의미가 아닌 단순히 기울임체나 굵은체로 표시하고 싶다면 태그나 태그를 사용하지 않고 CSS를 이용하여 표현 할 수 있다.

마크업 마크업 언어(Markup Language)란 문서가 표시되는 형식을 나타내거나 데이터의 논리적인 구조를 명시하기 위한 규칙들을 정의한 언어의 일종이다. 즉, 마크업(Markup)은 문서처리를 지원하기 위해 문서에 추가되는 정보로, 마크업작업을 완료하면 디자이너의 작업물이 웹에 띄울 수 있는 틀의 형태로 구조화된다. 시멘틱 마크업 - 시멘틱(SEMANTIC)의 사전적 뜻은 '의미론적인' 정도로 해석할 수 있는데, 이것은 마크업을 할 때 의미에 부합하는 태그를 사용하라는 뜻이다. - 시각장애인의 경우 문서의 콘텐츠 정보를 음성으로 전달해 주어야 하는데 이런경우 시멘틱 마크업을 통해 태그의 의미를 적절하게 전달할 수 있다. △예제 첫 번째 이미지처럼 마크업 하면 스크린 리더(음성낭독 프로그램)에서는 그..

이미지출처 블록 레벨 요소(Block-level Elements) - 블록 레벨 요소는 마크업을 할 때 줄이 바뀌는 특성을 가지고 있습니다. - 블록 요소는 하나의 박스라고 생각하면 됩니다. 코드 ~ - 각 섹션의 제목을 나타냅니다. - h1요소가 가장 높은 등급(크기가 가장 크게 표현)이고, h6요소가 가장 낮은 등급입니다. - 문단을 나타냅니다. - 텍스트를 단락으로 정의합니다. 예제 △ (예제1)에서 마크업 한 ,, 요소들은 블록의 성질을 가지고 있어 화면상 줄 바꿈 현상이 일어남. 인라인 요소(Inline Element) - 인라인 요소는 마크업을 할 때 가로로 정렬이 됩니다. - 인라인 요소는 텍스트라고 생각하면 됩니다. - 즉, 블록 레벨 요소처럼 행이 바뀌지 않고 한 줄로 출력됩니다. 코드 ..