✨ Front-end/HTML5 [HTML] 문자, 기호, 심볼, 앵커 알아보기 많이 사용되는 문자, 기호 태그 태그를 사용하면 사용자가 입력한 그대로 출력이 가능하다. 그 밖의 html 태그들 앵커란? HTML 페이지 내의 특정한 위치로 이동하는 것. 으로 앵커 생성 앵커는 해당 링크 클릭시 id 값으로 갖는 곳으로 같은 페이지 내에서 이동한다. 2023. 8. 7. HTML을 부트스트랩(Bootstrap) 적용시키는 방법과 사용 팁, 주의사항 사이트 검색시 한글로 치지말고 영어로 쳐서 들어가자. 이후 Docs로 들어가면된다. 위 사진과 같이 태그는 태그가 끝나기 전에, 태그는 태그가 끝나기 전에 적절하게 붙여넣어 주면 완성이다. Bootstrap 적용 X Bootstrap 적용 O 왼쪽 스크롤에 Components 에 있는 Buttons을 살펴보면 위와 같이 각 클래스 이름들이 있다. 적절하게 사용해주면 이쁜 버튼들이 완성될 것 같다. Bootstrap 이용시 주의 사항 혹은 로 들어와야 Bootstrap이 적용이 잘 된다. 위 html 페이지 소스 코드 HTML 삽입 미리보기할 수 없는 소스 div6 은 col-6 으로 인해 화면의 반을 차지하고, 그 외는 각 3칸 씩 총 토탈 12칸으로 화면이 꽉찬다. 이처럼 Bootstrap은 하나의 열.. 2023. 3. 17. [HTML] 스프링(Spring)에서 파일 생성 시 형식 추가 세팅 파일 메뉴의 Window -> Preferences를 클릭한다. 검색창에 template를 치고, HTML Files를 찾아 Templates를 선택하면 위와 같은 창이 뜨는데, New 혹은 Edit을 클릭하여 창을 생성 또는 수정한 후 OK를 누른다. 생성 or 수정한 HTML 파일 만들어보기 위와 같은 방법으로 마지막에 Finish를 누르면 생성이 된다 ! 2023. 3. 17. HTML - table과 div의 사용법 table과 div태그는 HTML을 하면서 굉장히 많이 볼 친구들이다. 아주 중요한 내용이며 이해해야 코드를 보는데 보다 쉽게 이해할 수 있을 것이라고 생각한다. HTML 삽입 미리보기할 수 없는 소스 위 코드를 실행해보면 아래와 같은 그림이 웹사이트에 만들어진다. 코드는 body다음인 8번째 줄, table부터 시작된다. border="1'을 주어 table의 생김새를 파악해주었다. 9번째 줄, 16번째 줄, 28번째 줄에 있는 thead와 tbody, tfoot은 table의 제목, 본문, 꼬리말을 표현한 태그이지만 사용하지 않아도 무방하다. table은 먼저 이라는 행을 선언하면서 시작된다. 이후 를 이용하여 열을 만들어준다. td대신 제목을 넣을 땐 를 넣어도 무방하다. th를 넣을 시 자동으로 .. 2023. 2. 8. HTML - 이미지, 링크, input, 개행<br>, 문자<p> 기초 HTML은 웹을 개발하는데 있어 가장 기초적인 것이다. HTML 삽입 미리보기할 수 없는 소스 html을 작성할땐 7번째 줄의 부터 31번째 줄의 까지 사용한다. 10번째 줄의 를 통해 첫번째 박스에 보이는 환풍을 입력할 수 있는 텍스트 박스를 만들 수 있다. 11번째 줄의 는 두번째 박스와 같이 비밀번호를 치면 암호화처럼 나타난다. 12번째 줄의 는 오른쪽에 마우스를 가져다대면 위 아래 버튼이 나온다. 클릭시 증가및 감소한다. 13번째 줄의 는 달력이 나오며 날짜를 선택할 수 있다. 14번째 줄의 는 눌러보면 색을 볼 수 있는 창이 만들어진다. 각 줄마다 이라는 태그는 강제 줄 개행이라는 의미이다. 16번째 줄의 이라는 것은 버튼을 생성하여 버튼안의 글씨를 확인으로 채우는 것이다. 17번째 줄의 는 네.. 2023. 2. 8. 이전 1 다음
