NUMPY 시작
·
Python/numpy
수업시간에 numpy에 대해 배우기 시작했는데 자꾸 함수를 잊는것 같아 블로그에 업로드 하려 한다. 이 카테고리에 업로드 하는 글은 numpy 라이브러리의 함수를 주로 쓸 예정이다. 먼저 numpy는 배열간의 연산을 빠르게 하기 위한 라이브러리이다. 따라서 파이썬의 단점인 속도를 보완할 수 있고, 많은 데이터를 한번에 처리하기 때문에 크기면에서도 효율적이다.
이미지와 그라데이션 효과로 배경 꾸미기
·
Front end/CSS
이번 단원에서는 배경 이미지와 그라데이션 효과를 줄 수 있는 속성에 대해 배웠다. 배경 이미지는 웹을 만들 때 많이 사용되는 요소이고 눈에 가장 먼저 띄는 요소이기 때문에 집중해서 공부했다. 그런데 background - clip 속성과 background - origin 속성의 차이점을 모르겠다. 책에서는 배경 이미지의 적용 범위를 나타내는 속성이라고 나와있는데 둘 다 옵션도 같은것 같아 어떤 상황에서 어떤 속성을 써야하는지 다시 찾아봐야겠다. + 수정 ) clip은 배경색의 범위를 지정하는 속성이고 origin은 이미지를 지정하는 속성 배경색을 지정하는 속성 - background-color : 요소의 배경 색을 지정하는 속성. rgb값이나 16진수 또는 색상이름을 사용해서 지정 배경색의 적용범위를 ..
T story 블로그 클론 코딩
·
Project
최근 css를 공부하며 나도 내 웹 사이트를 만들면 어떨까 하는 생각이 들었다. 아직 JS 와 css 를 완전히 마친게 아니라서 너무 섣부른가 하는 생각도 있었지만 욕심이 생겨 인터넷 검색과 책을 통해 내 블로그를 만들어 보았다. 이 웹사이트를 만들어보면서 생각보다 웹을 만든다는게 쉽지만은 않은 일이라는 것을 알게 되었고, 실력이 전보다 훨씬 늘었다는게 스스로 체감이 될 정도로 정말 도움이 많이 되었다. 웹사이트 링크 : https://jaehwi.netlify.app/ 미리보기 html 코드 Dvelopment blop 홈 태그 방명록 전체 글 94 레이아웃을 구성하는 css... 배치 방법을 결정하는 속성 - display: 블록레벨요소와 인라인 레벨 요소를 서로 바꿔서 사용할 수 있게 함. 네비 속..
레이아웃을 구성하는 css 박스모델 (2)
·
Front end/CSS
배치 방법을 결정하는 속성 - display : 블록 레벨 요소와 인라인 레벨 요소를 서로 바꿔서 사용할 수 있게 함. 네비 속성에서 메뉴 항목을 가로로 배치하거나 이미지를 표 형태로 배치할 수 있게 함 종류 설명 block 인라인 레벨 요소를 블록 레벨 요소로 만든다 inline 블록 레벨 요소를 인라인 레벨 요소로 만든다 inline-block 인라인 레벨 요소와 블록 레벨 요소의 속성을 모두 가지고 있으며 마진과 패딩을 지정할 수 있다, none 해당 요소를 표시하지 않음 좌우 배치를 결정하는 속성 - float : 특정 요소를 왼쪽이나 오른쪽에 고정하는 속성. 이 때 요소를 배치한 후 다른 요소와 적당한 간격을 유지하고 싶다면 margin속성을 이용해 조절할 수 있다. - clear : float..
레이아웃을 구성하는 css 박스모델 (1)
·
Front end/CSS
처음에는 웹을 만들 때 웹을 큰 하나의 화면으로 보고 모든 요소를 그 위치에 맞게 조절해야 하는 줄 알았는데 사이드바, 본문 푸터등 큰 틀을 먼저 잡아서 하나의 큰 화면을 만든다는 것을 알았다, 이 전에도 헤더 푸터와 같은 내용을 배웠지만 그걸 구현하는 방법을 몰랐었는데 다시 한 번 짚고 넘어가니 쉽게 이해할 수 있었다. 또한, 패딩과 마진같은 테두리 안에 있는 용어에 대해서도 다시한번 생각해 볼 수 있었다. 박스모델 - 블록 레벨 요소 : 태그를 사용해 요소를 삽입했을 때 혼자 한 줄을 차지하는 것 (가로로 100%) - 인라인 레벨 요소: 태그의 콘텐츠만큼만 영역을 차지하며 다른 요소가 올 수 있음 (가로로 해당 크기만큼) 박스 모델의 기본 구성 - 콘텐츠 영역 (content) - 패딩 (paddi..
텍스트를 표현하는 다양한 스타일 (2)
·
Front end/CSS
이번 단원에서는 목록과 표의 스타일에 대해 배웠다. 목록은 쉽게 공부할 수 있었지만 표를 공부하는데는 조금 시간이 걸렸다. 내가 테이블에 대해 어렵게 생각한 탓인지 기초 지식이 부족해서 그런것 같아 이전에 표를 생성하는 html을 한번 보고 공부하니 조금 쉽게 이해를 할 수 있었다. 1. 목록 스타일 (list - style) 목록 스타일은 list - style - type 속성을 이용하여 정할 수 있다. 이 떄 스타일의 속성값의 종류는 아래와 같다. 종류 설명 예시 disc 채운 원 모양 ● circle 빈 원 모양 ○ square 채운 사각형 모양 ■ decimal 1부터 시작하는 10진수 1,2,3,... decimal - leading - zero 0으로 시작하는 10진수 01,02,03, ....
텍스트를 표현하는 다양한 스타일 (1)
·
Front end/CSS
이번 단원에서는 텍스트의 시각적 효과에 대해 다룬다. 따라서 글씨의 크기, 색, 글씨체 그리고 왼쪽, 오른쪽 정렬과 같은 내용이 주를 이룬다. 지금 내가 쓰고있는 이 글에서도 글씨의 색을 바꾸거나 필기체를 바꾼다거나 하는 옵션이 있는데 그런 버튼을 클릭하게 되면 css 상에서 변하도록 설정해 놓은 것 같아서 신기했다. 텍스트의 효과를 바꾸는 속성 font-family (글꼴 지정) : 주로 태그와 같은 텍스트를 사용하는 요소에서 사용된다. 기본형은 font-family : | [,] 으로 사용 → 글꼴을 2개 이상 지정할 때에는 사이에 쉼표를 넣어 사용 → 지정한 글꼴이 사용자 시스템에 설치되어 있지 않다면 글자가 깨질 수 있음 font-size (글씨 크기 지정) : 글자 크기의 단위는 px이나 pt로..
웹 문서에 디자인 입히기
·
Front end/CSS
저번 단원에서 html을 마치고 css를 처음 시작했다. css는 웹의 보이는 모습을 만들고 움직이는 형태까지 만들 수 있다길래 어렵지 않을까 생각했었는데 생각보다 쉬웠고 재미있었다. 아 그리고 하나 궁금증이 생겼는데 ID선택자는 문서에서 한 번만 적용할 수 있다고 한다. 그러면 굳이 ID를 만들지 않아도 인라인 스타일을 사용해서 원하는 줄의 스타일을 바꾸면 되지 않을까하는 것이다. 그런데 지금 생각해보니까 외부 스타일을 이용하기 위해서는 ID 선택자를 쓸 수밖에 없을 것 같다. CSS(Cascading Style Sheet) CSS를 사용하는 이유 웹 문서의 내용과 상관없이 디자인만 바꿀 수 있다 다양한 기기에 맞게 탄력적으로 바뀌는 문서를 만들 수 있다 CSS의 스타일형식 선택자 {속성1 : 속성값 ..
입력 양식 작성하기 (2)
·
Front end/HTML
input 태그의 주요 속성 placeholder : 입력란에 힌트를 보여준다 readonly : 읽기전용 문서를 만든다 required : 필수 입력란을 만든다 autofocus : 창을 열었을 때 바로 타이핑 할 수 있도록 해당 입력란이 선택된다 다음은 input 태그의 여러 속성을 담은 코드이다. 프런트엔드 개발자 지원서 HTML, CSS, Javascript에 대한 기술적 이해와 경험이 있는 분을 찾습니다. 개인정보 이름 연락처 지원 분야 웹 퍼블리싱 웹 애플리케이션 개발 개발 환경 지원 동기 미리보기 + 추가. html 파일을 첨부하면 화면이 비정상적으로 꺠진다. 그래서 웹 미리보기는 삭제 폼에서 사용할 수 있는 여러 태그 ~ : 여러 줄을 입력할 수 있는 텍스트 박스 생성 select : 드롭..