본문 바로가기

Web4

html head 간략하게 알기 1. html 필수 부분 쉽게 작성하기 HTML에서 필수적으로 입력해야 하는 부분의 이름은 , , , 태그입니다. 이 태그들은 모든 HTML 문서에서 필수적으로 포함되어야 하는 요소들이며, HTML 문서의 구조를 정의하고 웹 브라우저에서 문서를 제대로 표시하기 위해 반드시 입력해야 합니다. vscode 에서는 !를 입력 후 tab을 누르면 자동으로 필수 요소들을 배치해 줍니다. 2. 타이틀과 내용 타이틀 태그에 내용을 바꾸면 웹페이지의 타이틀이 바뀝니다. 메타 태그에서 content 속성의 내용은 검색 시 무슨 사이트인지 설명해 주는 태그입니다. 네이버로 예시를 들어보겠습니다. 구글에 검색했을 때 네이버 제목과 내용은 "네이버 메인에서 다양한 정보와 유용한 콘텐츠를 만나보세요."라고 적혀있습니다. 네이버.. 2023. 3. 21.
html 이미지 넣는 방법 위에 사진처럼 html에서 이미지를 넣어보도록 하겠습니다. 1. img 태그 img 태그는 닫는 태그가 없습니다. 이미지 태그의 속성에서 src은 소스를 이야기합니다. 여기에는 파일의 경로를 직접 입력해도 되고 인터넷에서 이미지의 주소를 직접 붙여 넣어도 됩니다. 구글에 고양이를 검색해 이미지 주소 복사를 해보겠습니다. 이미지 주소를 가져다가 src의 붙여 넣어주면 웹페이지에 이미지가 성공적으로 올라갑니다. 이상 img태그에 대해 알아보았습니다. 감사합니다. 2023. 3. 20.
a 태그 사용방법 a 태그는 다른 곳으로 이동할 수 있는 태그입니다. a 태그 내용을 클릭하면 설정한 링크로 이동이 됩니다. 1. 태그 입력 vscode에 a를 입력하면 자동완성 탭이 나옵니다. 여기서 을 누르면 a 태그가 자동으로 완성이 됩니다. a태그의 속성들은 여러가지가 있지만 href, target 속성만 설명해 드리겠습니다. href 속성은 연결하고자 하는 링크를 입력하면 해당 링크로 이동하도록 설정할 수 있습니다. target 태그는 링크로 이동할 때 현재 탭으로 이동할 것인지 아니면 새로운 탭을 열고 이동할 것인지 선택할 수 있습니다. 기본적으로 _self 속성으로 되어있어 현재 탭으로 이동이 됩니다. 속성을 _blank으로 변경하면 새 탭에 열리게 됩니다. 파일을 열어보면 google 글씨가 파랗게 변한 것.. 2023. 3. 19.
vscode에서 html 파일 작성하는 방법 vscode에서 html을 작성해 나만의 홈페이지 구축을 해보겠습니다. 제일 처음 단계는 index.html파일을 만들어 웹에서 열어보겠습니다. 1. 폴더 열기 File - Open Folder를 선택해 줍니다. 이제부터 선택한 폴더에서 작업하는 겁니다. 찾기 쉽게 바탕화면에 폴더를 만들어 줍니다. 2. html 파일 생성 파일 + 모양의 아이콘을 눌러 파일을 생성해 줍니다. 파일의 이름은 index.html로 만들어 줍니다. 뒤에 .html을 붙이셔야 html파일을 만들 수가 있습니다. 내용을 hellow!라고 적어 봅시다. 내용을 적었다면 를 눌러 저장해 줍시다. 3. html 파일 확인 지정한 폴더에 들어가 보면 index.html 파일이 생성되어 있습니다. index.html 파일을 클릭해 열어줍.. 2023. 3. 18.