분류 전체보기 183

[CSS3] CSS3 소개 및 상대경로, 절대경로에 대해 알아보기

안녕하세요. 이번에는 CSS3에 대해서 간략하게 알아보겠습니다. 그리고 중간에 상대경로와 절대경로에 대해서 알아보겠습니다. 1. CSS Cascading Style Sheets(CSS)는 HTML이나 XML(XML의 방언인 SVG, XHTML 포함)로 작성된 문서의 표시 방법을 기술하기 위한 스타일 시트 언어 입니다. 2. CSS 사용 방식 외부 스타일 시트 - 외부 CSS 파일을 불러와서 사용 내부 스타일 시트 - html 문서 내에서 head 태그 내부의 style 태그에 사용하는 방법 인라인 스타일 시트 - html 태그 안에서 style 속성을 사용하는 방법 2-1. 외부 방식 외부 CSS 파일을 불러오는 방식 폴더 구조 ( TEST 폴더 안에 css, html 폴더가 있는 구조) 태그를 이용하여..

HTML5 & CSS3 2022.12.01

[HTML5] Table 태그 알아보기

안녕하세요 이번에는 HTML 태그 중에서 표에 해당하는 Table 태그에 대해서 알아보겠습니다. 1. Table 태그 기본 사용 방법 표에서 tr 태그는 행을 의미하고, td 태그는 열을 의미한다. border 은 표 테두리를 설정하는 속성으로 지금은 1두께로 설정한 상태입니다. 1 2 3 4 5 6 2. Table 태그의 간단한 속성 - border : 테두리 두께 - cellspacing : 경계선 사이의 여백의 크기 - cellpadding : 칸 안의 여백의 크기 그 외 여러 가지 속성이 존재합니다. 3. TD 태그 속성 - 가로 병합 : colspan - 세로 병합 : rowspan 1 2 3 4 7 8 4. 실습코드 더보기 4-1. 달력 2019년 6월 日 月 火 水 木 金 土 1 2 3 4 ..

HTML5 & CSS3 2022.11.30

[VSCode] VS Code HTML 자동 양식 생성 방법 및 크롬 개발자 모드

안녕하세요 VS Code 에서 html 기본 양식 불러오는 방법에 대해서 알려드리겠습니다. 1. Visual Studio Code 처음에 HTML 파일을 생성한 후 내용 입력 칸에 ! 만 입력한 후 Tab 키를 누르면 기본 양식이 자동으로 생성됩니다. 이 방법을 사용하시면 Visual Studio Code를 조금 더 편하게 사용할 수 있습니다. 2. 크롬 개발자 모드 크롬 창에서 F12를 클릭하면 개발자 모드 창이 생기며 html 문서의 요소, 콘솔 창 말고도 여러 가지 정보를 볼 수 있습니다. 감사합니다.

IT 기타 2022.11.29

[HTML5] HTML5 간략하게 알아보기

안녕하세요. 이번에는 html 기본 구조에 대해서 간략하게 알아보겠습니다. 1. 기본 작성 방법 기본적으로는 이렇게 작성을 합니다. 보통 head 태그에는 script, css 파일 등을 작성할 때 쓰이고 head 태그 안에서 title은 홈페이지 제목을 뜻합니다. body 태그에는 홈페이지 내용들이 입력되는 칸이라고 보시면 됩니다. 그리고 꼭 로 시작을 하면 와 같이 닫아주는 작업이 필요합니다. 모든 태그가 그렇지는 않은데 대부분의 태그는 열어주면 닫아주는 작업까지 필요합니다. 2. HTML 기본 태그 일단 간단하게 정리하면 기본적으로 사용하는 태그는 다음과 같습니다. => 문자(제목) 태그 ⇒ Enter 기능 ⇒ 이미지 태그 ⇒ 링크 태그 => 문단 태그 => 문자 태그 => 문자 태그 => 목록 태..

HTML5 & CSS3 2022.11.28

[VSCode&Git] VSCode 설치 및 Git 설치하기

안녕하세요. 이번에 SeSAC에서 진행하는 풀스택 웹 융합 개발자 양성 과정 교육을 듣고 배운 것에 대하여 정리해보도록 하겠습니다. 우선 컴퓨터에 개발을 위한 환경세팅을 먼저 진행합니다. 비주얼 스튜디오 코드 (Visual Studio Code) 비주얼 스튜디오 코드 (Visual Studio Code) 확장 프로그램 Git Hub 실습환경 운영체제 : Windows 11 Pro 64Bit RAM : 16GB 먼저 코딩할 때 사용할 프로그램을 설치합니다. 여러 가지 프로그램이 있지만 제일 무난하게 사용이 가능한 비주얼 스튜디오 코드를 사용하도록 하겠습니다. 아래 다운로드 링크를 클릭하면 공식 홈페이지로 접속이되며 각 운영체제 및 버전에 맞는 파일로 설치를 진행하시면 됩니다. 비주얼 스튜디오 코드 (Vis..

IT 기타 2022.11.25
반응형