생활코딩

Coding Everybody

코스 전체목록

닫기

HTML 이론

 HTML의 기본문법

 ex_html1.html

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
  </head>
  <body>
    안녕하세요. <strong>생활코딩</strong>입니다.
  </body>
</html>

 HTML 문법 - 속성

ex_html2.html 

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
  </head>
  <body>
    안녕하세요. <a href="http://opentutorials.org/course/1" target="_blank">생활코딩</a>입니다.
  </body>
</html>

HTML 문법 - 태그의 중첩

ex_html3.html 

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
  </head>
  <body>
    <ol>
      <li>html</li>
      <li>css</li>
      <li>JavaScript</li>
    </ol>
    <ul>
      <li>최진혁</li>
      <li>최유빈</li>
      <li>한이람</li>
    </ul>
  </body>
</html>

HTML 정리

소스코드

댓글

댓글 본문
작성자
비밀번호
  1. 90ano
    하루에 한 강의 라도 열심히 20170115 완료.
  2. 임정훈
    잘 봤습니다 !!
  3. Jin Ah Lee
    MAC(맥) 쓰시는 분 들 중에
    링크 깨지는 분들 (링크를 클릭하면 Opentutorials 홈페이지 나오는 대신 주소창에 이렇게 http://localhost......e/1), 아랫분이 알려주신 것처럼 따옴표 모양 - 이텔릭처럼 휜 게 아닌, 직선으로 된 - 바꿔주시면 안 깨지고 잘 나옵니다!

    두번째 비디오 링크걸기 부터는 '스마트 따옴표 체크박스 해제' 하는 건 안 되고, 체크박스 놔 둔채로 따옴표 모양만 바꿔야 가능하더라고요!
  4. 울랄라부라더스
    잘 들었습니다.
  5. 토코나스
    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="utf-8" />
    </head>
    <body>
    인구 수가 가장 많은 나라
    <ol>
    <li>중국</li>
    <li>인도</li>
    <li>미국</li>
    </ol>


    커뮤니티 사이트 모음
    <ul>
    <a href="http://inven.co.kr/" target="_blank"> <li> <strong>인</strong>벤 </li> </a>
    <a href="https://twitter.com/" target="_blank"> <li>트<strong>위</strong>터 </li> </a>
    <a href="http://www.dcinside.com/" target="_blank"> <li>갤러<strong>리</strong> </li> </a>
    </ul>
    </body>
    </html>



    이번 강좌에 나온 태그들을 활용해 직접 만들어 봤습니다.
  6. macbookrgh55
    2017-01-03
    9:17 am 잘봤네요. 참길었습니다....
  7. DEP H
    맥에서 따옴표 문제를 어떻게 해결해야 하나 헤매고 있었는데 감사합니다:-)
    대화보기
    • 김상환
      친절한 강의 매번 감사합니다.
    • Student-Y
      2016.12.30 잘들었습니다
    • 쌘진
      2016-12-30 완료
    • 추라이
      161229 완료!!
    • 김남경
      2016/12/23
    • 수호아빠
      161222 완료
    • 정승현
      맥 쓰시는 분들 편집기로 Brackets 한번 써보세요
      생각보다 괜찮은거 같아요
      하이퍼링크 오류나 한글 깨짐도 없고
    • Donghee Lee
      161218 완료
    • 완료
    • 161216 23:30 완료
    • 좋은 강의 감사합니다.
    • 161210
    • 김지훈
      제 데스크톱 하나로 만든 서버를 다른 노트북(다른 브라우저)에서 접속하면 안되는 이유가 뭔가요?
      bitnamis가 설치된 컴퓨터만 위의 활동이 적용되는 것인가요?
    • 그런데 위의 태그의중첩 영상 초반에 <ul>,<ol> 없이 <li>로만 했을때에도 기호가 나오던데요..?
      대화보기
      • < ul> ,<ol> 하의 태그로 <li>를 사용합니다.
        대화보기
        • ksj321321@naver.com
          <li> 내용은 표기되는데 왜 기호는 안나올까요..? 그런데 또 <ul> 그룹을 묶어주면 <li> 정상으로 표시되구요..왜그럴까요???
        • Yonjung Ji
          완료! 차근차근 잘 알려주시는 걸로는 최강이지않나 싶습니다.
        • 쿠티뉴
          16.11.29 완
        • harris
          2016.11.29 22.53 완료
        • 문성은
          16.11.29 완료
        • 덜렁이
          <table>
          <tr>1.html</tr> <tr>2.css</tr> <tr>3.javascript</tr>
          </table>
          을 <body></body>사이에 넣으면 됩니다.
          요새는 <div></div>를 많이 씁니다.
          대화보기
          • 카별
            해결되었습니다! 아파치가 꺼져있었네요.
          • 카별
            <에러가 뜹니다>
            사이트에 연결할 수 없음

            localhost에서 연결을 거부했습니다.
            Google에서 localhost hello world 검색
            ERR_CONNECTION_REFUSED

            잘 되다가 노트북을 옮겨서 다른 장소에서 hellowolrd.html을 작동시키니 이런 글이 뜹니다. 왜일까요?
            제 이메일로 답변을 보내주시면 감사하겠습니다.
          • 이호준
            2016.11.19
          • 박정한
            완료
          • 민지민디
            2016.11.13여기까지
          • Bogwang Jung
            11.5 완료!
          • 당당비
            목소리 넘나 좋으세요!
            완료!
          • 배둘
            16.11.01 완료
          • 강연지
            16.10.31
          • 약 10여년 전에 나모 웹 에디터 라는 프로그램을 이용해서 처음 접하게 된 html인데, 이렇게 head body 같은 기본적인 것들을 모르는 상태에서 홈페이지를 만들던 기억이 새록새록 떠오르네요. 잘 보고 갑니다^^
          • 활화산
            맥을 짚어서 알려 주시네요. 감사합니다
          • 정말 감사합니다.
          • 데브시
            20161017 - 너무 쉽고 재밌고 조곤조곤 설명해주시는게 너무 좋네요~!
            이 수업을 알게되서 참 다행이라고 생각합니다
          • Ino Jeong
            MAC OS의 텍스트편집기를 사용해 HTML을 작성하는 경우
            "기호를 제대로 인식하지 못해 작동이 정상적으로 되지 않는 경우가 있습니다.

            이럴때는 시스템 환경설정 -> 키보드 -> 텍스트 -> 스마트 인용 및 대시 인용
            여기에서 큰 따옴표 부분이 살짝 다른모양의 큰따옴표로 바뀌어 있는 것을 확인할 수 있습니다.
            이부분을 정상적인 큰 따옴표로 변경하거나 체크 해제해주시고, 재작업하면 정상적으로 돌아갑니다.
          • 김용운
            16.10.13 완료
          • 권은중
            잘봤습니다
          • 안재우
            2016.10.12. 완.료.
          • 안재우
            2016.10.12. 완.료.
          • bluegun
            161011 수강완료. 감사합니다
          • Kun-Woo Lee
            2016.10.11 완료!
          • veritas3264
            2016.10.11 감사합니다.
          • Mrdawn
            161010 수강완료
          버전 관리
          egoing
          현재 버전
          선택 버전
          graphittie 자세히 보기