HTML 강좌 #07 HTML에서 CSS를 불러오기 & class와 id의 차이점

어제 업로드한 HTML강좌 #06에서는 브라우저 사이즈에 맞게 반응하는 텍스트 예제를 보여드렸는데요 newstroyblog.tistory.com/46?category=874865 HTML 강좌#06 브라우저 사이즈에 맞게 글자크기가 변하는 반응형 텍스트 만들기 최근에는 대부분의 사이트가 반응형 페이지로 이루어지고 있는 추세입니다 반응형 웹이라고 하면 제작한 웹사이트를 PC, 스마트폰, 태블릿 등 접속하는 기기의 종류에 따라서 화면의 사이즈가 � newstroyblog.tistory.com 게시물에 나와있는 사용방법을 보시면 두 가지의 방법이 있습니다 첫 번째로 html내에서 p태그 내에 스타일을 주어 폰트 사이즈를 지정해주었지요 그리고 두 번째 div요소를 생성 후에 css에서 스타일을 적용시켜주었습니다..

• format_list_bulleted 프로그래밍/HTML, PHP, CSS
• · 2020. 9. 7.
• textsms

HTML 강좌#06 브라우저 사이즈에 맞게 글자크기가 변하는 반응형 텍스트 만들기

최근에는 대부분의 사이트가 반응형 페이지로 이루어지고 있는 추세입니다 반응형 웹이라고 하면 제작한 웹사이트를 PC, 스마트폰, 태블릿 등 접속하는 기기의 종류에 따라서 화면의 사이즈가 자동으로 변하도록 제작된 웹 페이지를 말합니다 몇 년 전까지만 해도 부분의 웹페이지는 pc에서만 접속하거나 작동하였지만 요즘에는 스마트폰을 이용하여 모바일에서도 접속하는 경우가 많습니다 하지만 pc용으로 설계된 웹페이지의 경우 모바일 화면에서 보면 화면의 구조가 이상하거나 또 화면을 확대해서 이곳저곳 움직여야 하고 이용자에게 있어선 엄청 불편하겠죠? 오늘은 반응형 웹페이지를 제작 시에 텍스트 부분 pc화면으로 볼 때 텍스트를 넣은 후에 글자크기가 고정이 아니라 브라우저 크기에 따라서 줄어들게 한번 제작해볼 겁니다 아래의 적..

• format_list_bulleted 프로그래밍/HTML, PHP, CSS
• · 2020. 9. 6.
• textsms

HTML 강좌 #05 HTML 주석 사용방법 에디터별 주석의 차이

반갑습니다~글을 작성하다보니 어느덧 5강까지 왔네요이전 강좌들은 HTML을 배우는데 많은 도움이 되셨나요??4강 게시물을 아직 읽지 못하고 오신분들은 아래 링크를 클릭하여 게시물을 읽은후 5강을 들으면공부에 도움이 될겁니다! 4강 링크를 클릭하세요! 이번 5강에서는 HTML에서 주석을 다는 방법에대해서 알려드리려고 합니다 주석이란?소스코드의 양이 많아진다면 매번 어느부분인지 확인하기가 어렵습니다 그렇기 때문에 HTML프로그래밍을 하는 과정에서 각 행별 어떤 소스 코드인지 이해하기 쉽게 정리하는데 사용이 됩니다 주석은 HTML뿐만아니라 css에도 있으며 C언어나 vb.net ,c#에도 존재합니다 하지만 프로그래밍 언어에따라서 약간씩 주석을 넣는 방법도 다릅니다 그럼 HTML에서는 주석을 어떻게 넣을까요??..

• format_list_bulleted 프로그래밍/HTML, PHP, CSS
• · 2020. 8. 15.
• textsms

HTML 강좌 #04 자주 사용되는 텍스트 서식 | 굵기,밑줄,강조 등

안녕하세요 지난 포스팅에서는 HTML에서 사용하는 태그에대해서 조금 집중적으로 알아봤습니다! 이전 강좌를 보지 못하신분들은 아래 링크를 클릭하여 본후 현재 강좌를보시면 도움이 됩니다 https://newstroyblog.tistory.com/4 이번 강좌에서는 HTML에서 자주 사용되는 텍스트 서식태그에 관해서 알려드리려고 합니다 HTML에는 많은 텍스트 서식태그들이 있지만 솔직히 말해서 다 알고있진 못합니다 그래서 이번 게시물에서는 제 경험을 바탕으로 나름 이건 알고있어야 한다 이건 자주쓰인다 싶은것들을 모아 알려드립니다 제가 이렇게 쓴다고해서 무조건 이게 정답은 아니니 공부하면서 정보가 더 필요하면 원하는 내용을 검색하는 습관을 들이면 좋을거 같습니다 이미지가 작을경우 이미지를 클릭하여 보시면 큰 이..

• format_list_bulleted 프로그래밍/HTML, PHP, CSS
• · 2020. 8. 11.
• textsms

HTML에서 head는 뭘까?

HTML코드를 작성할때 body태그는 브라우저상에서 내용이 표시되는 곳이라고 알고있는데 그렇다면 그위에 작성하는 head태그는 뭘까요?? 우선 아래 코드를 확인해주세요 123456789101112131415 My site page My Title cs 태그안에서 태그를 사용한후 그안에 이런 내용이 있습니다 이 내용에 대해서 설명해드리자면 html파일의 인코딩을 알려주는 태그입니다 인코딩을 알려주지 않을경우 웹브라우저 설정에따라서 자동으로 인코딩을 처리해주는데 처리가 정확한경우도 있지만 그렇지 않은경우도 있습니다 그렇기때문에 한글이 깨지지 않게하기 위해서 위 태그는 꼭 적어주는게 좋습니다 그 이후에 작성된 My site page 태그는 웹페이지 자체 제목으로 표시가됩니다 뭔말인지 이해가 안되시나요?? 사진..

• format_list_bulleted 프로그래밍/HTML, PHP, CSS
• · 2020. 8. 9.
• textsms

HTML 강좌 #03 HTML에서 사용하는 태그 정리

안녕하세요 이전 강좌에서는 기본적인 html코드를 보여드리고 그 코드에대한 간단한 설명과 비주얼스튜디오코드를 사용하여 코드를 작성후 웹페이지에서 어떻게 보이나 열어봤는데요 오늘은 각 태그들을 사용하여 웹페이지에서는 어떻게 보이나 하나하나 확인해봅시다! 이전 강좌를 보지 못하신분들은 아래 링크를 클릭하여 확인해주세요 https://newstroyblog.tistory.com/3 사진이 잘 안보이거나 사진의 크기가 작으신분은 사진을 클릭하여 확대하여 봐주세요 HTML 코드를 작성할때 상단에 을 선언하며 시작해야합니다 1cs HTML문서의 시작과 끝이 다음으로는 HTML문서에서 시작은 끝은 으로 표현합니다 그래서 html의 시작과 끝을 추가하게되면 이렇게 됩니다 12345678 cs 브라우저에서 내용이 표시되..

• format_list_bulleted 프로그래밍/HTML, PHP, CSS
• · 2020. 8. 9.
• textsms