분류 전체보기(1084)
-
Web/HTML, CSS
2018.06.18
5
[Html] 옆으로 움직이는 텍스트 만들기 (MarQuee)
요즘은 그렇게 많이 사용하지 않는 태그인데 전광판처럼 텍스트를 움직이게 만들 수 있는 태그가 있습니다. 텍스트뿐만 아니라 사진도 가능합니다. HTML에서 텍스트나 사진을 움직이게 할 수 있는 태그는 바로 MarQuee태그인데요. 이번 포스팅에서는 HTML MarQuee태그를 사용하는 방법에 대해 알아보도록 하겠습니다. 옆으로 움직이는 텍스트 만들기 (MarQuee) 태그 속성 비고 bgcolor 배경색상 설정 width 가로 / 세로크기 설정 height 세로크기 설정 direction 스크롤의 움직임 방향 behavior 움직임의 속성 loop 움직임 반복횟수 scrollamount 스크롤 되는 거리간격 scrolldelay 스크롤의 속도 vspace 위 여백 hspace 아래 여백 MarQuee에는 ..
-
Web/HTML, CSS
2018.06.16
2
[Html] 하이퍼링크 A태그 사용법 (색상변경,링크설명,창 형태)
하이퍼링크란 "연결된 개체"를 뜻합니다. 특정 부분을 클릭해 다른 페이지로 이동을 시켜주는 기능이며 여러 개의 HTML 문서를 하나의 고리처럼 연결할 수 있습니다. 인터넷의 특성상 모든 정보를 한 페이지에서 띄울 수 없어 정보가 여러페이지로 분산될 수 밖에 없는데 하이퍼링크를 사용하면 여러페이지를 하나의 고리처럼 엮을 수 있어 굉장히 다양하게 사용되고 있습니다. 이러한 하이퍼링크를 HTML의 A태그를 활용하여 간단하게 구현할 수 있습니다. 하이퍼링크 만들기 태그 속성 비고 하이퍼링크 태그 link 방문하지 않은 하이퍼링크의 색상 alink 마우스로 클릭한 하이퍼링크의 색상 vlink 이미 방문한 하이퍼 링크의 색상 href 클릭시 이동시킬 페이지 title 마우스 Over시 나올 링크의 설명 target..
-
Web/HTML, CSS
2018.06.15
1
[Html] 수평선 긋기 HR태그 사용법
문단을 나눌때 영역을 나누고 싶을때 자주 사용하는것이 바로 수평선 그리기 HR태그입니다. 닫는 태그 없이 한번의 태그 사용으로 간단하게 수평선을 구현할 수 있어 많이들 사용하는 방법입니다. 수평선에 색을 입히거나 비율 수평선의 굵기까지 지정할 수 있습니다. 수평선 긋기 HR태그 사용법 태그 속성 비고 태그 수평선 화면 비율/크기 조절 수평선의 색 교체 수평선 크기 조절 HR태그에는 여러가지 속성이 있으나 위의 3가지 속성이 대표적입니다. 1. width속성은 width="500px" 크기를 지정하거나 width="50%" 화면에 나타날 비율을 정할 수 있습니다. 2. color은 HR태그의 색상을 설정할 수 있습니다. 3. size속성을 활용하여 수평선의 굵기도 설정해줄 수 있습니다. 예제 1. 웹브라우..
-
Web/HTML, CSS
2018.06.14
1
[Html] Font 속성/스타일 (굵기,기울기,밑줄,취소선)등등
HTML을 사용하다보면 글자의 속성을 바꿔주고 싶을때가 종종 있습니다. 하지만 이럴때마다 CSS를 사용해서 바꿔주는건 좀 귀찮죠. 이럴때 간편하게 사용할 수 있는 HTML 태그들을 소개합니다. Font 속성/스타일(굵기,기울기,밑줄선,취소선) 설정 속성 태그 비고 글꼴 속성/스타일 글자 굵기 글자 굵기 글자 기울기 취소선 긋기 밑줄긋기 위 첨자 밑 첨자 타자체 주변보다 크게 주변보다 작게 CSS없이 HTML에서 간단하게 구현할 수 있는 여러가지 태그들입니다. 1. 태그와태그는 글자를 진하게 만들어주는 태그로 서로 차이점은 없습니다. 2. 태그는 글자에 기울임을 줘서 이탤릭자처럼 만들어줍니다. 3. 태그는 글자에 취소선을 그어주는 태그입니다. 4. 태그는 글자에 밑줄을 그어주는 역할을 합니다. 5. 와는 ..
-
일상/블로그
2018.06.13
1
[블로그] Highlight.js의 각종 문제점 & 해결방법
이전 포스팅에서도 언급했다시피 저는 본래 코드 하이라이터를 Syntax Highlighting을 사용했었습니다. 하지만 새로 바꾼 코드 하이라이터인 Highlight.js도 많은 문제점을 가지고 있더군요. 이번 포스팅에서는 Highlight.js의 각종 문제점에 대해 알아보고 그 문제점을 해결해보는 시간을 가져보도록 하겠습니다. 티스토리 저작권자 표시 플러그인을 사용할 수 없다. Highlight.js를 사용하면 티스토리 저작권자 표시 플러그인을 사용 할 수 없습니다. 정확히 말하자면 사용할수는 있으나 이 플러그인을 사용하는 순간 그 코드를 복사해서 다른곳에 붙여넣으면 코드에 Enter가 안먹힙니다. 개행 없이 일렬로 쭉 나열되는 상황을 목격하실 수 있을겁니다. 아래 그림처럼요. ↑티스토리 저작권자 표시..
-
일상/블로그
2018.06.11
[블로그] Syntax Highlighting vs Highlight.js (장단점 비교분석)
블로그를 하면서 중요한것을 꼽자면 그 중 하나에 블로그 디자인도 꼭 포함되는 것 같습니다. 제 블로그의 방문자들이 블로그가 예뻐야 오래보고싶고(?) 다른페이지도 구경하고싶고 그렇지 않겠습니까? 디자인도 이상하고 광고만 덕지덕지 붙어있는 블로그라면 들어오자마자 뒤로가기 버튼을 누르고 싶어질겁니다. 코딩블로그는 제 블로그가 아니라도 많으니까요. 이전 포스팅에서도 언급했다시피 저는 본래 본문에 소스코드를 넣을때 SyntaxHighlighting을 사용했었습니다. 하지만 이젠 그렇지 않죠. 지금은 Highlight를 사용해서 본문에 소스코드를 삽입하고있습니다. 이번 포스팅에서는 제가 SyntaxHighlighting에서 Highlight로 넘어간 이유와 SyntaxHighlighting와 Highlight의 장..
-
일상/블로그
2018.06.09
4
[블로그] 코딩소스에 하이라이트(코드블럭) 넣는법 (Highlight.js)
저는 이때까지 본문에 코드를 올릴때 SyntaxHighlighting을 사용하였는데요. 계속 쓰다보니 단점이 한 두개가 아니더라구요. 그래서 다른 코드하이라이터를 찾던 중 Highlight.js를 발견하였고 비교분석 결과 Highlight.js가 더 낫다는 결론을 내렸습니다. 하이라이터를 바꾸려면 본문의 소스가 있는 부분마다 일일이 다 수작업으로 바꿔주는 작업을 해야하기에 글이 더 많아지기전에 최대한 빨리하는게 낫다는 판단하에 오늘부터 하이라이터를 차근차근 바꿔보려고 합니다. 1. 176개의 언어와 79개 스타일을 제공하고 자동으로 언어를 감지해서 스타일이 적용되며 둘 이상의 언어라도 가능하다. 2. 노트.js에서 사용 가능하며 어떠한 마크업(태그)라도 동작한다. 3. 어떠한 자바스크립트 프레임워크라고 ..
-
Languague/Java
2018.06.07
2
[Java] Split함수 \n 개행 단위로 문자열 자르기
저는 문자열을 자를때 Split 함수를 즐겨쓰는데요. 오늘 몰랐던 사실 하나를 발견해서 포스팅합니다. 바로 Split함수에서 \n 개행단위로 문자열을 자르는 방법인데요. 당연히 문자열.split("\n");이렇게 하면 될줄 알았는데 안먹히더라구요. 알고보니 split함수에서 개행단위로 문자열을 끊으려면 문자열.split("\\n"); 이렇게 써주셔야 컴퓨터가 인식한다고 합니다. Split \n 개행단위로 문자열 자르기 예제 public class split_ex { public static void main(String[] args) { String target ="동해물과 백두산이 \n마르고 닳도록\n하나님이 보우하사 우리나라만세\n"; String[] change_target = target.spli..
-
일상/블로그
2018.06.04
5
[블로그] FastBoot 상단바에 배너(사진) 넣기
티스토리 블로그를 하는 사람 중 많은 사람들이 FastBoot이라는 스킨을 쓰고있습니다. 그만큼 좋은 스킨이기 때문이겠죠? 하지만 너무나도 많은 사람들이 쓰고 있어 블로그에 개성이 없어지고 있다는 사실에 슬픕니다. 그래서 블로그 상단에 배너를 달아 다른사람들과 좀 차별성을 두고자 합니다. FastBoot 상단바에 배너(사진) 넣기 1. 이런 배너창을 만드는 방법입니다. 우선 배너에 들어갈 사진이 한장 있어야 합니다. 가로는 1920, 높이는 100~130정도의 배너용 사진을 한장 준비해주세요. ※ 해상도가 큰 디바이스로 접속을하면 사진이 두개로 나올 수 있습니다. 바로 위사진처럼요. 사진이 두개로 나오면 빨간색 박스의 안처럼 뭔가 부자연스럽게 연결이 되는것을 보실 수 있습니다. 그렇기에 사진의 왼쪽부분과..
-
일상/블로그
2018.05.23
3
[블로그] 하이라이트 코딩소스 넣는법 (SyntaxHighlighting )
제 블로그는 코딩블로그입니다. 소스코드를 올릴 일이 굉장히 많죠. 하지만 이 소스코드를 가공하지않고 그냥 올릴경우에는 굉장히 가독성이 떨어집니다. 이번 포스팅에서는 SyntaxHighlighting을 이용하여 Html을 조작하여 코드를 넣는 방법에 대해 알아보겠습니다. 티스토리 블로그에 코딩소스 넣는법 1. 먼저 SyntaxHighlighting을 사용하려면 하이라이터를 다운받아줘야합니다. 먼저 위에 첨부되어 있는 압축파일을 받으시고 압축을 풀어주세요. 2. 그런뒤 블로그-> 꾸미기-> 스킨편집에 들어갑니다. 3. html편집 -> 파일업로드를 누른뒤 압축해제파일에 있는 Script와 Styles에 있는 파일들을 자신의 블로그 파일업로드에 업로드해주세요. 4. 그런 뒤 HTML탭으로 이동하셔서 안에 자신..
-
Web/HTML, CSS 2018.06.18 5[Html] 옆으로 움직이는 텍스트 만들기 (MarQuee) 요즘은 그렇게 많이 사용하지 않는 태그인데 전광판처럼 텍스트를 움직이게 만들 수 있는 태그가 있습니다. 텍스트뿐만 아니라 사진도 가능합니다. HTML에서 텍스트나 사진을 움직이게 할 수 있는 태그는 바로 MarQuee태그인데요. 이번 포스팅에서는 HTML MarQuee태그를 사용하는 방법에 대해 알아보도록 하겠습니다. 옆으로 움직이는 텍스트 만들기 (MarQuee) 태그 속성 비고 bgcolor 배경색상 설정 width 가로 / 세로크기 설정 height 세로크기 설정 direction 스크롤의 움직임 방향 behavior 움직임의 속성 loop 움직임 반복횟수 scrollamount 스크롤 되는 거리간격 scrolldelay 스크롤의 속도 vspace 위 여백 hspace 아래 여백 MarQuee에는 ..
-
Web/HTML, CSS 2018.06.16 2[Html] 하이퍼링크 A태그 사용법 (색상변경,링크설명,창 형태) 하이퍼링크란 "연결된 개체"를 뜻합니다. 특정 부분을 클릭해 다른 페이지로 이동을 시켜주는 기능이며 여러 개의 HTML 문서를 하나의 고리처럼 연결할 수 있습니다. 인터넷의 특성상 모든 정보를 한 페이지에서 띄울 수 없어 정보가 여러페이지로 분산될 수 밖에 없는데 하이퍼링크를 사용하면 여러페이지를 하나의 고리처럼 엮을 수 있어 굉장히 다양하게 사용되고 있습니다. 이러한 하이퍼링크를 HTML의 A태그를 활용하여 간단하게 구현할 수 있습니다. 하이퍼링크 만들기 태그 속성 비고 하이퍼링크 태그 link 방문하지 않은 하이퍼링크의 색상 alink 마우스로 클릭한 하이퍼링크의 색상 vlink 이미 방문한 하이퍼 링크의 색상 href 클릭시 이동시킬 페이지 title 마우스 Over시 나올 링크의 설명 target..
-
Web/HTML, CSS 2018.06.15 1[Html] 수평선 긋기 HR태그 사용법 문단을 나눌때 영역을 나누고 싶을때 자주 사용하는것이 바로 수평선 그리기 HR태그입니다. 닫는 태그 없이 한번의 태그 사용으로 간단하게 수평선을 구현할 수 있어 많이들 사용하는 방법입니다. 수평선에 색을 입히거나 비율 수평선의 굵기까지 지정할 수 있습니다. 수평선 긋기 HR태그 사용법 태그 속성 비고 태그 수평선 화면 비율/크기 조절 수평선의 색 교체 수평선 크기 조절 HR태그에는 여러가지 속성이 있으나 위의 3가지 속성이 대표적입니다. 1. width속성은 width="500px" 크기를 지정하거나 width="50%" 화면에 나타날 비율을 정할 수 있습니다. 2. color은 HR태그의 색상을 설정할 수 있습니다. 3. size속성을 활용하여 수평선의 굵기도 설정해줄 수 있습니다. 예제 1. 웹브라우..
-
Web/HTML, CSS 2018.06.14 1[Html] Font 속성/스타일 (굵기,기울기,밑줄,취소선)등등 HTML을 사용하다보면 글자의 속성을 바꿔주고 싶을때가 종종 있습니다. 하지만 이럴때마다 CSS를 사용해서 바꿔주는건 좀 귀찮죠. 이럴때 간편하게 사용할 수 있는 HTML 태그들을 소개합니다. Font 속성/스타일(굵기,기울기,밑줄선,취소선) 설정 속성 태그 비고 글꼴 속성/스타일 글자 굵기 글자 굵기 글자 기울기 취소선 긋기 밑줄긋기 위 첨자 밑 첨자 타자체 주변보다 크게 주변보다 작게 CSS없이 HTML에서 간단하게 구현할 수 있는 여러가지 태그들입니다. 1. 태그와태그는 글자를 진하게 만들어주는 태그로 서로 차이점은 없습니다. 2. 태그는 글자에 기울임을 줘서 이탤릭자처럼 만들어줍니다. 3. 태그는 글자에 취소선을 그어주는 태그입니다. 4. 태그는 글자에 밑줄을 그어주는 역할을 합니다. 5. 와는 ..
-
일상/블로그 2018.06.13 1[블로그] Highlight.js의 각종 문제점 & 해결방법 이전 포스팅에서도 언급했다시피 저는 본래 코드 하이라이터를 Syntax Highlighting을 사용했었습니다. 하지만 새로 바꾼 코드 하이라이터인 Highlight.js도 많은 문제점을 가지고 있더군요. 이번 포스팅에서는 Highlight.js의 각종 문제점에 대해 알아보고 그 문제점을 해결해보는 시간을 가져보도록 하겠습니다. 티스토리 저작권자 표시 플러그인을 사용할 수 없다. Highlight.js를 사용하면 티스토리 저작권자 표시 플러그인을 사용 할 수 없습니다. 정확히 말하자면 사용할수는 있으나 이 플러그인을 사용하는 순간 그 코드를 복사해서 다른곳에 붙여넣으면 코드에 Enter가 안먹힙니다. 개행 없이 일렬로 쭉 나열되는 상황을 목격하실 수 있을겁니다. 아래 그림처럼요. ↑티스토리 저작권자 표시..
-
일상/블로그 2018.06.11[블로그] Syntax Highlighting vs Highlight.js (장단점 비교분석) 블로그를 하면서 중요한것을 꼽자면 그 중 하나에 블로그 디자인도 꼭 포함되는 것 같습니다. 제 블로그의 방문자들이 블로그가 예뻐야 오래보고싶고(?) 다른페이지도 구경하고싶고 그렇지 않겠습니까? 디자인도 이상하고 광고만 덕지덕지 붙어있는 블로그라면 들어오자마자 뒤로가기 버튼을 누르고 싶어질겁니다. 코딩블로그는 제 블로그가 아니라도 많으니까요. 이전 포스팅에서도 언급했다시피 저는 본래 본문에 소스코드를 넣을때 SyntaxHighlighting을 사용했었습니다. 하지만 이젠 그렇지 않죠. 지금은 Highlight를 사용해서 본문에 소스코드를 삽입하고있습니다. 이번 포스팅에서는 제가 SyntaxHighlighting에서 Highlight로 넘어간 이유와 SyntaxHighlighting와 Highlight의 장..
-
일상/블로그 2018.06.09 4[블로그] 코딩소스에 하이라이트(코드블럭) 넣는법 (Highlight.js) 저는 이때까지 본문에 코드를 올릴때 SyntaxHighlighting을 사용하였는데요. 계속 쓰다보니 단점이 한 두개가 아니더라구요. 그래서 다른 코드하이라이터를 찾던 중 Highlight.js를 발견하였고 비교분석 결과 Highlight.js가 더 낫다는 결론을 내렸습니다. 하이라이터를 바꾸려면 본문의 소스가 있는 부분마다 일일이 다 수작업으로 바꿔주는 작업을 해야하기에 글이 더 많아지기전에 최대한 빨리하는게 낫다는 판단하에 오늘부터 하이라이터를 차근차근 바꿔보려고 합니다. 1. 176개의 언어와 79개 스타일을 제공하고 자동으로 언어를 감지해서 스타일이 적용되며 둘 이상의 언어라도 가능하다. 2. 노트.js에서 사용 가능하며 어떠한 마크업(태그)라도 동작한다. 3. 어떠한 자바스크립트 프레임워크라고 ..
-
Languague/Java 2018.06.07 2[Java] Split함수 \n 개행 단위로 문자열 자르기 저는 문자열을 자를때 Split 함수를 즐겨쓰는데요. 오늘 몰랐던 사실 하나를 발견해서 포스팅합니다. 바로 Split함수에서 \n 개행단위로 문자열을 자르는 방법인데요. 당연히 문자열.split("\n");이렇게 하면 될줄 알았는데 안먹히더라구요. 알고보니 split함수에서 개행단위로 문자열을 끊으려면 문자열.split("\\n"); 이렇게 써주셔야 컴퓨터가 인식한다고 합니다. Split \n 개행단위로 문자열 자르기 예제 public class split_ex { public static void main(String[] args) { String target ="동해물과 백두산이 \n마르고 닳도록\n하나님이 보우하사 우리나라만세\n"; String[] change_target = target.spli..
-
일상/블로그 2018.06.04 5[블로그] FastBoot 상단바에 배너(사진) 넣기 티스토리 블로그를 하는 사람 중 많은 사람들이 FastBoot이라는 스킨을 쓰고있습니다. 그만큼 좋은 스킨이기 때문이겠죠? 하지만 너무나도 많은 사람들이 쓰고 있어 블로그에 개성이 없어지고 있다는 사실에 슬픕니다. 그래서 블로그 상단에 배너를 달아 다른사람들과 좀 차별성을 두고자 합니다. FastBoot 상단바에 배너(사진) 넣기 1. 이런 배너창을 만드는 방법입니다. 우선 배너에 들어갈 사진이 한장 있어야 합니다. 가로는 1920, 높이는 100~130정도의 배너용 사진을 한장 준비해주세요. ※ 해상도가 큰 디바이스로 접속을하면 사진이 두개로 나올 수 있습니다. 바로 위사진처럼요. 사진이 두개로 나오면 빨간색 박스의 안처럼 뭔가 부자연스럽게 연결이 되는것을 보실 수 있습니다. 그렇기에 사진의 왼쪽부분과..
-
일상/블로그 2018.05.23 3[블로그] 하이라이트 코딩소스 넣는법 (SyntaxHighlighting ) 제 블로그는 코딩블로그입니다. 소스코드를 올릴 일이 굉장히 많죠. 하지만 이 소스코드를 가공하지않고 그냥 올릴경우에는 굉장히 가독성이 떨어집니다. 이번 포스팅에서는 SyntaxHighlighting을 이용하여 Html을 조작하여 코드를 넣는 방법에 대해 알아보겠습니다. 티스토리 블로그에 코딩소스 넣는법 1. 먼저 SyntaxHighlighting을 사용하려면 하이라이터를 다운받아줘야합니다. 먼저 위에 첨부되어 있는 압축파일을 받으시고 압축을 풀어주세요. 2. 그런뒤 블로그-> 꾸미기-> 스킨편집에 들어갑니다. 3. html편집 -> 파일업로드를 누른뒤 압축해제파일에 있는 Script와 Styles에 있는 파일들을 자신의 블로그 파일업로드에 업로드해주세요. 4. 그런 뒤 HTML탭으로 이동하셔서 안에 자신..