전체 글 880

HTML5 강좌 3강 - HTML5 레이아웃 잡아보기

HTML5 강좌 3강 - HTML5 레이아웃 잡아보기 지난 강좌에 이어 이번강좌에서는 HTML5를 이용하여 기본적인 레이아웃을 잡아보도록 하겠습니다.레이아웃을 잡아 페이지를 만들다 보니 css 요소가 무지 많이 들어갑니다. 위 붉은색 부분이 바로 css 요소입니다.css는 웹문서의 스타일을 잡아주는.. 그러니까 좀 더 깔끔하고 멋진 페이지로 만들어 주는것 입니다.소스코드를 받아보면 깜짝 놀랄수도 있습니다.하지만 걱정하실 필요 없습니다.css.. 스타일시트는 차근차근 알아가면 됩니다.중간중간 css 관련 요소가 강좌 내용에 나올겁니다.그리고 부족한 부분은 따로 강좌 내용에 넣도록 하겠습니다. 이렇게 레이아웃을 만들어 보았습니다.이왕 이렇게 레이아웃을 만들었으니 태그를 연습하면서 메뉴들을 하나씩 채워보도록 ..

HTML5 강좌 2강 - HTML5 시맨틱웹을 위한 구성요소

HTML5 강좌 2강 - HTML5 시맨틱웹을 위한 구성요소 지난 강좌에 이어 이번강좌에서는 시맨틱웹을 위한 HTML5 새로 추가된 태그에 대해 공부하겠습니다.지난 강좌에 시맨틱웹 태그에 대해 잠깐 언급했는데요.복습하는겸 정리를 하자면 다음과 같습니다. *시맨틱웹을 위한 태그머리말을 나타내는 태그제목과 부제목을 묶는 태그메뉴 부분을 나타내는 태그개별 콘텐츠를 나타내는 태그제목별로 나눌 수 있는 태그좌우측의 사이드바를 나타내는 태그제작자의 정보나 저작권의 정보를 나타내는 태그 위의 내용이 왜 시맨틱웹을 위한 태그일까요?예를 들면 우리는 지난 HTML에서 코딩을 할 경우 다음과 같이 했습니다. 헤더에 들어갈 내용 헤더 부분의 영역을 div라는 박스에 묶어서 사용을 했죠.하지만 시맨틱웹에서는 태그 자체의 의미..

HTML5 강좌 1강 - HTML5 개념 및 기본구조

HTML5 강좌 1강 - HTML5 개념 및 기본구조 지난 강좌에서 HTML 태그에 대해 공부하고 연습을 했습니다.이번 강좌에서는 HTML5에 대해 알아보도록 하죠.이번 강좌 역시 기본적인 개념은 간단히 이해하고, 예제를 테스트 해보면서 HTML5를 공부하도록 하겠습니다. 참고로 이 강좌는 능숙한 개발자들을 위한 강좌가 아닙니다.지극히 웹에 대해 초보적이고 이제 입문하는 분들을 위한 강좌입니다. 먼저 HTML5가 무엇인지, 왜 HTML5를 사용하는지 알아보겠습니다. *HTML5란 무엇인가?HTML5란 웹 문서를 제작하는 데 쓰이는 기본 프로그래밍 언어 HTML(hypertext markup language)의 최신규격 입니다.HTML5를 사용하면 별도 프로그램을 깔지 않아도 인터넷 브라우저상에서 화려한 ..

꽃보다청춘-아이슬란드 3회 배경음악

꽃보다청춘-아이슬란드 3회 배경음악 '꽃보다청춘-아이슬란드' 3회를 보면서 나의 취향을 저격한 BGM !아이슬란드의 거대한 자연, 그리고 아름다운 마을과 잘 어울리는 곡이 있어 몇곡 찾아보았다. 3회 배경음악 Great big storm - Nate Ruess 어쩌면 좋아 - 우주히피 Brot - Svavar Knutur Nyfallio regn - Asgeir Zeitgeist - The Koxx Torrent - Asgeir 스물 그리고 서른 - 이승열 Propose (Feat. 회장님) - 임직원일동 King and cross - Asgeir 동경 - 언니네이발관 Staralfur - Sigur Ros 나의 사랑 수정 - 조정석 (뮤지컬 내 마음의 풍경 OST) King And Lionheart -..

티븨이야기 2016.02.11

K팝스타5 배틀 오디션 첫번째!

K팝스타5 배틀 오디션 첫번째! 캐스팅 오디션이 모두 끝나고 이제 배틀오디션이 시작되었다. 배틀오디션에서 살아남아야 생방송 무대인 Top10 으로 갈 수 있다. 쟁쟁한 실력자들이 서로의 실력을 경쟁하는 경연! 각 조별로 1위는 Top10에 직행을 하고, 2위는 재대결을 해야한다. 그리고 3위는 바로 탈락이다. 먼저 1조! JYP : 채지혜 YG : 마진가S 안테나 : 정진우 1조에서는 마진가S 팀이 1위로 Top10에 올라갔다. 마진가S 팀은 점점 더 멋진 호흡으로 정말 엄청나게 매력적인 무대를 만들고 있다. 마진가S 팀이 부른 곡은 '난괜찮아 - 진주' 동영상 보러가기 2위는 정진우 군 '그럼돼 - 자작곡' 동영상 보러가기 그리고 2조의 경연이 이어졌다. JYP : 박민지 YG : 김채란 안테나 : 이..

꽃보다청춘-아이슬란드 1회~2회 배경음악

꽃보다청춘-아이슬란드 1회~2회 배경음악 요즘 '꽃보다청춘-아이슬란드' 편을 보면서 여행가고싶은 마음이 굴뚝 같다.정말 엄청나게 멋진 아이슬란드를 보면서 대자연의 신비로움에 놀라기도 하고, 감동도 받았다.그런데 이번 꽃보다청춘은 영상도 멋있지만 배경음악을 정말 멋있는 음악들로 선곡을 했다.그래서 멋진 배경음악들을 정리해서 포스팅을 하고 싶어졌다.단지 개인적인 취향으로 몇 곡을 골라 보았다. 1회 In the silence - Asgeir Ekki Vanmeta - Pascal pinon 2회 Six week - Of monsters and men Hey Angel - One Direction Look at the light - Sin Fang Falling - Ben Kweller (사진출처 : tvN ..

티븨이야기 2016.02.10

황치열 중국판 나가수 - 뱅뱅뱅!

황치열 중국판 나가수 - 뱅뱅뱅! 가수 황치열님이 중국판 '나는 가수다 시즌4(我是歌手4)'에서 1위를 차지했네요~ (사진출처 - 후난위성TV 방송 캡처) 황치열님은 지난 5일 저녁 10시(현지시간)에 방송된 我是歌手4에서 다른 가수들을 제치고 당당히 1위 등극 :)황치열님이 부른 곡은 '뱅뱅뱅 - 빅뱅' 황치열님은 이미 여러 TV프로에서 가창력을 인정받고 활동중인데요~이번에 중국판 나가수에 도전하면서 본인의 실력을 다시한번 확인하고 있습니다.덕분에 주가도 엄청 상승하고 있어요~지난 我是歌手4 방송에서 화이트 턱시도를 입고 제임스본드를 연상케 하는 퍼포먼스를 선보였는데요~잘생긴 외모와 군더더기 없이 깔끔한 몸매, 그리고 180cm의 키, 거기에 화이트 턱시도까지 입어 무대를 더욱 화려하게 만들었습니다. ..

티븨이야기 2016.02.06

HTML 강좌 16강 - HTML 태그 익히기#15 - object

HTML 강좌 16강 - HTML 태그 익히기#15 - object 이번 강좌에서는 object 태그에 대해 알아보도록 하겠습니다.object 태그를 사용해 미디어 영상 파일이나 플래시 파일을 재생할 수 있습니다.영상을 삽입하는 방법은 embed 태그 형식이 더 간단합니다.하지만 embed 태그 형식은 사용자의 컴퓨터에 미디어를 재생할 수 있는 플레이어가 없으면 재생이 되질 않습니다.반면에 object 태그는 ActiveX 기반이므로 사용자의 컴퓨터에 플레이어가 없어도 재생이 가능합니다.하지만 ActiveX가 지원되는 브라우저에서만 가능하죠. 간단하게 사용법을 보도록 하겠습니다. Object 태그 속성- id : 객체의 아이디(ID) - 개발자가 임의로 지정합니다.- classid : 윈도우 레지스트리나..

HTML 강좌 15강 - HTML 태그 익히기#14 - marquee

HTML 강좌 15강 - HTML 태그 익히기#14 - marquee 이번 강좌에서는 marquee 태그에 대해 알아보도록 하죠.이 태그는 이런 저런 사이트들을 돌아다니다 보면 가끔씩 볼 수 있는데요.좌에서 우로, 혹은 우에서 좌로 움직이는 텍스트를 표현하는 태그입니다.스크롤 기능이 있는 텍스트라고 합니다. 사용법은 간단합니다.시작태그와 종료태그 사이에 원하는 텍스트를 입력하면 끝!하지만 좌/우 스크롤 방향을 옵션으로 설정해 주어야겠죠~오른쪽으로 흐르는 텍스트왼쪽으로 흐르는 텍스트direction 속성값을 설정해 주면 되겠네요~ 이렇게 코딩을 하고 테스트를 해보도록 하겠습니다. 설정한 값대로 아주 잘 움직이는군요~ 그리고 marquee는 behavior 라는 속성도 가지고 있습니다behavior는 어떤 ..

HTML 강좌 14강 - HTML 태그 익히기#13 - form #2

HTML 강좌 14강 - HTML 태그 익히기#13 - form #2 지난 강좌에 이어 추가적으로 form 태그에서 사용하는 입력양식에 대해 알아보겠습니다.이번 강좌에서 나오는 입력양식 역시 자주 사용하는 태그들 입니다.역시 form 태그 사이에 들어가야 합니다.(1)password(2)textarea(3)select(4)file(5)hidden(6)reset button이러한 것들이 있는데, 예제를 보고 설명하도록 하죠. 그림을 보면서 하나씩 살펴볼까요~(1) password 태그는 말그대로 비밀번호 양식입니다.text 태그와 달리 내용을 입력해도 내용이 보이지 않고 비밀번호 형식으로 *** 처리됩니다.(2) textarea 태그는 장문을 입력할 수 있는 텍스트박스 입니다.우리가 흔히 메세지나 메일같은..