목록전체 글 (57)
대학생 쩡딱구리
![](http://i1.daumcdn.net/thumb/C150x150.fwebp.q85/?fname=https://blog.kakaocdn.net/dn/c5duYH/btqXobRWuun/o8KSuU90vf0fLshUefz1a1/img.png)
HTML과 CSS에 대한 개념을 4일 동안 학습한 후 5일부터 본격적으로 웹사이트를 만들기 시작했다! 우선 가장 중요한 뼈대, 레이아웃 만들기! 1. div 태그와 span 태그 HTML 문서에서 div 태그와 span 태그는 정말 많이 사용된다. 둘이 무슨 차이가 있냐고 묻는다면 아래 코드와 결과를 보면 좋다. DIV 1개 DIV 2개 DIV 3개 SPAN 1개 SPAN 2개 SPAN 3개 즉, div와 span의 차이는 줄바꿈의 여부이다. div는 입력 시 자동으로 줄바꿈이 되고, span은 줄바꿈이 되지 않는다. 엄밀히 말하면 둘의 차이는 단순히 줄바꿈보다는 display 속성에 의한 것이다. 간단히 설명할 때, 문서의 소스코드를 검사해보면 div 태그에는 display: block; 속성이 설정되..
![](http://i1.daumcdn.net/thumb/C150x150.fwebp.q85/?fname=https://blog.kakaocdn.net/dn/bGetiw/btqWWtsznLi/ZIICHiqBDHcuuykTYEpPE0/img.png)
꽤 어려웠던 패딩과 마진 적용하는 방법! 글로 적으면서 다시 한 번 복습하려고 한다! 1. 패딩과 마진 패딩(padding)과 마진(margin)은 CSS에서 여백을 나타내는 중요한 속성이다. 패딩은 박스 테두리와 안쪽 내용 사이의 여백, 마진은 박스 테두리 바깥의 여백을 의미한다. 클릭이 가능하도록 버튼 기능을 이용할 경우 마진이 아닌, 패딩까지를 클릭의 범위로 인식한다! 예를 들어 아래와 같이 여백을 설정했을 때, 내용과 박스 테두리 사이의 여백이 20px, 박스 테두리 바깥의 여백이 10px일 것이다. margin: 10px; padding: 20px; 패딩과 마진을 활용해 아래 네비게이션 바를 만들 때, 아래의 두 가지 방법이 가능하다. 패딩을 활용할 때 📝 글쓰기 📎 파일 첨부 📂 임시저장 마진..
![](http://i1.daumcdn.net/thumb/C150x150.fwebp.q85/?fname=https://blog.kakaocdn.net/dn/lR8AL/btqWX5EctXc/dgWGgFSLcBDlHtgHxikvX0/img.png)
🎉본 게시글은 코뮤니티 서포터즈 1기로서 작성했음을 알려드립니다.🎉 이번 학기에 '웹 프로그래밍'이란 과목을 듣게 되었는데 '어디에서 어떻게 웹 개발을 먼저 공부할 수 있을까' 고민하던 중 선택한 코뮤니티 모각코 웹 기초 과정! HTML, CSS를 지금 재미있게 배우고 있고 다른 코딩에 비하면 눈으로 결과가 직접 보이는 경우가 많기 때문에 코딩을 재미삼아 해보기 정말 좋은 과정이라 생각한다. 방학에 한 활동 중 코뮤니티 모각코에서 웹 기초를 배우고 있는 건 자연어처리 캠프와 함께 이번 방학에 한 일 중 가장 알찬 일이라 생각한다. 웹 기초 과정에 대해서는 너무 자세히 그동안 다루고 있었고, 다루고 있고, 앞으로도 다루고 있을 것이기 때문에 티스토리 링크 첨부하면서 짧게 글을 마친다...! 코딩하고 싶은 ..
![](http://i1.daumcdn.net/thumb/C150x150.fwebp.q85/?fname=https://blog.kakaocdn.net/dn/F62si/btqWVSegUJ8/OvJbjl8Chk9K37EM3mdKV0/img.png)
서포터즈 활동에 뭐에 바빠서 3~5일차를 밀려버렸는데 설 연휴가 있어서 다행이다...! 기본적인 CSS 사용법에 대해서는 2일차 게시글에 다루었으니 아래 게시글을 참고하면 좋을 것 같다. 코뮤니티 모각코 웹 기초 2일차: HTML, CSS 본격적으로 시작하기 2일차 후기를 쓰기 전 좋은 소식이 하나 생겼다. 바로바로...! 내가 코뮤니티 서포터즈에 합격했다! 열심히 하겠습니다. 뽑아주셔서 감사드려요😊! 메일이 빨리 오기를 손꼽아 기다리는 중이다. jjeongttakgoori.tistory.com 오늘은 모각코 3일차 내용, CSS를 보다 효과적으로 사용하는 방법과 폰트를 사용하는 방법을 공부해보려 한다! 1. CSS를 적용하는 세 가지 방법 HTML 태그에 바로 적용 코딩은 코뮤니티에서! HTML 문서에..
![](http://i1.daumcdn.net/thumb/C150x150.fwebp.q85/?fname=https://blog.kakaocdn.net/dn/bGGwRB/btqWVRGey2L/hMVqU3iJxitvxES4W6LtU1/img.png)
🎉본 게시글은 코뮤니티 서포터즈 1기로서 작성하였음을 알려드립니다.🎉 안녕하세요 코뮤니티 서포터즈 1기 김민정0110입니다! 코딩을 어디에서 어떻게 시작해야 할지 모르겠다면 주목해야 할 코뮤니티! 오늘은 코뮤니티 회원들, 그리고 코딩을 시작하거나 하고 계신 분들이라면 공감할 수 있을 빙고판을 만들어왔어요! 코뮤니티가 여러분을 항상 기다리고 있답니다🥰 ❗본 콘텐츠의 저작권은 코뮤니티와 저, 김민정0110에게 있습니다!❗
![](http://i1.daumcdn.net/thumb/C150x150.fwebp.q85/?fname=https://blog.kakaocdn.net/dn/bhFvkf/btqWQ9gJ6iD/eYO8NWD8oFJqaSuwKYLZkK/img.png)
🎉본 게시글은 코뮤니티 서포터즈 1기로서 작성하였음을 알려드립니다.🎉 1. 들어가며 코뮤니티 서포터즈 필수 미션 첫 번째! 코뮤니티를 SNS에 소개하는 것이다. 지금 모각코를 하면서 많은 도움을 받고 있기 때문에 코뮤니티를 소개하는 게 즐겁기만 하다. 우선 인스타그램에 업로드한 자료부터! 2. 코뮤니티 소개하기 코뮤니티 - 코딩은 독학이야, 모두... : 네이버 카페 코뮤니티 [코딩커뮤니티, 코딩공부, 코딩독학, 코딩과제] : 파이썬 python, C언어,C, C++, 자바 java cafe.naver.com 코뮤니티는 모두의 코딩 공부를 돕는 코딩 커뮤니티이다. 코뮤니티 속 작은 공간들을 소개하면 이렇다. 커뮤니티 커뮤니티는자유게시판과 코딩 공부 인증방, 고민까지 공유할 수 있는 회원들의 만남의 장이다..
![](http://i1.daumcdn.net/thumb/C150x150.fwebp.q85/?fname=https://blog.kakaocdn.net/dn/w78Mv/btqWn13PY1z/jM9gb3DW3lREkPW8Ryvuq1/img.jpg)
모각코를 제쳐두고 쓰는 글. 관심 있는 분야에 대해 글을 쓰는 건 정말 좋은 일인 것 같다. 글이 남을 뿐더러 글은 쓰면 쓸수록 느는 게 느껴지기 때문일 것 같다. 지금은 부족하지만 이렇게 쓰다보면 미래에는 조금 나아지겠지? 그래서 오늘 갑자기 글을 쓰는 이유는 코딩월드뉴스 에디터 활동을 시작했음을 알리기 위해서! 1. 코딩월드뉴스 에디터란? 코딩월드뉴스 글로벌 코딩 전문미디어, Tech, 프로그래밍, 아카데미, 4차산업혁명 www.codingworldnews.com 코딩월드뉴스는 코딩뿐만 아니라 IT를 비롯한 테크, 4차 산업혁명에 대한 다양한 기사가 올라오는 사이트이다. 에디터를 지원하면서 알게 된 사이트이긴 한데 다양한 주제의 기사들이 모여있다는 게 매력적인 것 같다. 요즘 티스토리에 글을 남기는 ..
![](http://i1.daumcdn.net/thumb/C150x150.fwebp.q85/?fname=https://blog.kakaocdn.net/dn/lmtpA/btqV36XsAKO/W3zQxKETqTgJfiKggfSXF1/img.png)
2일차 후기를 쓰기 전 좋은 소식이 하나 생겼다. 바로바로...! 내가 코뮤니티 서포터즈에 합격했다! 열심히 하겠습니다. 뽑아주셔서 감사드려요😊! 메일이 빨리 오기를 손꼽아 기다리는 중이다. 1. HTML의 기본 구조 코뮤니티 웹 기초 1일차: 웹 개발 시작하기 1. 웹 개발 시작하기(에디터 설치) 많고 많은 에디터가 있지만 수업에서는 Visual Studio Code를 다루고 있고 나 역시 코딩을 하면서 설치해둔 Visual Studio Code를 사용했다. Visual Studio Code가 편한 이유.. jjeongttakgoori.tistory.com 어제 웹 개발, HTML의 기초를 배우면서 태그를 주로 다루었는데 그 내용과 오늘의 내용이 맞닿아 있다. HTML은 마크업 언어이기 때문에 모든 H..