일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | 6 | 7 |
8 | 9 | 10 | 11 | 12 | 13 | 14 |
15 | 16 | 17 | 18 | 19 | 20 | 21 |
22 | 23 | 24 | 25 | 26 | 27 | 28 |
29 | 30 | 31 |
- ChatGPT
- 데이터베이스
- 연습문제
- html/css
- 머신러닝
- JSP
- 데이터분석
- CSS
- JDBC
- 자바
- 컴퓨터비전
- 정보처리기사필기
- 정보처리기사실기
- c언어
- 상속
- 혼공머신
- JSP/Servlet
- 중학1-1
- SQL
- 자바 실습
- 중학수학
- 자바스크립트
- rnn
- 개발일기
- 파이썬
- 자바스크립트심화
- 순환신경망
- 딥러닝
- 디버깅
- 컴퓨터구조
- Today
- Total
목록웹 · 앱 개발/HTML & CSS (91)
클라이언트/ 서버/ 엔지니어 "게임 개발자"를 향한 매일의 공부일지
어제부터 다시 공부에 집중할 수 있게 되었고 공부에 흥미를 느끼는 중이다. 티스토리에는 하루에 50개의 글만 저장할 수 있지만 사실 하루에 50개를 올리는 일은 흔치 않은 일이다. 벨로그에 그동안 올렸던 글을 다 정리하면 앞으로는 많아야 20개가 될 테니 이 부분은 더 이상 제약사항이 되지 못한다.공부는 한번 쉬면 다시 시작하기가 참 힘든 것 같다. 잠시 쉬면서 놀다가 공부에 집중하는 시간도 처음에 30분 정도는 정말 하기 싫은 마음과 싸워야 하지만 그 이후에는 다시 즐겁게 할 수 있다. 만사가 그러한 것 같다. 이제 한 달 전에 공부하다 말았던 부분을 학습해보기로 하자. 저녁을 먹고 나서 8~9월 학습 계획을 짜보았는데 사실 너무 벅찬 무리한 계획이었던 것 같다. 너무 일정을 빡빡하게 계획하면 하기가 ..
이어서 테이블 실습을 진행해 보겠다. 이 수업도 둘째 날 진행했었다. 표를 만드는 건 정말 어려웠다. 특히 행와 열을 병합하는 문제가 참 쉽지 않아서 선생님께 질문을 했던 기억이 난다. 다른 학생들도 처음 해보는 작업에 어려움을 느끼기도 했으나 대부분 잘하는 것 같았다.들을 때는 조금 알았다가도 돌아서면 잊어버렸다. 오늘 점심때 이 부분을 혼자서 실습해 보며 드디어 병합하는 방법을 알게 되었다. 1. 테이블 만들기 기본 테이블을 만들어보았다. 테두리와 색깔은 보통 CSS를 통해 설정하는데 HTML에서도 조절할 수 있다. 하지만 이 방법은 별로 추천하지 않는다고 한다. 이번에는 열을 병합하여 표를 만들었다. 난 행과 열이 정말 많이 헤깔린다. 행이 어디인지 한참을 생각하며 손으로 그림을 ..
이 부분은 인사교 수업 시간에 진행했던 내용인데 한번 정리해 보기로 했다. 사실 책에 모두 나와있는 내용이라서 생략하려고 했으나 그래도 책에 없는 내용도 다루고 있어 짧게라도 소개하는 것이 좋을 것 같다. 공부할 내용이 정말 많고 수업의 진도를 따라가지 못해 복습은 꿈도 못 꾸고 있지만 그래도 이제는 차근차근 정리해보려고 한다.책으로 학습을 한번 진행해서 수업의 내용도 별로 어렵지 않았다. 1. 목록 만들기 순서가 있는 목록과 순서가 없는 목록을 이렇게 만들어 볼 수 있다. 그래도 처음에는 수업을 나름 잘 들어서 어렵지만 따라서 필기를 잘했다. 나중에 갈수록 잘하지 않았지만 말이다. 2. 하이퍼링크 텍스트를 클릭하며 해당 링크로 이동한다. 네이버로 이동할 수도 있고 실습 파일로도 이동하는..
점심시간에 집에 와서 새벽에 공부했던 표 만들기 학습을 이어서 진행하고 있다. 인사교에서는 사람들이 너무 시끄럽고 어디 가나 조용히 공부할 수 있는 장소가 없어서 점심때 조금 일찍 와서 공부를 하는 중이다. 집에 도착해서 한 20분 정도는 마음을 정리하며 시간을 보냈지만 다시 집중할 수 있어서 감사했다.그냥 책에 있는 내용을 따라서 할 때는 따라 치기만 하니 내가 잘 하고 있는지도 잘 모르겠고, 막상 연습문제를 풀어보면 내가 아는 게 아는 게 아니었음을 알게 된다. 오늘 직접 문제를 만들어보면서 HTML을 실습해보는데 정말 재미있었다. 문제 1번가장 기본적인 테이블 만들어보기 이렇게 표를 만들어보았다. 처음에는 스타일을 적용하지 않았더니 표의 줄 표시가 하나도 되어있지 않았다. CSS가 들어가야..
단원을 마무리하며 연습문제를 풀어보기로 하자. 새벽에 일지를 정리하느라 시간이 많이 지체되었지만 그래도 1시간 정도는 더 공부를 할 수 있을 것 같다.다 하지 못하면 저녁에 집에 와서 학습할 예정이다. 4장 내용 한눈에 정리하기 단원 마무리 문제 풀기 문제 1번다음 결과 화면을 참고하여 조건에 맞게 웹 문서를 작성해 보라. 문제를 풀기 전의 화면이다. 이렇게 1번 문제를 잘 풀었다. 2번 문제는 표를 그리는 조금 어려운 문제인데 한번 도전해 볼 것이다! 문제 2번 문제를 풀기 전의 화면이다. 아직 CSS는 배우지 않아서 이 부분은 예제로 만들어져 있다. 2번 문제에 20분이 넘도록 투자했지만 여기까지밖에 하지 못했다. 아마도 표를 만드는 부분에서는 눈으로만 학..
어제부터 다시 공부를 시작했다. 지난주 목요일에 정보처리기사 필기시험을 치른 후로 공부가 너무 하기 싫어 1주일 이상 놀기만 하고 아무것도 하지 못했다. 다시 마음을 회복하며 어제 저녁에 해보니 충분히 할 수 있었다. 어제 지난번에 공부하다 말았던 부분부터 다시 학습하는 중이다.그리고 전에 학습하지 않고 책으로만 진행했던 부분을 처음부터 강의도 들으면서 공부해보았다. 책에 중요한 내용도 기록하면서.. 공부가 다시 재미있어지고 있다. 뭐든 매일 하지 않으면 즐거움을 잃게 되는 것 같다. 다시 찾은 공부에 대한 즐거움을 잃고 싶지 않다. 하이퍼링크는 클릭만 하면 연결된 곳으로 바로 이동해 웹 사이트를 더욱 편리하게 사용할 수 있는 중요한 가능이다. 단순해 보이는 이 기능에도 여러 속성을 이용해 다양하게 활용..
오늘의 공부를 시작해 본다. 오늘은 오디오와 비디오를 삽입하는 실습을 진행해 볼 것이다. 오디오와 비디오 삽입하기웹 사이트에서 많이 사용하는 멀티미디어 형태는 오디오와 비디오이다. HTML에서는 audio와 video 태그가 새로 추가되어 멀티미디어 파일을 더 편리하게 삽입할 수 있다. 다양한 멀티미디어 파일을 삽입할 때 쓰는 object, embed 태그object 태그는 오디오 파일뿐만 아니라 비다오, 자바 애플릿, PDF 등 다양한 멀티미디어 파일을 삽입할 때 사용한다. 웹 문서 안에 다른 문서를 삽입할 대도 사용할 수 있다. 다음과 같이 object 태그를 사용하여 웹 문서에 PDF 파일을 삽입하면 PDF 리더가 자동으로 포함되어 보여준다. embed 태그는 HTML 초기 버전부터 대부..
다음으로는 이미지를 삽입하는 방법에 대해서 학습해 볼 것이다. 시간이 15분밖에 남지 않았으니 최대한 빨리 진행해야겠다. 그럼 바로 시작해 본다! 이미지 삽입하기웹 사이트에 적절한 이미지가 있으면 정보를 시각적으로 전해줄 뿐 아니라 지루하지 않게 해 준다. 웹 사이트에서 이미지의 역할은 텍스트만큼 중요하다. 사이트 전체 디자인과 메뉴, 중요한 요소를 이미지로 처리하여 내용을 강조할 수도 있다. 이미지를 삽입하는 img 태그 자세한 내용은 전에 모두 학습했으므로 실습으로 넘어가서 직접 확인해 보자! 이미지 파일 경로를 나타내는 src 속성경로란 현재 html 문서에서 이미지 파일이 있는 곳까지 어떻게 찾아가야 하는지 알려준다. 이미지 파일 경로는 웹 문서 파일의 위치를 기준으로 정해진다.웹 문서..
목록 만들기에 이어 표 만들기 학습을 시작해 본다. 조금 전에 학습했던 ol 태그부터는 수업 내용을 정리하지 않았다. 우선은 책 위주로 학습해 볼 것이다.분량이 꽤 많은데 중요한 내용이니 빠짐없이 정리해야겠다. 그럼 바로 시작해본다. 표 만들기웹 문서에서 자료를 정리할 때 자주 쓰는 태그는 표이다. 표의 구성 요소 알아보기표(table)는 행(row)과 열(column) 그리고 셀로 이루어진다. 셀은 행과 열이 만나 이루어진 곳으로 표의 내용이 들어가는 한 칸을 의미한다. 표를 만드는 table, caption 태그표의 시작과 끝을 알려주는 table 태그를 표시하고, 표에 제목을 붙이고 싶으면 caption 태그를 넣는다. 이 태그를 사용하면 제목은 표의 위쪽 중앙에 표시된다. 행을 만드는 tr..
이번에는 목록을 만드는 태그에 대해 학습해보려고 한다. 표 태그는 분량이 많아 다음 포스트에서 다루어야 할 것 같다. 목록을 만드는 것까지는 별로 어렵지 않게 진행할 수 있었다. 표를 만드는 건 많이 어려웠다.그럼 바로 시작해 보자! 목록 만들기웹 문서에서 목록은 단순히 어떤 항목을 나열할 때만 사용하지 않는다. CSS와 함께 사용해서 내비게이션을 만들거나 콘텐츠를 배치하는 등 다양한 용도로 쓰이게 된다. 순서 있는 목록을 만드는 ol, li 태그목록을 표시할 내용 앞뒤에 각각 ol을 두고 그 사이에 li를 삽입하는 형태이다. ol 태그의 type, start 속성목록은 기본적으로 숫자 1, 2, 3, ...으로 번호를 붙인다. 이때 type 속성을 사용하면 영문자나 로마 숫자 등으로 순서를 나타..