본문 바로가기
반응형

전체 글233

Java Script 적용 방법 이번 글에서는 Java Script의 적용방법인 내부 코드 삽입 방법과, 외부 파일 적용 방법에 대하여 다루겠습니다. # 내부 삽입과 외부 파일의 차이 적용하는 방법에 대하여 설명드리기에 앞서 두 방법의 차이점에 대하여 다루겠습니다. 내부 삽입은 원하는 웹페이지의 동작 매커니즘을 이루는 실행문 자체를 페이지의 html 파일에 삽입하여 넣는 방식입니다. 따라서, 한번의 과정만을 거치기에 굉장히 간단합니다. 반면에, 외부 파일 적용방법은 외부에 실행문을 포함하고 있는 파일을 저장하여 그 파일의 경로를 html에 삽입하는 방식입니다. 외부삽입 방식은 수정이나 디버깅이 쉽기 때문에 웹 디자이너들이 주로 채택하는 방식이기도 합니다. # 내부 자바스크립트 코드 적용방법 자바스크립트 코드는 외부 내부 적용방법 모두 .. 2022. 7. 23.
JavaScript의 출력방법 4가지 이번 글에서는 Java Script 언어의 출력 방법인 window.alert(), HTML DOM 요소를 이용한 inner HTML 프로퍼티, document.write() 방법, console.log() 방법에 대하여 다루겠습니다. # 자바스크립트 출력 자바스크립트는 총 4가지 방법을 이용하여 실행문에 해당하는 결과물을 웹페이지에 출력할 수 있습니다. 자바스크립트에서 사용할 수 있는 출력 방법은 아래와 같습니다. window.alert() 방법 : 대화 상자를 이용한 출력 HTML DOM 요소를 이용한 inner HTML 프로퍼티 document.write() 방법 console.log() 방법 # window.alert() 방법 자바스크립트에서 가장 간단하게 데이터를 출력할 수 있는 방법은 wind.. 2022. 7. 21.
[HTML] 텍스트에 마우스 위치시, 밑줄 표시하기 이번 글에서는 텍스트에 마우스를 위치 하였을 때에 자동으로 지정한 텍스트에 밑줄이 표시되도록 하는 방법에 대하여 다루겠습니다. # 링크 밑줄 미출력 현상 아래 사진은, 티스토리 북클럽 스킨의 카테고리를 임의로 접었다 펼치는 형태의 카테고리로 변경하였을 때에 출력되는 카테고리입니다. 현재, 저 사진은 카테고리에 마우스가 위치해 있는 상태이지만, 링크가 링크인 것처럼 보이게 하는 밑줄이 카테고리의 하단에 표현되지 않고 있습니다. 이러한 문제는 구글이 중요시하는 SEO 가이드를 따르지 않는 형태이기 때문에, 링크로서 보이게 해야 하며 방문자들이 카테고리의 다른 글로 이동할 때에도 좋은 역할을 하지 못합니다. # 마우스 위치시 밑줄을 표현하게 하는 방법 텍스트 또는 컨텐츠에 마우스가 위치하였을 때에 어떠한 동작.. 2022. 7. 21.
[HTML] 티스토리 검색바 안내문구 변경하기 이번 글에서는 티스토리 우측 상단에 표시되는 블로그 내 검색바의 안내문구를 변경하는 방법에 대하여 다루겠습니다. # 검색바 안내문구 변경 이유 먼저, 아래 사진이 티스토리 검색바의 초기 설정입니다. 자그마한 검색창 내부에 '검색 내용을 입력하세요.' 라는 안내문구가 쓰여져 있습니다. 저는 이 검색 내용을 입력하세요 라는 안내문구가 마음에 들지 않습니다. 이 검색바는 검색하는 블로그 내에서만 관련 내용을 출력해주는 기능을 합니다. 해당 블로그 특화 검색바르는 것입니다. 따라서, '블로그' 와 지금 있는 블로그의 '위치'가 안내 문구에 포함되게 만들기 위하여 이 멘트를 '이 블로그에서 검색'으로 바꾸고자 합니다. # 검색바 안내문구 변경 방법 검색바의 안내문구는 별도의 CSS 조정을 필요치 않습니다. HTM.. 2022. 7. 19.
[HTML] 티스토리 카테고리 접기 / 펼치기 이번 글에서는 티스토리 블로그에서 카테고리를 접어서 표현할지, 펼쳐서 표현할지를 결정하는 방법에 대하여 다루겠으며, CSS를 통한 외형적 꾸미기에 대해서는 다루지 않았습니다. # 티스토리 카테고리의 기본설정 아래있는 사진은 티스토리 북클럽 스킨의 카테고리 초기설정입니다. 북클럽에서는 아래 사진처럼 카테고리를 펼쳐둔 상태로 표현합니다. 아래와 같이 상위 카테고리와 하위 카테고리의 숫자가 적을 때에는 이러한 형태가 문제를 야기하지는 않으나, 카테고리의 분류가 과해지는 경우에는 이러한 분류가 가독성에 악영향을 미칠 수 있기에 카테고리를 접어두어야 합니다. 허나, 티스토리에서는 카테고리 등의 컨텐츠들을 티스토리 치환자를 통하여 수정하게 하여 블로그 플랫폼 사용자들의 편의를 봐주고 있습니다. 이러한 경우에는 티스.. 2022. 7. 19.
[HTML] CSS list-style 설명과 사용방법 이번 글에서는 우리가 웹페이지 내에서 리스트를 작성할 때에 리스트의 글 머리를 결정하는 CSS 속성인 list-style 속성에 대하여 다루겠습니다. # list-style 속성 우리는 웹페이지를 꾸려나감에 있어서 수많은 리스트들을 사용합니다. 아무것도 아닌것 같은 카테고리부터 즐겨찾기 목록까지, 리스트들은 수도 없이 많으며 그 수많은 리스트들의 글머리 또한 다양합니다. 단순한 점, 아무것도 표시되어 있지 않은 글머리, 사각형의 글머리 등등. 이러한 글머리들을 정의하는 CSS 속성이 바로 list-style 속성입니다. 위 사진은 list-style이 적용되지 않은 리스트의 사진입니다. ul (un ordered list)를 사용하였기 때문에 글 머리가 검은색 원으로 나와있습니다. 사진에도 보이듯이 즐겨.. 2022. 7. 18.
반응형

티스토리툴바