wellkiim

안녕하세요! 웰킴입니다.어제는 많은 태그들을 활용한 기초웹페이지 영역을 나누는 방법에 대해 알아보았죠!그것과 마찬가지, 연장선으로 잠깐의 테스트형식의 문제를 풀어볼까합니다.!웹페이지의 영역wrap , header , 그리고 container , footer등 각각의 영역에 대한 이해는 충분히 하셨다고 보고,잠시 복습해본 다음 !다음 단계로 넘어가보도록 할게요!해상도 PC에서 가장 기본적인 해상도 ( 반응형 고려 ) : 1025px , 1280px 이 있습니다. PC에서만 사용하는 해상도 ( 관공서 , 예전 PC ) : 940px ( 리뉴얼 하기 전의 네이버와 다음의 너비사이즈 ), 960px, 980px 이 있습니다. 글자정렬 text-align : left , right , center + left :..

안녕하세요. 웰킴입니다. 어제는 인라인요소와 블럭요소에 대한 이해에 목적을 둔 시간을 가졌는데요.오늘은,많은 태그들을 활용한 기초 웹페이지 영역을 나누는 방법에 대해 알아보도록 하겠습니다.! HTML에 대한 글을 작성했을 때에 wrap 영역과 header , 그리고 container , footer 등 각각 영역에 대한 설명을 드렸던 것들을 기억하시나요? 클릭 ▶ HTML 설명 바로가기 그 각각의 영역이 어떠한 것들을 담고있는지에 대한 설명과, pc버전들이 가지는 각각의 픽셀 크기 등을 알아보도록 하겠습니다. 에디터 편집기를 사용하여 코드를 작성해보도록 하겠습니다. 123456789101112131415161718192021222324252627282930313233343536373839404142434..

안녕하세요. 웰킴입니다. 어제부터 CSS에 대하여 알아보는 시간을 가졌는데요.css에 대한 높이와 너비설정을 이용하여 박스형태의 모양을 만들어보도록 하겠습니다. 먼저,weight : 너비값을 말합니다. px단위로 설정할 수 있습니다.height : 높이 값을 말합니다. 마찬가지로 px단위로 설정할 수 있습니다.전 시간에 inline 요소와 block요소에 대해 알아보았는데요.대표적으로 span 태그가 인라인요소였죠.인라인요소는 기본적으로 너비와 높이값을 가지지 않습니다. 그렇기 때문에 너비와 높이값을 줘도 적용되지 않습니다.그렇다면, 인라인요소에 너비와 높이값을 주기위해서는 어떻게 해야할까요.? 인라인요소를 블럭요소로 바꾸어주어야합니다. 에디터에 코드를 작성하여 알아보도록 하겠습니다. 1234567891..

안녕하세요.! 오늘은 추천 에디터인 브라켓 ( brackets )의 유용한 플러그인을 추천해드리려고 합니다.! 물론, 각자의 성향에 따라 유용할 수도, 불편할 수도 있으니 이 점 잘 참고하시고 각자 편하신 것을 사용하시면 될 것 같습니다.! HTML 편집기 무료 소프트웨어 Adobe Brackets ▼ 아래 텍스트를 클릭하시면 다운로드 및 설치 방법에 대한 페이지로 이동하게 됩니다. " Adobe Brackets 설치방법 " 일단, 다운로드 받은 Brackets을 실행하게 되면 , 아래 이미지와 같은 페이지가 나타나게 됩니다. 그 후, 해당 이미지 버튼을 클릭해주시면 플러그인 다운로드 창이 나타나게 됩니다. ▼ 플러그인 다운로드 창 제가 사용하는 플러그인을 소개해드리도록 하겠습니다. ! 1. Popup-..

오늘은 추천 에디터인 브라켓 ( brackets )을 소개해드리려고 합니다.! Html 편집기 무료 소프트웨어 Adobe Brackets HTML / CSS / jQuery / javascript / php / JAVA 등을 알아가기 위해 필요한 작성 에디터가 필요하겠죠? 저도 맨 처음에는 Editplus 라는 에디터를 사용하였습니다. 하지만, 조금 더 편하고 예쁜 템플릿을 가진 에디터를 찾다가 Brackets을 처음 접하게 되었는데요. 다양한 편집기가 있지만, 오늘은 Brakcets을 소개해드리려고 합니다. 그건 바로 " Adobe Brackets " ▼ 다운로드 링크 http://brackets.io/index.html Adobe Brackets 다운로드 사이트 링크된 사이트로 이동하면 위같은 화면이..

안녕하세요. 웰킴입니다. 어제부터 CSS에 대하여 알아보는 시간을 가졌는데요. 오늘은 한층 난이도를 높여서 css의 기능 중에 많이 쓰는 명령어들을 알아볼까 합니다.헷갈릴 수 있으니 잘 따라와주시길 바래요 ~ 오늘 배울 명령어들을 먼저 알아보도록 하겠습니다. 먼저, font-weight : 폰트의 굵기를 말합니다. 기본적인 크기는 400 이라고 생각하면 됩니다. 100 단위로 크기를 높이는 것이 일반적입니다. color : 폰트의 색상을 말합니다. 16진법이 일반적입니다. 경우에 따라 #red , #yellow 등 고정적인 값을 영어로 입력해도 무방합니다. text-align : 폰트의 정렬 형태를 말합니다. left , center , right 가 있습니다. text-transform : 영어로 된 ..

안녕하세요. ! css로 다시 찾아뵙는 웰킴입니다. 오늘은 css에 대하여 처음 말씀을 나누어볼까 합니다.! 먼저, 두산백과에서 따온 css의 정의를 알아보도록 할게요. 요약 웹 문서의 전반적인 스타일을 미리 저장해 둔 스타일시트이다. 문서 전체의 일관성을 유지할 수 있고, 세세한 스타일 지정의 필요를 줄어들게 하였다. html이 마크업으로서, 전체적인 뼈대를 만들어주었다면,css는 이제, 꾸며주는 역할을 한다는 사실 알고 계셨나요.? 간단하게는 글자의 색깔을 바꾸거나,배경에 색상을 주거나. 등등 여러가지 방법으로 응용이 가능하답니다.! 그렇다면 오늘은 먼저, css의 기본을 배워볼까요 .! 언제나 그렇듯이 마찬가지로 에디터에 코드를 작성해보도록 하겠습니다.! 아시죠?? (각 태그에 적혀있는 텍스트 들은..

자 오늘은 어제 배운 태그 중에서 간단하게 inline 속성 태그와block 속성의 태그들을 알아보도록 하겠습니다. 같은 방식으로 에디터에 코드를 작성한 후, 그에 대한 출력값을 보여드리는 형태로 진행을 하도록 하겠습니다.! 에디터에 작성한 코드/ 즉, 각 태그에 작성한 글들이 그 해당 태그들에 대한 설명인 것을 알고 봐주시면 되겠습니다.! 블록요소 : 박스요소블록요소의 내용: 너비와 높이값을 가지는 형태의 요소를 블록요소라 말한다.블록요소는 기본적으로 끝에서 끝까지 영역을 차지함블록요소중에서 p태그는 가장 작은 단위의 박스요소 인라인요소인라인요소의 내용: 글씨요소로 사용, 가나다라마바사....옆으로 나열되는 특징을가지고 있음 + 인라인 태그들 중에는 열고 닫고가 없어도 표현이 가능한 태그들이 많다! b..

자 이번에는 html에서 사용하는 태그들 중 몇가지를 먼저 알아보도록 하겠습니다. 일단 headline 태그로 h1 ~ h6 태그가 있습니다. 각각 1부터 6까지 점점 작아지는 형태를 띄우는 태그입니다.앞의 숫자가 작아질수록 대제목, 소제목으로 나눌 수 있습니다. 보통 h1태그는 로고를 담는 태그나 해당 페이지의 이름을 쓸때 한번 사용하고,그 외에는 사용하지 않는 것이 일반적입니다. 그리고 가장 많이 쓰는 형태인, div와 p태그 인라인과 블럭 형태의 태그들이 존재합니다.그에 대해서는 추후에 설명드릴 예정입니다. div와 p태그는 단락을 나누는 태그인 태그를 사용하지 않아도 알아서 단락이 나누어지게 됩니다. 에디터에 코드를 작성해 보도록 하겠습니다. tag의 종류와 의미headline태그는 영역의 제목 ..

html의 기본에 대하여 글을 작성해보려 합니다. 먼저, html이란 ? 웹 문서를 만들기 위하여 사용하는 기본적인 프로그래밍 언어의 한 종류이다. 하이퍼텍스트를 작성하기 위해 개발되었다. HTML이란 , 말 그대로 예쁜 웹을 만들기 전 markup 단계라고 생각하시면 됩니다.! 기본 코드 에디터에서 사용하는 방법을 말씀드리자면, 이런식으로 정의할 수 있을 것이라 생각합니다. 기본 html에 텍스트를 넣기 전 설정이라고 생각하시면 됩니다.

나는 디자인을 전공하신 부모님의 영향으로 어렸을 때 부터 미술을 전공했다. 영향이라고 하기엔 뭐하지만, 부모님은 당연히 자식인 내가 힘든 디자인을 하기 원하시지 않았을 테지만, 피는 못속인다고, 어렸을 때부터 애원했었지. 그 결과, 건축인테리어를 전공하게 되었고, 졸업까지 우수한 결과?로 마무리를 지었다. 디자인의 피와 연관이 있는건지, 나는 다른 피를 이어받은 것인지 실질적인 스케치보다는 Tool들을 더 잘다루었고, 그로 인하여 화면에 출력되는 이미지들은 나의 만족감을 더 끌어올렸다. 그러다보니 자연스럽게, 프로그래밍쪽에 관심이 갔다. 그래서 작년 가을, 국비지원을 받아 코딩을 본격적으로 시작하게 되었고, 그로부터 6개월, 오늘. 프론트엔드 개발자로 정식 입사하였다. 사실 . 다년간 배워왔던 미술( 디..