예전에 애드센스와 티스토리 입문때 가장 골치 아팠던 부분이 바로 중앙정렬 이었습니다. 애드센스 상단 두개의 광고를 노출시키는 방법, 그리고 중앙정렬 하는 방법을 몰라서 참 해메었던 기억이 있는데, 지금 다 배우고나니 별거 없구나 라는 생각을 하게 됩니다. 테이블 (table) 태그는 영역을 나누는 기능이라기 보다는, 표를 만들 때 많이 사용하는 태그인데, 사실 거의 사용하지는 않습니다. 테이블 태그 대신 div를 많이 씁니다. 그래도 알아두면 언젠가는 요긴하게 쓰일테니 오늘 배운 간단한 개념을 한번 정리해보고 응용해보는 시간을 갖도록 하겠습니다. 우선 html 기본 구조를 작성합니다. 늘 그렇듯 사용 프로그램은 브라켓 (Brackets) 입니다. 본문 body 안쪽에 테이블을 작성해 줍니다. 사용 태그는..
제목이 다소 복잡한 것 같습니다만, 다시한번 풀어서 설명하면 이렇습니다. 하나의 메뉴를 두고, 링크된 글씨나 이미지를 누르면 아래쪽에 해당 페이지를 불러오거나, 그쪽으로 바로 이동하는 방법입니다. 보통 스크롤 내용이 많은 쇼핑몰의 경우, 오른쪽에 보시면 TOP 메뉴라던지, 제품 상세보기 버튼이 있을 수 있습니다. 바로 이런 경우가 하나의 웹페이지 상에서 구간별로 영역을 나누어 해당 구간으로 이동하는 기능이라고 보시면 됩니다. 우선 HTML 기본 태그와 요소들을 작성해 둡니다. 그리고 본문 안족에 a태그를 이용해서 구성했습니다. 저기 보시면 와 사이에 " | " 이렇게 생긴 특수문자가 보이시나요? 저건 키보드에 보시면 백스페이스 바로 왼쪽에 있는 특수문자 입니다. Shift를 누른 상태에서 누르시면 출력됩..
오늘은 간단한 태그 입니다. 글자나 이미지에 클릭 시 이메일을 바로 보낼 수 있는 링크를 거는 방법에 대해 알아보겠습니다. 먼저 HTML 기본 구조를 만들고, body 안쪽에 다음과 같이 작성해 보겠습니다. 2018 © copyright by 텍스트입력 이렇게 입력하시면 됩니다. 그러면 미리보기로 한번 브라우저에 띄워보겠습니다. 보시는것처럼 이렇게 정상적으로 문구가 나타나고 있고, admin 을 클릭하면 윈도우의 경우라면 아웃룩 익스프레스가 열리거나 혹은 기타 메일 프로그램이 열리게 됩니다. 간단하지만 요긴하게 쓰일 수 있는 이메일 링크 입니다. 끝. ●HTML 이미지에 ALT 태그 속성값을 반드시 넣어줘야 하는 이유●HTML에서 주소 입력하는 address 태그를 사용하는 방법 "친절한효자손 취미생활"..
이번 시간에는 사소하지만 정말 중요한것을 알아보겠습니다. 이건 네이버 웹마스터에 있는 링크구조에 대한 오류와도 관련있는 문제일 수 있습니다. 더 나아가자면, 자신의 검색엔진에 노출되는 영향과도 관련이 있을 수 있습니다. 바로 이미지를 대처하는 alt 태그에 대한 내용 입니다. 일반적인 이미지 태그는 다음과 같습니다. 여기에서 저 alt 태그가 정말 정말 중요합니다. 꼭 이미지에는 alt 태그를 넣어주셔야 합니다. 왜 그런지 이유를 파악해 보겠습니다. 먼저 늘 하던대로 이미지 폴더를 html이 위치한 루트 폴더에 생성합니다. 저는 image 라고 이름을 적었습니다. image 폴더 안에 googlelogo.png 파일을 넣었습니다. 이것을 웹에 띄워보겠습니다. html 코딩을 구성합니다. width와 he..
HTML 문서에서 주소를 입력하는 방법입니다. 그냥 태그를 사용해서 작성하셔도 되지만, 굳이 address 태그를 사용하는 이유는 있을 것입니다. 이유는 바로 검색엔진 때문입니다. 보통 주소라던지 해당 블로그 혹은 사이트에 대한 정보는 HTML 중에서도 제일 하단에 많이 나옵니다. 이 부분을 FOOT 영역이라고 하는데, 여기에 보통 태그를 많이 사용합니다. 검색엔진도 바로 이런 부분을 찾습니다. 만약 어떤한 기업 주소를 인터넷에서 찾는다고 가정하면, 해당 검색엔진 알고리즘은, footer 안쪽의 address 태그를 먼저 찾습니다. 그렇기 때문에 특정 태그를 사용하는것이 유리하다고 할 수 있습니다. 그러면 이제 태그를 어떻게 사용하는지 알아보겠습니다. 생각보다 간단합니다. HTML 기본 구조를 작성하시고..
오늘은 간단하지만 정말 중요한 개념을 배웠습니다. HTML에서 코딩시 흔하게 사용하는 태그라던지, 태그라던지 하는 개념에 대한 부분이었습니다. 이 한 묶음의 태그를 "요소" 라고 말합니다. 예를 들자면, 티스토리는 참 재미있습니다. 를 사용했을 경우, 가 한쌍으로 묶였는데, 이것을 요소라고 보시면 됩니다. 요소에는 블록요소와 인라인요소라고 하는 개념이 존재합니다. 저도 처음 들었을 때는 대체 뭔소린가 싶었는데, 자세히 배워보니까 생각보다 이해하기 쉬운 것이었습니다. 한번 예를 들어서 알아보도록 하겠습니다. 브라켓으로 HTML 기본 구조를 작성합니다. 그리고 위와같은 태그로 한번 구성해 봤습니다. 헤드 태그 안쪽에 쉽게 설명을 위한 스타일 태그도 넣었습니다. 이렇게 하면 결과가 어떻게 얻어지는지 한번 보겠..
이번 시간은 참으로 사용하기 용이한 이미지맵에 대해서 알아보겠습니다. 이 방법은 네이버 블로그에서 많이 사용합니다. 네이버 블로그를 사용하시는 분들 중에서는 위젯 곳곳에 링크를 걸어두신 분들이 제법 많이 계십니다. 대체 이건 어떻게 하는걸까 궁금하셨던 분들은 이번 강좌를 꼭 눈여겨 봐주시기 바랍니다. 이미지맵이란 말 그대로 커다란 이미지 안에서 투명한 가상의 레이어를 만들어 그곳에 링크를 거는 방법 입니다. 우선 준비물은 사용하고자 하는 이미지가 필요합니다. 그리고 HTML 태그 중, AREA 그리고 MAP 태그를 사용해서 원하는 좌표에 넘어가고자 하는 인터넷 주소를 입력해서 사용하게 됩니다. 그러면 구체적으로 어떻게 하는지 알아보겠습니다. 우선 이미지는 이것으로 사용해 보겠습니다. 웹 접근성 연구소 홈..
오늘은 특수문자에 대한 태그를 알아봅니다. 이 방법을 알아야 하는 이유는 바로 지금 작성하는 이런 강좌 관련 때문입니다. 예를 들자면 이라고 하는 태그를 문자 그대로 출력이 되게 하고 싶지만, 실제 HTML 문서상에서 P태그 안에서 작성하면 이 문자를 태그로 인식하기에 글씨는 보이지 않고 한 줄 내려쓰게 되는것으로 처리가 됩니다. 그래서 우리는 특수기호에 대한 태그를 알아야 합니다. 따라서 을 문자 그대로 HTML 문서에 출력하게 하려면 태그를 구성하는 ""에 대한 태그를 사용해서 표현하면 될 것입니다. 방금 위에서 설명한 내용입니다. 여기에서는 코딩 프로그램을 브라켓을 사용했습니다. 보시는 것 처럼 본문 안에 " 태그는 줄바꿈 태그이다." 라는 문구를 출력하고 싶은데, 과연 위의 스크린샷 내용대로만 작..
이번 시간에는 간단한 개념을 짚고 넘어가려고 합니다. 저도 이 부분에 대해 궁금했는데 오늘 수업을 들으면서 궁금증이 해소되었습니다. HTML 코드 중 안쪽에서 존재하는 여기에서 처음 나오는 h1이 바로 선택되어지는 대상, 즉 선택자라고 말합니다. 그리고 소괄호 안에 들어가는것이 바로 적용되는 스타일 내용입니다. 예시에서는 레드 컬러로 설정되었다는것을 확인할 수 있습니다. 따라서 이 뜻은, "h1 태그를 사용한 텍스트에 한해서는 글자색을 빨간색으로 만들어라!" 라는 뜻이 됩니다. 그렇기에 실제 웹으로 출력을 해보면 이렇게 태그만 글씨가 빨갛게 적용된 것을 알 수 있습니다. 어려운 개념은 아니지요? 다음은 스크립트 (script) 입니다. 스크립트 또한 스타일을 변경하기도 하지만 주로 동적인 부분을 변경시켜..
아마도 html에서 가장 흔하게 사용되는 태그는 바로 링크태그와 이미지 태그라고 생각합니다. 링크 태그는 태그이며 항상 href 가 같이 따라붙게 되는 경우가 흔하죠. 이미지 태그도 마찬가지 입니다. 이 둘이 같이 병행해서 쓰이는 경우도 많은데 보통 사진에 바로가기 링크를 걸 때 쓰입니다. 어떤 식으로 활용하는지 가장 기초적인 방법을 알아보도록 하겠습니다. 참고로 가장 기본이 되는 방법에 대해서만 작성했습니다. a 태그와 img src에 대한 다양한 활용법에 대해서는 앞으로 배워가면서 알게되면 그때마다 바로 업데이트 하도록 하겠습니다. 만약 이제 막 시작하신 분들이시라면 오른쪽 카테고리에서 HTML 로 들어가셔서 처음부터 살펴보시는것을 권장합니다. 텍스트에 링크걸기 본문 안쪽에 구글 바로가기 글씨와 링크..
오늘은 목록 태그 중 하나인 ol (오더드 리스트) 와 ul (언오더드 리스트) 에 대해 알아볼 것입니다. li는 왜 설명이 없냐고요? 차츰 설명을 드릴 것 입니다. 먼저 은 순서가 있는 목록 태그라고 합니다. 1,2,3 혹은 A,B,C 순으로 자동 배열됩니다. 그러면 딱 봐도 은 어떤건지 대충 감이 오시죠? 그렇습니다. 이 태그는 순서가 없습니다. 그냥 기호화 되어 표시가 됩니다. 말로는 역시 한계가 있으니 아래의 스크린샷 이미지를 보시면서 알아보시겠습니다. 태그 사용법먼저 HTML 문서의 본문에 삽입해본 내용입니다. 먼저 ol 태그를 사용해보겠습니다. 보시면 ol 태그를 감싼 안쪽에 태그를 넣었는데 이것이 바로 리스트를 구성하는 핵심 태그라는 것을 알 수 있습니다. 내용 으로 구성되어 넣으시면 됩니다..
제목 태그인 H태그에 대해 알아보겠습니다. 만약 이 태그를 블로그와 비슷한 플랫폼에서 활용하시게 된다면 제목이라기 보다는 소제목에 가까울 수 있습니다. 참고로 검색엔진이 참 좋아하는 태그가 바로 H태그 입니다. 그만큼 중요한 태그이며 잘 활용한다면 분명 방문자는 늘어날 것이라고 생각합니다. (물론 본문 내용도 훌륭해야하겠죠!?) 그렇지만 적절히 활용하시기를 바랍니다. 검색 노출에 잘 반영된다고하여 자주 사용한다면 오히려 역효과를 불러올 수 있습니다. 사용법은 무척 간단합니다. 안에 구성된 텍스트 중에서 H태그로 감싸주시기만 하면 끝 입니다. 지금 위의 예시대로 한번 작성해 봤습니다. 어떻게 변하는지 한번 살펴보도록 하겠습니다. 사용하는 프로그램은 브라켓 (Brackets) 이라고 하는 편집 프로그램 입니..
html 문서를 살펴보면 항상 시작에는 이라고 하는 태그가 있습니다. 만들고자 하는 웹문서가 어떤 웹 표준 기술을 사용하고자 하는지를 정의하는 태그입니다. 지금은 HTML5 가 표준입니다. 따라서 html 문서의 첫 시작은 위처럼 정의하고 시작을 하는 편 입니다. 그리고 안에 존재하는 메타 태그 또한 비슷한 이유에서 작성하게 됩니다. 예전 시간에 HTML 기본 골격에 대해 설명드렸을 때, 헤드 부분이 사람의 얼굴과 비슷하다고 말씀 드렸습니다. (기억 나시나요? ㅠㅠ) 이 사람의 성격은 어떨지, 지금 무슨 생각을 하고 있을지, 인상은 어떤지 모두 머리 부분에서 파악할 수 있는 내용들 입니다. HTML 문서 또한 마찬가지로서 head 태그 안의 정보들로 이제 이 웹페이지는 이런 코딩을 가지고 있고, 이런 스..
주석이란 HTML 태그 코딩에 일종의 설명을 코멘트를 남기는 것 입니다. 제작자도 이 태그는 어떤 부분에서 어떤 식으로 적용되는 태그인지 햇갈릴수가 있습니다. 그래서 발자취를 남기는것이죠. 그것을 주석처리라고 합니다. 주석은 코딩의 설명을 위한 부분으로 실제 웹페이지에서는 노출이 되지 않습니다. 그러면 HTML 내에서 사용되어지는 일반 태그들, 그리고 스타일 (Style), 스크립트 (Script) 안에서 주석처리는 어떤식으로 할까요? 약간씩 차이가 있습니다. 위에 표시된 부분이 각 부분별 주석처리 방법입니다. 정리해 보자면 다음과 같습니다. ▶ 일반 태그 안에서의 주석 처리 /* 코멘트 */ ▶ 스타일 태그 안에서의 주석 처리// 코멘트 ▶ 스크립트 태그 안에서의 주석 처리 이렇게 사용할 수 있습니다...
지난 시간까지 우리는 태그에 대한 사용방법을 알아보았고, 또다시 P 태그에 스타일을 만들어서 색다르게 텍스트를 꾸미는 방법도 확인했습니다. 근데 P태그의 경우는 적용된 단락 전체를 가지고 활용하는 방법인데, 내부에 있는 특정 키워드에만 다른 스타일로 적용하는 방법은 없을까요? 이럴때 필요한것이 태그 입니다. SPAN태그는 단독 사용이 불가하며 여느 태그와 마찬가지로 마무리를 으로 해주셔야 하며, 사이의 텍스트에 적용시키는 방법입니다. 말로 설명하는건 한계가 있으니 예시를 통해서 알아보도록 합니다. 지난 시간에 예시로 든 진달래꽃 텍스트를 그대로 활용하도록 하겠습니다. "나 보기가 역겨워 가실 때에는 말없이 고이 보내 드리오리다." 에서 "말없이" 에만 스타일을 적용시켜보도록 하겠습니다. 방법은 간단합니다..
지금은 거의 사용하지 않는 태그지만, 때때로 요긴하게 써먹을 수 있는 스타일 태그를 알아보겠습니다. 특정 글꼴을 사용하고 싶을 때, 어떤 키워드만 크게 키워서 강조하고 싶을 때, 또한 해당 키워드의 색상을 변경하고 싶을 때 사용되는 방법입니다. 이 방법은 이제 CSS 스타일로 저장되어서 편리하게 꺼내쓸 수 있다고 설명은 들었는데 아직 거기까지는 진도를 나가지 않았습니다. 그러므로 지금은 이것만으로도 무척이나 신기할 따름입니다. 예전에 티스토리 스킨을 이것저것 만지면서 검색을 통해 배운 태그들이 이제 눈에 하나둘씩 들어오기 시작합니다. 어쩌면 그때 많은 시행착오를 겪었던 것들이 훗날 이런 도움의 밑거름이 되지 않았나 생각해 봅니다. 지난 시간에 이어서 진달래꽃 텍스트를 그대로 활용해 보겠습니다. 나 보기가..
지난 시간에는 HTML의 기본 구조와 태그에 대해서 간략하게 알아봤습니다. 여기까지는 무척이나 쉽습니다. 그러나 기초가 가장 중요하다고 생각합니다. 그러니 쉽다고 안일하게 생각할 것이 아니라 이 기초를 활용하여 여러가지로 응용할 수 있을 것 이라고 기대하고 있습니다. 선생님께서도 기초가 진짜 중요하다고 신신당부를 하시네요. 이번 시간에는 문단을 구성하는 태그와 줄바꿈하는 태그의 쓰임새를 알아보겠습니다. 참고로 P는 패러그래프의 약자로 단락을 의미하며, BR은 라인브레이크의 약자입니다. (왜 RB가 아니고 BR일까...?) 또한 태그는 마무리태그가 없이 단독으로서 사용이 가능합니다. 참고하시기 바랍니다. 어제에 이어서 오늘은 본문을 구성해 보았습니다. 진달래꽃 시를 그대로 텍스트로 넣었습니다. 태그 안에 ..
드디어 오늘부터 시작입니다. 새롭게 배우기 시작한 웹퍼블리싱 수업을 정말 잘 들어서 마스터 할 수 있도록 노력하겠습니다. 시작이 반 이라고 하였으니 전 반은 성공한 샘이네요. ㅎㅎ HTML과 일반 텍스트 구성의 책(문서)의 차이는 바로 링크의 유무라고 배웠습니다. 듣고보니 맞는 말 이네요. 첫 시간에는 태그에 대한 내용을 배웠습니다. 태그라는 단어는 아마 많이들 들어보셨을 것 같습니다. html을 구성하는 기본 단위가 바로 태그입니다. 웹 언어라고 하는데, 태그를 사용해서 웹 페이지를 구성하게 됩니다. 태그는 무조건 들어가는 기본 단위라고 생각하시면 될 것 같습니다. HTML 문서를 만드는 방법은 브라켓, 드림위버, 노트패드 등등의 프로그램을 사용하셔도 되지만, 윈도우 메모장으로도 충분히 작업할 수 있습..
CSS 스타일에서 미리 반응형으로 만들거나, 자바스크립트를 통해서 반응형으로 만드는 방법은 많습니다만 가장 원초적인 방법인 HTML 태그를 손보는 방법에 대해서는 검색해도 잘 안나오네요. 그래도 찾았습니다. 이렇게 간단한 방법으로 이미지를 반응형으로 만들 수 있다니! 좋습니다. 이미지 태그는 img src 입니다. 이 태그의 마지막에 스타일을 추가해서 반응형으로 만들 수 있습니다. 우선 태그 형태를 살펴보도록 하겠습니다. 이렇게 됩니다. 그리고 각 태그별 설명은 이렇습니다. ●a → 링크 태그●target="_blank" → 새 창에서 열리게 해줌●href → 인터넷 주소 입력●img src → 이미지 주소●style="max-width:100%; height:auto;" → 이것이 바로 반응형 역할을 ..
[HTML 기초] 하이퍼링크 태그 색상 변경하기 이번시간은 HTML 기초 시간이구요~간단한 기초 태그로, 하이퍼 링크의 색상을 바꾸는 시간을 알아보도록 할께요. 색생 변경하는 건 그렇게 어렵지 않구요^^아래의 간단한 태그로, 금방 바꿀 수 있어요 ㅎㅎㅎㅎ 일단, 본문안에 바로 쓸 수 있는 태그이므로,고정적으로 정해져 있는 파란색/보라색 이 꼴보기 싫다면, 반드시 써먹어 볼 필요가 있는 태그입니다^^ 보시면, 누르고 있는 동안의 하이퍼 링크 색상,한번 방문한 하이퍼링크 색상,방문하지 않은 처음의 하이퍼링크 색상 text = 글자색,link = 하이퍼링크 색상,alink = 클릭하는 동안 출력되는 색상,vlink = 클릭한 경력이 있는 색상, 이렇게 알고 계시면 됩니다용~! 이렇게 변하는 것이죠^^; 물론...
[HTML 기초] HTML 태그안에 주석처리 방법 홈페이지가 점점 기능이 많아지면, 당연히 그에 따른 코딩들도 많아지게 되고,그러면 뭐가 어디가 어딘지를 구별을 해 줄 필요가 있는데, 단순히 한줄 띄어쓰기로는 역부족이죠? 그래서, 일종의 HTML 태그 코딩 안에, 글씨로서 설명을 해 줄 필요가 있는데,마치 레고 블럭 안에 들어있는 조립 설명서 처럼 말이죠~! 그 설명 문구를 넣는 것을 주석 이라고 합니다. 티스토리에도 주석이 많이 들어가 있어요.지금 위에는 관리창으로 들어가서 스크린샷을 해온건데요, 보시면 아시겠지만, 주석은, 실제로 홈페이지에서 보이지 않습니다.단지, HTML 태그 코딩시에, 복잡하게 보이니까, 부분 부분별로 이렇게 이 코딩은 이러한 내용의 코딩이다~ 라는걸 알리는 거죠^^ 주석처리는 ..
[HTML 기초] iframe 및 유튜브 동영상 중앙정렬 태그 음...네이버 블로그에서는 중앙정렬이 잘 되는데...티스토리 에서는 중앙정렬이 안되더군요... 유튜브처럼 iframe을 사용하는 태그들은, 별도로 태그를 지정해 줘야 하는데,이번 포스팅은 그 방법을 알려드리도록 할께요^^ 우선, 원하는 동영상을 유튜브에서 찾으시고, 이제 찾으셨으면 소스까지 복사해 두셔야겠죠^^ 그리고, 여기 붙여넣기 하려면.... 오른쪽 상단에 HTML 이라고 표시된 곳에 V체크를 하시면,소스코드로 이루어진 화면으로 전환되죠. 이렇게 나오죠???자~ 그리고나서 그대로 유튜브 소스코드를 붙여넣으면....??? 이렇게 왼쪽으로 치우치게 되지요....이때는, 가운데정렬을 눌러도 안되요;;; 포스팅 쓰면서 상황을 그대로 스샷하면서 ..
[HTML 기초] HTML 태그를 이용한 웹페이지에 밑줄 넣기 오랫만에 HTML 포스팅을 하는군요~! 아...지금 정신이 없어요. 3D도 배우기 시작했고,요새 일러스트레이터에 조금 맛들려서..ㅎㅎㅎ 우선! HTML 태그를 이용하여 웹페이지의 아무곳이나 언더바 (밑줄)를 넣는 태그를 알아보도록 하지요.매우 쉬우므로, 그냥 보고 우선 따라하기 식으로 숙달하시면 될 것 같아요^^ 자, 메모패드를 오픈해 주시구요~!HTML 기본 태그는 전시간, 전전시간 계속 연이어 나왔던 부분이니까 잘 아시지요??? 이것이, 이번에 숙지를 해 둘 HTML 태그 이구요~! hr 태그에 대한 속성리스트 태그들 이므로, 잘 기억하시면 될 것 같아요.다시한번 말씀 드리지만, 그때 그때 HTML 태그들을 외우려 하지 마시고,필요할 때마..
이번시간은 웹상에서 줄바꿈은 어떤 태그를 써서 진행하는지 배우는 시간입니다. 완전 쉬우니까 그대로 무조건 따라하시면 될 것 같아요. 먼저 줄바꿈을 위한 태그는 무엇을 사용하는지 바로 알아봅시다. , , 이렇게 3가지 정도가 있습니다. 여기서 태그는 특이하게도, 끝맺음 해주지 않아요. 뭔소린고 하니, 이렇게 슬러시를 넣지 않아도 단독으로 쓰인다는 이야기입니다. 이제 스크린샷을 봐 가면서 하나하나 설명을 드리도록 할께요. 이렇게 메모패드를 여시고 이렇게 작성해 봤어요. 일단 태그와 태그를 비교를 해 볼께요. 이 두 개가 쓰임새가 가장 비슷합니다. 드래그 친 부분으로 비교해 보셔요. 똑깥이 도 3줄 넣어보고 도 3줄 넣어보고 해봅니다. 다른점은, 은 단독으로 쓰이면서 그 효력이 그대로 적용이 되고 는 백번을 ..
[HTML 기초] 테이블에서 셀 글씨정렬 및 하이퍼링크 만들기 안녕하세요~ 친절한효자손 이에요~! 지난시간에 이어서, 계속 HTML 테이블 태그에 관한 모든것을 차근차근 배우는 시간을 갖도록 하지요^^ 많이 하려고 하니까 어려운 것이에요~!하나씩! 하나씩만 해 나간다고 생각하시고, 한템포씩만 쉬엄쉬엄 배우는 자세가 필요할 것 같아요. 지난번에는, 셀 안쪽에 그림을 넣는 방법을 배웠죠?이번엔, 좀 더 나아가서, 그림도 물론 넣고, 글씨를 원하는 위치에 딱! 오도록 하는 테이블 태그를 알아볼께요^^ 자, 보시는 태그는, 테이블 안쪽에, 각 행에 적용이 되도록, 태그 안쪽에 명령어를 주는건데요,align 명령을 주게 되요^^ 얼라인은 해석하자면, 정렬 이라는 뜻이잖아요^^ align="방향" 해 주시면, 그 ..
[HTML 기초] 셀 안쪽에 그림 넣기 태그★블로거라면 반드시 알아야 할 기본태그 안녕하세요~ 이밤이 가기전에, HTML 태그 배운거 하나만 더 포스팅 하고 자려고요^^; 뭐....그냥 무의미하게 시간을 보내느니, 이렇게 하나라도 포스팅 해 놓는게 낫겠죠~!생산적인 시간을 보내야~! 자~ 저번시간에는, 표만든 셀을 합치고, 셀 키우는 그런 태그를 배웠죠?이번에는, 셀 안쪽에 그림이미지를 넣어보는 태그를 알아볼께요^^ 다함께 따라해 보도록 해 봐요~! 저번시간에 이어서, 바로 작업하신다면, 좀 더 편하게 진행하실 수 있을거에요. 모든 과목은 연관성이 있으므로, HTML 태그에 조금 관심이 있으시다면,처음부터 하나하나 따라해 보는 식으로 배워나가시면 좋을 것 같아요^^ 지금, 저기 드래그한 부분을 보시면, ..
[HTML 기초] 테이블 태그로 만든 표에서 셀 합치기 및 셀 크기변환 안녕하세요~ 친절한효자손 이에요~! 저번시간에 HTML 문서에서 표를 넣는 방법을 알아봤죠?이번엔, 그 표를 응용하여 셀을 합치는 방법을 알아보도록 할께요^^ 잠깐 저번시간의 태그를 복습을 하자면,테이블 태그가 곧, 표를 넣는 태그라고 배웠지요? 이것으로 시작을 하게 되요. 우선, 테이블 태그는 전시간과 똑같으며, 안쪽에 보시면, clospan="3" 라고 하는 태그가 보이시나요??? 네~ 저 태그가 바로, 합치기 명령어 중 가로에 해당하는 명령어구요,이제 오른쪽으로 쭉~ 들어올 가로 셀 중에서 나를 포함하여 3칸을 합쳐라! 라는 뜻이에요. 그리고, 그 밑에 있는 rowspan="2" 라는 명령어 보이시죠??이건 세로로 2칸을 합쳐라..
[HTML 기초] 웹페이지에 테이블 태그로 표만들기 안녕하세요, 친절한효자손 이에요~ 오늘은 HTML 태그를 써서, 간단한 표를 만들어 보는 시간을 가졌어요^^까먹기 전에 얼른 포스팅을 해 놓도록 할께요~! 물론 웹에디터 처럼 고급 프로그램으로 한번에 다 할수 있지만,그래도 기본은 정말 중요하기에~ 그래서 저도 배우는 것이구요^^ 분명 잘 익혀두면, 언젠간 유익하게 사용할 날이 올거에요~ 이번에 배운 HTML 수업에서는, 표를 넣어보는 방법을 배우는데요~표를 HTML에 넣기 위해서는 태그를 사용해요. 벌써 HTML 포스팅 세번째 인데, 전혀 HTML에 대해 모르고 계신다면,처음부터 찬찬히 읽어 보시면, 아마 이해가 되실 꺼에요^^; 위에서 예제로 들어놓은 방법에서는, 기본 태그가 들어가고, 그 안에, 그..
[HTML 기초] 기초 태그를 이용해 웹페이지 색상변경 및 글씨꾸미기 안녕하세요~ 친절한효자손 이에요~!! 저번시간에 이어서, HTML의 기본에 대한 포스팅을 할께요~! 근데, 지난번 거 포스팅 제가 읽어봤는데...너무 말만 길게 쓰고 있는것 같아서,이제부터는 딱! 핵심만 간단히 쓰도록 노력할께요~ 잘 되려는지는 모르겠지만, 어쨌든~! 군더더기를 화악~ 줄이고 쓰기 때문에 다소 딱딱한 설명이 될 수는 있겠지만,한눈에 들어오긴 할꺼에요. 저번 포스팅때는, 이미지 넣는 태그라던지,글씨를 넣는 방법에 대해 간략히 알아보았어요. 저번시간 이어서~그 응용편~! 이번에는 웹브라우저의 백그라운드(배경) 색상 넣기, 그리고글씨를 좀 더 꾸미는 태그를 알아볼께요. 보시는 것처럼, 태그는 라는 태그가 들어가게 되구요~ b..
[HTML 기초] 간단하게 HTML의 기본개념 이해하기 안녕하세요~ 친절한효자손 이에요~! 이곳은, HTML의 기초 지식을 습득하게 될 공간이에요^^지금 이 포스팅을 쓰는 저도 HTML에 대해 전혀~모르고 있는 상태에요. ...엥? 근데 뭘 알려준다는거지??? 저번에, 포토샵 처음 포스팅때도 그랬듯~!제가 하나하나 배우는 과정을 낱낱히 포스팅을 할 것이기 때문에, 아마 장담컨데! 제가 모든 과정을 수료후에는 이 포스팅이 완전 완성도가 올라가 있을 것이며,아무나, 제 포스팅대로만 꾸준히 습득을 하신다면! 저랑 아니~ 저보다 더 잘하실 수도 있을거에요^^ html 을 다루는데 별도의 특출난 프로그램이 있는것이 아니오라,메모장이나, 노트패드 같은 프로그램만 있으면 웹페이지를 만들 수 있고, 편집도 가능해요^^..