만들기 HTML 연습편 크론코딩 유튜브 따라하고

 유튜브 웹페이지 구성에 맞게 작성

일단 따라하는중! 이 글은 드림코딩 by 엘린씨의 유튜브 영상을 보면서 만들었던 과정을 남기는 것입니다.저와 비슷한 수준이라면 영상을 보고 따라해보세요!

구조파악과이어프레임을먼저만들자강의를보면,스스로페이지의박스를구별해보게될텐데요,여러분도한번해보시겠어요?다음 사진을 보고 구조를 어떻게 하면 좋을지 큰 박스로 나누어 주세요!

왼쪽은 윈도우 크기가 작을 때, 오른쪽은 일정 크기를 넘어서 화면 구조가 바뀐 모습입니다.여러분은 어떻게 나누셨나요? 우선 큰 상자부터 나눈 것은 다음과 같습니다.
머리말, 비디오 플레이어, 비디오 인포, Upst로 먼저 크게 나누었습니다헤더에는 로고와 유튜브 제목, 아이콘이 들어가고

비디오 플레이어

해시태그, 영상 제목, 영상 게시일, 조회 수가 들어가는 곳이면 좋겠어요. 등 5개의 버튼으로 된 액션 버튼 자리, 영상 게시자 정보와 구독 버튼이 들어가는 곳. 전부 세 개의 박스로 된 비디오 인포.

그리고 다음으로 영상의 이미지, 영상정보, 버튼이 들어가는 Up Next로 나누었습니다.

나눌줄은 알고 태그도 몇개 알고있지만 혼자서 해보니까 막막하더라구요!!그래서 저는 그냥 한 번 듣고 두 번째로 들으면서 멈추고 따라하면서 연습을 했어요. ●「함부로 흉내내!

header에는 로고 아이콘과 제목을 하나의 div안에 넣고 다른 하나의 div안에 2개의 아이콘을 넣었습니다.
비디오 플레이어에는 비디오 플레이어를 넣고, Controls 옵션을 설치했습니다.
비디오 인포메이션은 아까도 이야기한 바와 같이, 3개의 작은 박스로 나누어져 있습니다. 메타데이터, 액션, 채널
업 넥스트에는 다음 재생 영상 3개를 보여줬는데요막상 개발한다면 동적으로 움직이고 다 가져오면... 이렇게 할 일이 별로 없다고 하네요!

그래서 저의 결과는 다음과 같습니다

짠! 비디오 재생도 되고 하니까 되게 신기하네요.이제 CSS를 통해서 작성해야 하지만, 아직 공부중이라 진도는 여기서 멈추겠습니다. ^-^

제 댓글에 댓글 남겨주신 분 블로그에 갔는데 좋은 댓글들이 엄청 많더라고요!아이들은 아침에 눈을 뜨면 오늘도 좋은 일이 생긴다는 믿음으로 즐거운 하루를 시작할 수 있다고 합니다.

저는 잠에서 깨어나 정신을 차릴 때까지는 대단한 피로감을 느낍니다만, 조금만 움직이면 하루가 시작되는 것을 느낍니다.좋지도 나쁘지도 피곤하지만 당연히 일어나서 움직이는 사람과 같은 평범한 아침입니다.

죽음이란 무엇인가의 저자 셜리 케이건은 아침에 일어나 이런 말을 자주 한답니다.

좋은 아침입니다. 살아 있는 것만으로 행복한 날이라고!

이 블로그의 인기 게시물

【고갈비】 트레이더스 국산 자반 고등어로

이미지
 와 고등어 산지 몇 년 전이지?비린내도 싫어하고, 먹을 수 있는 크기는 노르웨이 고등어가 대부분으로, 국산 고등어라고 하는 것은 너무 작고.여러가지 이유로 고등어는 안사게 되네요~ 그런데 이마트 트레이더스 고등어의 평가가 너무 좋고 가격도 너무 저렴해서 용기내서 구입했습니다! 성공한 쇼핑 ^^ http://traders.ssg.com/item/itemView.ssg?itemId=1000017291584&siteNo=6002&salestrNo=2154 를 클릭하여 링크를 확인하세요. traders.ssg.com 쿠폰 포함 10,764원에 구입한 국내산 자반고등어입니다.매장에서 구입하시면 4마리 11,960원입니다~ 이렇게 크고 단단하며 단단한 고등어가 이 가격이면 아주 저렴하다고 생각합니다. ^^눈알이 완전히 투명하거나 흰색은 아니지만 신선도에는 문제가 없을것 같네요?? 배송받고 냉장고에 바로 들어가고 그다음날 꺼낸 고등어인데..하루 지난 상태가 이 정도면 무난할 것 같아요~ 다른 슈퍼에서 파는 고등어보다 신선할 것 같아요. 맨 밑에 고등어는 피가 빨갛게 보여서 킁킁거리며 냄새를 맡았는데 보기와는 달리 신선했어요.고등어가 맞는지 의심할 정도로 비린내가 안 나요.(고등어를 만진 손에서는 비린내가 많이 났다구요;;;) 일단! 사이즈가 커서 너무 좋았어요 ♡ 이렇게 불그스름해서 걱정했는데 까니까 파릇파릇하더라고요! 고등어의 살이 붉은 줄은 알았지만.. 일단 싸게 구입했기 때문에 의심스러웠습니다.어디 아픈데 없나 샅샅이 살피고 냄새 맡아보기를 몇 번 반복했습니다. (웃음) 머리속은 피가 고여서 상태가 안좋아보였는데.. 끙끙대니까 상태는.. 완전 잘하던데요...내 동공이 안좋은가;;; 받자마자 먹을 것도 아니고 랩에 싼 채 하루 방치했는데 이 정도면 굉장히 만족스러웠어요.고등어는 맛이 변하기 시작하면 살과 뼈가 분리되기 시작하죠?그런게 전혀 없어서 건강했기에 걱정되었던 고등어에서 머리를 잘라내고 꼬리를 잘라 갈비만들기를 했습니다~ 두 마리는 머리를...
자세한 내용 보기

일일연속극 '재희, 구여친을 찾아왔다' 윤아정, '밥이 되어라

이미지
 7화에서 경수는 영신이 담임선생님 김종호 대화 중 영신 '김시하'를 만나기 전까지 하고 특별히 하고 싶은 일이 없어서 그렇게 군대 갔다 와서 할머니 하고 있는 식당을 그대로 이어받았거든요. 요즘은 영신이 들어와서 웃을 줄 알고 의욕이 생겼다고 합니다. 경수는 영신을 가족들을 생각해서 고아원에 보내지 않기로 결정했어요. 이웃들의 경수로 결정을 축하해 줬고 우리도 도움이 되는 일이 있으면 돕겠다. [일일드라마 '밥 돼 거지'] 경수 식당에 구 여친 [윤아정] 왔어요. 그동안 잘 지냈냐고 물었습니다. 경수가 군대가기 전에 좋아했던 여자친구! 구 여자친구 심리학과 대학생으로 경수에 대한 미련이 있어서 찾아온 것 같아요. 경수는 여자친구에게 질문을 던지며 대학생활은 어때?사귀는 사람이 있어서 아정 몇 명 사귀어 봤는데 잘 안 되더라.영신이 보면서 조카야! 여자분은 경수가 같이 있는 애랑 왜 같이 사는지 의문점 물어봤어요 영신이는 친구 이다정 [이소윤] 경수의 독신남에게 여자가 와서 어떻게 해야할지 이야기하고 이다정 비상사태 다경수 형이 그 여자 결혼하게 되면 네가 다시 고아원에 가지 않을까 걱정하고 있었습니다. 구 여친의 윤아정경수를 만나면 다시 만나러 오고 나 서울 생활 피곤해서 서울 아무 문제 없어도 미련이 남아 찾아온 것 같아요. [재희] 난 너를 만나러 대학에 갔다. [미리 연락을 하고 와야겠다]그녀는 경수에게 스파게티를 주려고 슈퍼에 들렀고 경수는 동네가 너무 좁아서 아는 사람을 만나 어떻게 할까 생각했어요. [동네 사람들 그 여자분을 처음 보면 경수가 다른 데 살 곳이 있을 때 아는 사람인 줄 알아요] 스파게티를 같이 먹을 때 여자친구 출신인 경수씨랑 제가 같이 있을 때 해맑게 웃지는 않았는데 영신이가 대하는 모습이 조금 낯설게 느껴졌어요. 1월 20일 방송분 제8회 궁전 사람들 순정 '김혜옥'은 늦은 나이에 임신해서 민경 '최수린'에게 셋집을 구하고 있으면 언제 가! 민경이는 가족들이 모인 자리에서...
자세한 내용 보기

성산아트홀 2021 생상 오페라. 삼손과

이미지
 일시 : 12월 7일(화) 오전 10시 30분(약 60분 예정) 장소 : 창원 성산아트홀 소극장(성산구 중앙대로 181) 연사 : 아나운서 이윤상(경남CBS) 강연 내용 : 오페라 삼성과 데릴라 작품 해설 및 주요 아리아 감상. 성산아트홀에서 문자가 왔어요 아니면 이런 맛보기 강연이 있는 줄도 몰랐을 겁니다. 갑자기 관심이 생겨서 메일을 받자마자 예약을 했습니다. 선착순 284명 무료였어요. 내가 간과한 것은 ㅎ이날은 평일 오전이었던 일. 그러다 보니 관객이 40명도 안 돼 큰 걱정 없이 입장했다고 한다.^^ 생상스의 오페라 삼손과 데릴라 연주는 2021년 12월 1718일. 금요일 19:30 / 토요일 15:00 창원 성산아트홀 대극장입니다. 카미유 생상스 Camille Saint-Saens (1835~1921) 상=상스는 20편이 넘는 오페라를 작곡했지만, 지금까지 연주되고 있는 오페라는 "삼손과 데릴라"뿐인 것 같습니다. 대표적인 작품으로는 '동물 사육제'첼로 협주곡 죽음의 무도 교향곡 제3번 등이 알려져 있습니다. 멋지고 예쁜 목소리의 이윤상 아나운서의 소개로 정시에 시작했는데요 생각한 내용의 프리뷰는 아니었지만, 그래도 오페라를 보기 전에 조금이라도 생각하고 내용을 찾을 수 있는 계기를 만들어 준 것으로 만족합니다. 소극장에는 노인들이 대부분이었어요. 처음에는 조금 아쉬웠어요 이왕이면 많은 사람들이 같이 들어주길 원했거든요. 음...전반적인 해설부분에서는 조금... 미흡하지 않았나 싶기도 하고 영상은 고장나서 조금 아쉬웠지만 집에 돌아가서 주요 아리아를 다시 감상할 수 있었어요. 오페라에서나 뭐든 음악은 아는 만큼 들리잖아요. 창원에서 열리는 삼성과 데릴라를 보러 가실 분이라면 꼭 한번 들어보시기 바랍니다.^^ 저도 아직 시간을 조정해야 하기 때문에 구입 전이지만 매진될 것 같았던 표는 아직 있는 것 같습니다.^^ 이번 연주를 맡은 디오 오케스트라는 해외 유학 출신과 젊고 경험이 풍부한 역량있는 연주자들로 구성된 국내...
자세한 내용 보기