본문 바로가기
  • 오늘도 한걸음. 수고많았어요.^^
  • 조금씩 꾸준히 오래 가자.ㅎ

html6

yaml 과 yml 확장자는 사실 같다. yaml과 yml파일 확장자는 모두 해석 및 구문이 동일합니다. 3글자인가 4글자인가 확장자의 차이가 있긴 하여 다른파일이 아닌가? 생각할 수 도 있지만, 실은 동일한 파일입니다. 이렇게 분리된 이유는 옛날 Windows에서 Extensions는 파일확장자가 3자로 제한되는 특성이 있었기 때문이라고 합니다. 그래서 예전에는 .html 대신 .htm 으로도 쓰였는데 이와 같은 원리입니다. 요즘은 확장자에 3글자를 넣어야 하는 OS 시스템 수준의 시행이 없으니, 4글자인 .yaml로 사용해도 문제없습니다. 2024. 2. 5.
[html] table-layout 속성을 이용하여 테이블 고정하기 이 문제는 크롬에서는 발견되지 않으나, 익스플로러에서는 자주 발견된다. table-layout 속성값을 fixed로 지정하면 셀안의 데이터가 길어서 지정한 너비 이상으로 셀을 밀어버리는 것을 방지한다. 보통 셀안의 내용이 한글인 경우 공백이 중간 중간에 들어가므로 자동으로 지정한 너비에서 줄바꿈이 일어난다. 셀안의 데이터가 한글인 경우 지정한 셀의 크기에 따라서 자연스럽게 줄바꿈이 일어납니다. 테이블의 너비가 200픽셀로 셀안의 내용에 비해서 좁더라도 아래와 같이 자연스럽게 줄바꿈이 일어난다. 그런데 위처럼 데이터가 한글인 경우 지정한 셀의 크기에 따라서 자연스럽게 줄바꿈이 일어 나지만 홈페이지 주소와 같이 영문으로 공백이 없는 경우는 셀을 밀어버리는 현상이 발생한다 http://teck10.tistor.. 2018. 10. 28.
input name 차이 구분하기 위 태그는 XHTML 1.0 Strict 유효성을 통과한다. name이나 id 속성을 넣어줄 필요가 없다. 그러면 name이나 id는 왜 쓰는걸까?? 이는 특정 요소에 스타일이나 동적 변화에 대한 대상이 되게 하려고 쓰는 것이다. 또한 페이지 전환 시 데이터 전송을 위해서도 쓰인다. 그런데 name 이나 id는 보통 같은값으로 하는 경우가 많다. 두 속성이 같은 기능을 하는것은 아닌데, 왜 그러는 걸까?? 그럴려면 name과 id의 기능을 먼저 알아야 한다. name - image, div, table 등 다양한 요소에 사용 가능 - form 태그를 이용하여 다른 페이지로 값을 전달할 때 사용 - checkbox의 값을 전달할 때 배열로 전달시킴 - 자바스크립트의 getElementsByName을 활용할.. 2018. 10. 7.
[css] radio, checkbox 이미지 바꾸기 2 폼입력 컨트롤중 하나인 라디오버튼(radio)과 체크박스(checkbox)를 CSS의 선택자와 백그라운드 속성을 이용하여 디자인을 입히는 방법을 찾아 변경하는 방법을 정리해본다. HTML에서 다음과 같이 label을 이용하면 된다. ㄹㄹㄹㄹ 1 2 3 4 남자 CSS의 경우 HTML과 달리 기존과 달리 추가해주어야 하는 곳이 많다. IE에서는 적용되지 않게 하기위한 :not 선택자, 라디오버튼(radio)과 체크박스(checkbox) 비활성화와 체크여부를 알기위한 :disabled, :checked 선택자등 CSS3에서 추가된 가상선택자등이 사용되었다. 1 p>input[type="checkbox"], p>input[type="radio"] { position:relative; top:-1px; vert.. 2018. 10. 7.
[css] radio, checkbox css 바꾸기 원하는 radio, checkbox 를 구현하는 방법은 두가지가 있다. 1. 이미지를 넣어서 라디오 버튼과 체크 박스에 내가 원하는 이미지를 넣는 방법. 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 /*css*/ input[type="radio"], input[type="checkbox"] { display:inline-block; width:20px; height:20px; vertical-align:middle; background:url(radio_n.png) no-repeat 0 0; appearance: none; -moz-appearance: none; /* Firefox */ .. 2018. 10. 7.
나눔고딕,나눔바른고딕 웹폰트 적용하기 기본 폰트를 지정해놓으면 그냥 쓸때보다 훨~씬 깔끔해 보인다. 설정해놓기 좋은 폰트 중에 무료폰트인 나눔고딕을 적용하는 방법을 알아보자. 1. 나눔고딕 웹폰트를 사용하려면 웹폰트로 만들어진 폰트 파일을 서버에 올립니다. 아래링크를 클릭해서 다운로드 하면 된다. 보통 웹폰트는 용량이 크면 안되기 때문에 ttf를 쓰지 않고 woff, eot 파일을 사용한다. woff : Web Open Font Format의 약자로 W3C권고 표준이고, 파이어폭스, 사파리, 오페라, 크롬, IE 9이상에서 지원 eot : Embeded Open Type의 약자로, 표준형식은 아니지만, IE6~8버전에서는 eot만을 지원하기 때문에, woff, eot 모두 필요 2. CSS에서 다음과 같이 정의함으로 폰트를 적용할 수 있습니.. 2018. 10. 6.

티스토리툴바