HTML, CSS
-
CSS(Cascading Style Sheets)HTML, CSS 2023. 12. 19. 23:50
1. CSS 란? CSS는 (Cascading Style Sheets)의 약자로 HTML로 만든 콘텐츠에 레이아웃과 디자인 요소를 추가하는 것을 의미한다. 간단히 말해서 사람이 입는 옷을 의미한다고 말할 수 있다. CSS를 잘 정리해둘 경우 다른 페이지에 적용할 수 있다. (재사용성) 주로 요소의 너비, 색상, 위치 등에 사용되며 애니메이션 효과를 넣을 수 도 있다. Cascading Style Sheets로 위에서 아래로 흐르는 스타일 시트를 의미한다. Cascading 구조를 가지기 때문에 h1에 더 아래 적용된 yellow 색이 지정됨 2. 작성 방법 주로 선택자를 선택하여 무슨 속성에 어떤 값을 부여하는지의 방식으로 사용된다. 한개의 선택자에 여러 속성 부여 가능 선택자는 보통 id, class,..
-
HTML 시맨틱(Semantic)HTML, CSS 2023. 11. 28. 00:33
HTML 을 작성하며 어떻게 작성하는 것이 중요할까 라는 생각이 들때도 있다. 제일 중요한 것은 시맨틱(Semantic)하게 작성해야 한다는 것이다. 시맨틱하게 작성하는 것은 , , , , 처럼 의미 있는 태그를 상황에 따라 사용하는 것을 의미한다. 위 처럼 명시적인 구조를 사용하여 좀 더 명확하게 요소를 구성하는 것이다. 1. 시맨틱하게 작성하는 것이 무엇이 좋을까 각 요소가 자체적 의미를 가지기 때문에 가독성이 높아지고 유지 보수가 쉬워진다. 콘텐츠 계층 구조를 더쉽게 이해할 수 있다. 검색 엔진은 HTML 계층 구조에 따라 키워드들의 중요도를 파악하기 때문에 시맨틱하게 작성된 HTML은 크롤러에 더 구체한 정보를 제공한다. => 검색에 더 자주 노출된다. 시맨틱하게 작성하는 방법 ~ : 각 섹션의 ..
-
HTML 요소HTML, CSS 2023. 4. 5. 17:06
● 제목 더보기 - h1 ~ h6 : 제목의 크기를 나타내는 태그 ● 단락 - 문장과 문장을 나누거나 문단등을 의미 더보기 - p : 한 문장이나 내용을 작성할 사용되는 태그 => 어떻게 칸을 나누든 한 문장으로 출력된다. - pre : p 태그와 마찬가지로 한 문장이나 내용을 작성할때 사용되는 태그 => 띄어쓰기를 하던 칸을 나누던 있는 그대로 출력해준다. - br : 줄을 바꿀 때 사용 - hr : 줄을 바꿀 때 사용 가로로 구분이 가능한 줄이 생김 ● 서식 - 텍스트에 다양한 효과등을 부여하는 것 더보기 - b : 글씨를 굵게 만들때 사용한다. - strong : 글씨를 굵게 만들 뿐 아니라 중요하다는 표시 - i : 화면의 글씨를 이탤릭체로 변경 - em : 글씨를 이탤릭체로 변경 및 중요하다는 ..
-
HTML(Hyper Text Markup Language)HTML, CSS 2023. 4. 5. 16:32
1. HTML 이란? Hyper Text Markup Language의 약자로 마크업 구성에 가장 많이 사용되는 언어이다. 우리가 보는 웹페이지가 어떻게 구조화되어 있는지 브라우저로 하여금 알 수 있도록 한다. Elements로 구성되어 있다. Hyper Text Markup Language는 Hyper Text(하이퍼텍스트) 웹사이트를 클릭하여 다른 페이지로 이동하는 기능을 의미하며 Markup(마크업)은 태그(tag)를 사용하여 문서에서 제목, 본문, 이미지 등을 표시하는 것을 말한다. 즉 웹 페이지를 오고갈 수 있는 웹 문서들을 만드는 태그를 활용한 언어 라고 말할 수 있다. 2. HTML 요소의 구조 기본적인 틀은 위와 같이 구성된다. : 문서가 HTML5 인 것을 선언한다. : 문서의 상단, 하..