Tiny Bunny

본문 바로가기

💡Language/HTML5

[HTML] <pre> <p> 태그 차이 / <div><span> 태그 차이 HTMl 내부에서 텍스트를 입력하는데 사용되는 태그에는 가장 흔하게 .. / / 등이 있다. 태그와 태그의 차이에 대해 정리해보자! 태그띄어쓰기가 최대 1개까지만 적용된다. 연속으로 띄어쓰기해도 적용되지 않는다.줄바꿈은 태그 외에는 적용되지않는다. 태그vs code에서 작성한 연속된 띄어쓰기와 줄바꿈이 그대로 적용된다.거대한 문단을 적을때, 따라서 많은 줄바꿈과 띄어쓰기가 발생하는 경우 사용하는 것이 좋다. 태그주로 단순 텍스트와 텍스트와 관련된 범위를 감쌀때 사용함태그 자체에 의미가 없긷문에 style을 위한 시각적인 장식용태그로 사용하기에 적합하다.태그는 인라인 요소이기때문에, 컨텐츠의 너비만큼 사이즈가 책정된다. -> 따라서 컨텐츠가 없는 경우 안보임. 태그레이아웃(블록, 구획).. 2024. 8. 2.

HTML로 로그인 창 뼈대 만들어보기 웹 사이트에 로그인 할 때 우리가 자주 마주하는 로그인 창을 지금까지 익힌 html로 만들어보기 도저어언! 완성한 코딩 ! -다른 웹사이트 계정으로 연동할 수 있는 소셜로그인 창도 만들어주고, sign in with google 이미지도 가져와서 ★ 로 바로 연결 될 수 있게 넣어주었다. ★password는 입력할 때 'for 속성값'과 'id 속성값' 이 같아야한다. (입력 시 ·······라고 입력됨) - 최종 저장하기 전에 수정을 했었나보다,,ㅎ누락된 태그를 여기에 적어보면 or Forgot your password? 이렇게 적으면 로그인 창 아래에 id/pw를 잊어버렸을 때 찾을 수 있는 링크로 연결되는 버튼을 만들 수 있다.! (아직 id/pw를 찾을 수 있는 웹은 존재하지 않.. 2024. 1. 7.

링크와 이미지 넣기 - src속성, alt속성, 이미지 링크(img) 1)img 태그와 alt 속성/ 이미지 경로 표시 여기에서 주의할 게 바로, "src 속성" 이다. src 속성 -> 삽입하려는 이미지의 경로 ★★★★ 기준 : 실행되는 HTML 파일의 위치 ! -html 파일의 위치를 기준으로 '이미지 파일의 경로'를 나타낸다. ★★ html파일과 같은 위치(현재 폴더) 에 있는 경우 사용하는 ./ 은 생락할 수 있음. ../ 은 상위 폴더에 있던 이미지파일을 불러온 것이고, ./은 html과 동일한 폴더에 있는 이미지 파일을 불러오는 상황이다. 짠! 이렇게 내가 설정한 이미지를 삽입했다. 2) 이미지 링크 -이미지 링크란 html에서 해당 이미지를 클릭하면 특정 웹 사이트로 이동할 수 있는 링크다. 지금부터 우리가 모두 잘 알.. 2024. 1. 7.

목록 만들기 <ul,ol,dl 태그> html에서 주로 사용되는 세 가지 목록 태그에 대해서 알아보자. 1) ul 태그 -(unordered list) -순서 없는 목록 생성, 나열시 사용함. - 로 목록 내용 구성 2) ol 태그 -(ordered list) -순서가 존재하는 목록 생성 시 사용함. - 로 목록 내용 구성 오호라.. 나중에 to do list + 운동 기록 등을 할 수 있는 웹 제작할 때 사용해볼까 3) dl 태그 -dl(decription list) , dt(description term), dd(description details) 태그 사용 -정의형 목록에 사용( 용어 설명 나열) 2024. 1. 7.

Visual Studio Code/ 여러 태그들 Today's Summary 오늘 익힌 html 여러 태그들 태그가 들어갈 곳 -대략적인 커다란 틀이라고 볼 수 있다. 이제 여기에 각종 태그들을 추가한다. -html 기본구조 -> DTD, html, title, body 1) DTD 문서형 정의 2) 언어.. 2024. 1. 7.

이전 1 다음

티스토리툴바