본문 바로가기
728x90
반응형

HTML6

[HTML/CSS] #8 이미지에 링크 삽입하기 안녕하세요 저번에 링크 삽입하는 방법이랑 이미지 삽입하는 방법들을 알려드렸는데 오늘은 그 둘을 합쳐서 이미지 링크를 만드는 방법에 대해서 알려드릴게요 이미지에 링크를 삽입하는 방법입니다 더보기 이미지 삽입하기 이미지 링크 삽입하기 이런 식으로 링크를 삽입하는 기능인 a태그 안에 이미지 삽입 태그인 img 태그를 넣으면 이미지 링크가 완성됩니다 325enc.com으로 이동하는 링크 태그가 있고 그 안에 mcthemax.jpg 이미지 태그가 있으니까 가로 800px, 세로 500px의 사진을 누르면 설정해둔 링크로 이동할 수 있게 됩니다 그러면 이렇게 이미지를 눌렀을 때 성공적으로 이동할 수 있게 됩니다 ​ 더보기 이미지 영역별 링크 삽입하기 이번에는 이미지의 영역을 나누어서 각 영역마다 고유한 링크를 부여.. 2022. 1. 10.
[HTML/CSS] #7 이미지 삽입하기, 비율 조정, alt 안녕하세요 오늘은 이미지 삽입하는 방법에 대해서 알아볼게요 이미지는 라는 태그를 이용하여 삽입할 수 있습니다. 더보기 1. 삽입할 이미지 선택하기 삽입할 이미지를 선택하는 방법에는 두 가지가 있습니다. 하나는 이미지의 링크를 사용하는 것, 하나는 이미지를 다운로드해서 사용하는 것입니다. 먼저, 첫 번째로 이미지 링크를 사용해서 삽입해봅시다. 넣고 싶은 이미지나 사진을 검색해서 맘에 드는 이미지를 하나 찾아봅시다. 이미지를 찾은 후에 이미지를 우클릭하게 되면 이미지 주소 복사라는 버튼이 있습니다 눌러서 이미지 링크를 복사해주세요 이미지 삽입하 위와 같이 코드를 작성하시고 img 태그 src속성의 속성값을 아까 복사해둔 이미지 링크로 바꿔주세요. 그러면 이렇게 이미지가 잘 삽입된 것을 확인할 수 있습니다. .. 2022. 1. 4.
[HTML/CSS] #5. 주석 작성하기 안녕하세요 ​ 어떤 프로그래밍 언어든 코드를 작성할 때 주석은 유용하게 쓰입니다 내가 작성하던 코드를 다른 사람에게 넘겨준다고 생각해봅시다 ​ 그 코드는 제가 적었기에 저 자신은 알아볼 수 있지만 다른 사람은 그 코드를 이해하는 데에 시간이 매우 오래 걸립니다. ​ 이때 코드를 잘 이해할 수 있도록 간단한 설명이나 구성을 주석으로 적어놓는 것입니다 ​ 주석은 다른 사람뿐만 아니라 코드를 작성하는 본인에게도 유용하기 때문에 꼭 알아두셔야 합니다. 주석 주석 작성하기 주석은 보이지 않는다 주석은 그러면 한 번 이렇게 p 서식 태그 안에 주석을 넣어봅시다 ​ 결과는 아까와 같네요 주석은 보이지 않습니다 이렇게 주석을 작성하는 방법에 대해서 알아봤는데요 추가로 주석을 작성하는 단축키를 알려드리자면 Ctrl과 /.. 2021. 12. 20.
[HTML/CSS] #4. 글자 서식 태그 안녕하세요 오늘은 여러 가지 글자 서식 태그를 알아봅시다 글자 서식 태그는 말 그대로 글자의 서식을 지정하는 태그를 말합니다 Bold Strong Italic Emphasized Marked Small Deleted Inserted Subscript Superscript 이렇게 코드를 작성해봤어요 알아볼 태그는 b, strong, i, em, mark, small, del, ins, sub, sup 이렇게 한 번 하나하나 알아볼게요 Bold Bold 태그입니다 태그를 사용합니다 bold의 한국어 뜻인 '선명한, 굵은'에 맞게 글자가 두꺼워진 것을 알 수 있습니다 Strong 태그를 사용하고 Bold와 기능은 같습니다 Italic 태그를 사용하고 글씨체가 기울어져서 표시되는 것을 알 수 있습니다 Empha.. 2021. 12. 20.
[HTML/CSS] #2. html의 구조, title, h1, p 안녕하세요 오늘은 html의 기본 구조와 틀에 대해서 알아볼게요 안녕하세요 저는 고간디입니다. 위의 코드는 예시 코드입니다 이 코드에 사용된 태그들을 알아보며 html의 구조에 대해서 알아보도록 합시당 우선 코드를 복사해서 저장한 뒤에 실행해봅시다 html 파일을 실행해보면 이렇게 '안녕하세요'와 '저는 고간디입니다'가 출력되는 것을 알 수 있습니다. 아까 코드를 다시 봅시다 안녕하세요 저는 고간디입니다. 여기서 html, head, body 등 의 괄호로 묶여진 것을 태그라고 부릅니다. 태그에는 부모 태그와 자식 태그가 있는데 자식 태그는 부모 태그 안에 들어가 있는 태그를 말합니다. 예를 들어 위의 코드에서 부모 태그는 head, 자식 태그는 title이라고 볼 수 있는 것이지요. head 태그는 t.. 2021. 12. 20.
728x90
반응형