본문 바로가기
반응형

🎪 놀고있네/HTML & CSS42

[HTML] Table 삽입하기 🐱‍🏍🐱‍🏍(+ caption, span 등) 목표: HTML문서에 Table을 삽입해보자 요약 기본 스타일 테이블 표 스타일 지정 캡션 넣기 위에 그림에서 보이는 것처럼 테이블 태그의 종류는 : table tag/elements : table row : table column : table header : caption 이게 기본임 1. 기본 스타일 테이블 기본스타일 테이블은 보시는 바와같이 좀.. 구리다 2. 표 스타일 지정 header에 표 스타일을 지정해줄 수 있다. 아재력 상승 🐱‍🏍🐱‍🏍🐱‍🏍 아재력 상승 🐱‍🏍🐱‍🏍🐱‍🏍🐱‍🏍🐱‍🏍🐱‍🏍 style="display:inline-block;width:740px;height:200px" data-ad-client="ca-pub-9512983930357661" data-ad-slot="5785.. 2019. 11. 22.
[HTML] HTML Tags/Elements, Attributes 구분하기 목표: HTML에서 Tags, Elements, Attributes 구분하기 요약 Tag나 Elements 나 동일한 의미로 사용 Attributes는 Tag/Elements의 속성을 정의함 Elements Elements는 HTML 문서를 이루는 개별적으로 동작하는 컴포넌트/명령어 HTML은 Element들로 이뤄져있고, Elements은 Nested 구조가 가능해 뭔말이냐고? Elemnet 안에 Element가 들어가 있을 수 있다는 말이다. style="display:inline-block;width:740px;height:200px" data-ad-client="ca-pub-9512983930357661" data-ad-slot="5785466884"> Tag Tag는 Elements 와 혼용해서.. 2019. 11. 21.
[HTML] HTML5 페이지 구조 HTML 5의 구조는 크게 헤더와 바디로 나뉜다 헤더는 웹 페이지의 타이틀, 링크 정보(CSS 파일, 폰트 등)이 주로 작성되고 바디는 실제 본문이 되는 부분으로 가장 많은 태그들이 작성되는 공간이다. 그러나 본 게시글에서는 대략적인 구조가 아닌 레이아웃(layout)에 대해 설명하도록 하겠다 element 명 element 표기 헤더 바디 내비게이션(메뉴) 사이드바 아티클 섹션(메인콘텐츠) 푸터 하나씩 차근차근 해보자! 헤더 헤더는 브라우저 탭에 표시되는 사이트 제목을 말한다. ▼ 푸터 푸터는 보여지는 단어처럼 header의 반대격인 foot에 위치한 다는 것이다. foot은 항상 아래쪽에 위치한다. ▼ 위의 결과에서는 footer의 위치가 위쪽에 있어서 무엇인지 파악하기 힘들것이다. 내 블로그의 fo.. 2019. 11. 21.
[HTML] HTML 파일 Chrome에서 실행하기 목표: 작성된 파일(e.g. Test.html)을 Chrome 브라우저에서 실행하기 요약 Configure Tast 실행: ctrl + shift + p tasks.json 파일 생성 및 수정 MSBuild 실행 tasks.json 파일에 Chrome 설정 반영하기 파일 선택 후 실행 HTML Extensions 설치, HTML 사용하기는 아래 게시글 참고! 2019/11/20 - [놀고있네/HTML] - [HTML] VS Code - HTML Extensions 설치, HTML 사용하기 [HTML] VS Code - HTML Extensions 설치, HTML 사용하기 목표: VS Code에서 HTML 사용하기 요약 EXTENTIONS > [HTML] 검색 > HTML Snippets 설치 EXPLOR.. 2019. 11. 20.
[HTML] VS Code - HTML Extensions 설치, HTML 사용하기 목표: VS Code에서 HTML 사용하기 요약 EXTENTIONS > [HTML] 검색 > HTML Snippets 설치 EXPLORER > Workspace 생성 .html 파일 생성 및 저장 HTML 작성 및 실행 MS에 Visual Studio Code를 설치하고, marketplace에서 extensions를 다운로드 받는 방법은 아래 게시글 참고 2019/11/15 - [놀고있네/VS Code] - [VS Code] Visual Studio Code 설치 및 실행 2019/11/16 - [놀고있네/VS Code] - [VS Code] 마켓플레이스 활용, 플러그인 다운로드, 서버 연결 [VS Code] 마켓플레이스 활용, 플러그인 다운로드, 서버 연결 2019/11/16 - [놀고있네] - [V.. 2019. 11. 20.
[HTML] HTML 이란 HTML 이란 HTML은 하이퍼텍스트 마크업 언어(HyperText Markup Language)로 웹 페이지를 동작시키기 위한 언어이다. 더보기 마크업 언어(markup language)는 태그(tag) 등을 이용하여 문서나 데이터의 구조를 규칙화한 언어의 한 종류이다. 태그(tag)는 어떤 정보에 메타데이터로 부여된 키워드 또는 분류이다. 메타데이터(metadata)는 데이터에 관한 구조화된 데이터로 다른 데이터를 설명해 주는 데이터이다. HTML을 확인하고 싶다면 - 웹 페이지에서 키보드로 F12 버튼을 클릭하면 오른쪽과 같이 HTML과 BODY 정보를 확인할 수 있다. e.g. 냥장판의 스킨 편집에서도 [HTML 편집] 을 할 수 있는데 생각보다 우리의 웹활동과 밀접하게 관련이 있다! HTML 구.. 2019. 11. 19.
반응형