::selection {
background:#99CC00;
color: #FFF;
text-shadow: none;
}
::-moz-selection {
background:#99CC00;
color: #FFF;
text-shadow: none;
}
::-webkit-selection {
background:#99CC00;
color: #FFF;
text-shadow: none;
}
| 이미지에 마우스 우클릭시 경고창 띄우기 (0) | 2015.07.17 |
|---|---|
| 브라우져 스크롤바 색상변경하기 (0) | 2015.07.17 |
| div 나 span 등에 tag에서 수직 정렬하기 (0) | 2015.07.17 |
| a 링크 테두리 점선 한번에 없애기 (0) | 2015.07.17 |
| 아이프레임 iframe 배경 투명하게 만들기 (0) | 2015.07.17 |
div, span 등 태그에서는 수직 중앙 정렬이 안되죠
vertical-align : middle
이것이 정상적으로 인식 하지 않아요
하지만 불가능하지 않아요..
<div style='display:table-col;vertical-align:middle;width:400px;height:400px;'>중앙</div>
이렇게 하면 수직 정렬이 가능해요.
수평 정렬은 당연 text-align으로 하면 되죠.
이 둘을 이용하면 정중앙에 배치를 할 수 있어요
다른방법
table-col 보다 코드가 더 추가 되지만 ,
잘 몰라서 네이버 검색하고 뭐하고 등등 고민하지 말고 그냥 쓰시면 되요
<div style="width:400px;height:400px;border:1px solid #ddd;">
<table border=0 cellpadding=0 cellspacing=0 width=100% height=100%>
<tr><td align=center valign=center>중앙정렬</td></tr>
</table>
</div>
작업 할 시간도 부족한데... 이곳 저곳 찾아다니지 말고 그냥 이걸 이용해서 중앙 정렬 하면 되겠네요.
| 브라우져 스크롤바 색상변경하기 (0) | 2015.07.17 |
|---|---|
| 텍스트 블록지정 (드래그) 색상 바꾸기 (0) | 2015.07.17 |
| a 링크 테두리 점선 한번에 없애기 (0) | 2015.07.17 |
| 아이프레임 iframe 배경 투명하게 만들기 (0) | 2015.07.17 |
| 모바일로 접속시 모바일 홈페이지로 이동하는 태그 (0) | 2015.07.17 |
onfocus=this.blur(); 를 한번에 적용시키기
onfocus='this.blur()'
이미지 클릭시 테두리 점선나오는것 한번에 적용시켜 없애기
<script language="javascript">
function bluring(){
if (event.srcElement.tagName=="A"||event.srcElement.tagName=="IMG") document.body.focus();
}
document.onfocusin=bluring;
</script>
이미지맵은 적용안되고 개별로 onfocus='this.blur()'를 써줘야함
예)
<map name="cafe" id="Map">
<area shape="rect" coords="28,114,186,153" href="http://cafe.daum.net/sambong.com" target="_blank" onfocus="this.blur();" />
</map>
-스타일로 적용
a:active, a:focus {outline:none;}
키보드의 접근성은 놔두면서 마우스클릭시만 점선없애기
a:active {outline:none;}
input type=file 에 링크점선 없애기입니다.
<style>
input { selector-dummy : expression(this.hideFocus=true);}
</style>
[출처] [CSS]input type=file 에 링크점선 없애기|작성자 park9615
| 텍스트 블록지정 (드래그) 색상 바꾸기 (0) | 2015.07.17 |
|---|---|
| div 나 span 등에 tag에서 수직 정렬하기 (0) | 2015.07.17 |
| 아이프레임 iframe 배경 투명하게 만들기 (0) | 2015.07.17 |
| 모바일로 접속시 모바일 홈페이지로 이동하는 태그 (0) | 2015.07.17 |
| 마우스 우클릭 방지 소스 (0) | 2015.07.17 |
아이프레임을 사용하실때 배경이 불투명하여(흰색) 꾸미기가 난감하셨죠?
아래 방법을 이용하시면 아이프레임이 투명해져서 감쪽같아집니다!
1. 아이프레임으로 불러올 문서의 <body> 스타일을 아래와 같이 지정해줍니다.
<BODY STYLE="background-color:transparent">
2. iframe을 불러들일때 아래 속성을 첨부해줍니다.
<iframe src="URL" name="NAME" width="넓이" height="높이" border="0" frameborder="0" allowTransparency="true"></iframe>
if ($board[bo_table] == '41' )
echo "<iframe src='/bbs/online.php' width=100% height=500 frameborder=0 scrolling=no allowTransparency='true'></iframe>";
[불투명도 조절 tip]
1. iframe 소스에 아래 문구를 추가해 줍니다.
style="filter: Alpha(Opacity=35);"
<iframe src="URL" width="넓이" height="높이" border="0" frameborder="0" style="filter: Alpha(Opacity=65);"></iframe>
2. Opacity=35 의 숫자는 불투명도 조절이므로 알아서 적당한 숫자를 넣어주세요.
| div 나 span 등에 tag에서 수직 정렬하기 (0) | 2015.07.17 |
|---|---|
| a 링크 테두리 점선 한번에 없애기 (0) | 2015.07.17 |
| 모바일로 접속시 모바일 홈페이지로 이동하는 태그 (0) | 2015.07.17 |
| 마우스 우클릭 방지 소스 (0) | 2015.07.17 |
| input태그 type의 종류.. (0) | 2015.07.17 |
모바일 디바이스 체크 소스
<!--헤드메인 - sytle 위에 붙여넣기 -->
<script type="text/javascript">
var pc_arr = location.href.split("=");
if(pc_arr[1] != "1")
{
var mobileKeyWords = new Array('iPhone', 'iPod', 'BlackBerry', 'Android', 'Windows CE', 'LG', 'MOT', 'SAMSUNG', 'SonyEricsson');
for (var word in mobileKeyWords){
if (navigator.userAgent.match(mobileKeyWords[word]) != null){
location.href = "http://hanbando.nemoweb.kr";
break;
}
}
}
</script>
<!-- location.href = "http://hanbando.nemoweb.kr"; 이줄에서 "모바일주소" 입력 -->
| a 링크 테두리 점선 한번에 없애기 (0) | 2015.07.17 |
|---|---|
| 아이프레임 iframe 배경 투명하게 만들기 (0) | 2015.07.17 |
| 마우스 우클릭 방지 소스 (0) | 2015.07.17 |
| input태그 type의 종류.. (0) | 2015.07.17 |
| 현재시간 보여주는 소스 (0) | 2015.07.17 |
<목차> 1. 마우스 오른쪽메뉴, 드래그, 선택복사 금지하기 7. 상태바의 링크 주소 감추기 8. 익스플로러 6의 이미지 도구모음(저장버튼 등) 뜨는 것 막기. 1. 마우스 오른쪽메뉴, 드래그, 선택복사 금지하기 | |
<body oncontextmenu='return false' ondragstart='return false' onselectstart='return false'> | |
oncontextmenu='return false' : 마우스 오른쪽 메뉴 금지 참고 onkeydown="return false" 키보드 완전 금지
| |
| 2. 마우스 오른쪽 버튼 클릭시 경고 메세지 | |
| <script language=Javascript>function click() {if ((event.button==2) || (event.button==2)) {alert('죄송합니다. 오른쪽 마우스 금지입니다. - 태그인넷 ');}}document.onmousedown=click// --></script> | |
3. 프레임 소스보기 막기 | |
| <script language="Javascript"> if(parent.frames.length <= 0) { top.location.href="http://tagin.net"; } </script> | |
프레임을 쓰는 홈페이지에서 프레임 페이지가 아닌 하위 프레임으로 직접 들어갔을 때 http://tagin.net으로 이동하는 예제입니다 | |
| 4. 새로고침(F5), 전체창(F11) 막기 | |
<scRIPT LANGUAGE="Javascript"> | |
| 5. shift, ctrl (쉬프트, 컨트롤)키 클릭하면 경고메세지 띄우기 | |
<script language="Javascript"> | |
| 6. 동영상 마우스 오른쪽 버튼 막기 | |
<embed src="http://tagin.net/js/1.wmv" EnableContextMenu="false" > <object classid='clsid:22D6F312-B0F6-11D0-94AB-0080C74C7E95' id='MediaPlayer1' width="580" height="387"> | |
| 동영상 태그(embed, object) 자세히 보기 | |
| 7. 상태바의 링크 주소 감추기 | |
<script language=Javascript> 다른 소스 <a href="http://tagin.net" onmouseover="self.status='태그인넷';return true" onmouseout="self.status=' 태그인넷';return true">링크 </a> <head> | |
8. 익스플로러 6의 이미지 도구모음(저장버튼 등) 뜨는 것 막기.
| |
| 9. 무단링크 금지 스크립트 | |
| <script language='Javascript'> //link1 과 link2 지정해 넣은 홈을 통해서 들어오지 않으면 무단링크 취급 기본홈페이지로 열리는 소스 var home_url="http://www.tagin.net"; // 기본 홈페이지 var link1="http://tagin.net/"; var link2="http://www.naver.com/"; if (document.referrer.indexOf(home_url)==-1 && document.referrer.indexOf(link1)==-1 && document.referrer.indexOf(link2)==-1) { if (document.referrer) { alert("무단링크 하셨습니다.!"); // 무단링크시 에러 메세지 window.location=home_url; // 기본 홈으로 이동 } else { alert("무단링크 하셨습니다. "); // 무단링크시 에러 메세지 window.location=home_url; // 기본 홈으로 이동 } } </script> |
| 아이프레임 iframe 배경 투명하게 만들기 (0) | 2015.07.17 |
|---|---|
| 모바일로 접속시 모바일 홈페이지로 이동하는 태그 (0) | 2015.07.17 |
| input태그 type의 종류.. (0) | 2015.07.17 |
| 현재시간 보여주는 소스 (0) | 2015.07.17 |
| 구글에서 웹문서 노출 많이 되게 하기 (0) | 2015.07.17 |
<input type="hidden" name="form1"> //숨김 타입입니다
<input type="text" name="form1" size="20" maxlength="15" style="background-color:purple;border-color:red;"> //일반 텍스트 표현방식 폼입니다
<input type="password" name="form1" size="20" maxlength="15" style="background-color:purple;border-color:red;"> //별표로 표현됩니다
<input type="button" value="일반버튼" style="background-color:purple;border-color:red;font-face:굴림;font-size:9pt;"> //일반 버튼입니다
<input type="reset" value="취소" style="background-color:purple;border-color:red;font-face:굴림;font-size:9pt;"> //취소버튼입니다
<input type="submit" value="전송" style="background-color:purple;border-color:red;font-face:굴림;font-size:9pt;"> //전송 버튼입니다
<input type="radio" name="radio1"> //라디오 버튼입니다
<input type="checkbox" name="checkbox1"> //체크박스 입니다
<input type="file"> //파일을 올릴때 씁니다
<input type="image" src="m1.gif"> //이미지를 보여줄때 씁니다
설명이 많이 부족하겠지만 조금할께욤 ^_^
input 는 말그대로 입력이란 뜻입니다 input type 이란건 입력할때 종류란 거겠죠?
그종류는 제가아는정도는 위에 설명 // 한데로 입니다
name 은 폼(입력방식)의 이름입니다
size 는 그폼의 크기이며 maxlength 는 내가 입력할 최대한의수를 말합니다
style 은 모양새를 말합니다 그종류로는
background-color 바탕색
border-color 선의색
font-face 혹은 font-family 폰트의 이름입니다
font-size 폰트의 크기이며 픽셀단위입니다
등등등이 있습니다....
| 모바일로 접속시 모바일 홈페이지로 이동하는 태그 (0) | 2015.07.17 |
|---|---|
| 마우스 우클릭 방지 소스 (0) | 2015.07.17 |
| 현재시간 보여주는 소스 (0) | 2015.07.17 |
| 구글에서 웹문서 노출 많이 되게 하기 (0) | 2015.07.17 |
| 이미지에 마우스 오른쪽 클릭시 경고창 띄우기 (0) | 2015.07.17 |
<!DOCTYPE html>
<html lang="ko-kr">
<head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta charset="UTF-8">
<title>시계</title>
<style type="text/css">
body,ul,li{
padding: 0;
margin:0;
}
a {
color: rgb(1, 124, 185);
text-decoration: none;
}
body{
font-size:16px;
color: #5a5d63;
background: #d6d7d9;
background: -webkit-radial-gradient(#eeefef, #d6d7d9);
background: -moz-radial-gradient(#eeefef, #d6d7d9);
background: -o-radial-gradient(#eeefef, #d6d7d9);
background: -ms-radial-gradient(#eeefef, #d6d7d9);
background: radial-gradient(#eeefef, #d6d7d9);
padding: 50px;
}
.box{
width: 540px;
height: 200px;
margin: 50px auto;
}
.box li{
position: relative;
text-align: center;
list-style-type: none;
display: inline-block;
width: 150px;
height:160px;
text-shadow:0 2px 1px #f4f4f4;
border:1px solid #9fa2ad;
border-radius: 5px;
margin-right:10px;
background: -webkit-gradient(linear,0 0, 0 100%,
color-stop(.2,rgba(248,248,248,.3)),
color-stop(.5,rgba(168,173,190,.5)),
color-stop(.51,rgba(168,173,190,.3)),
color-stop(.9,rgba(248,248,248,.2)));
background: -webkit-linear-gradient(top,rgba(248,248,248,.3) 20%,rgba(168,173,190,.5) 50%, rgba(168,173,190,.3) 51%, rgba(248,248,248,.2) 90%);
background: -moz-linear-gradient(top, rgba(248,248,248,.3) 20%, rgba(168,173,190,.5) 50%, rgba(168,173,190,.3) 51%, rgba(248,248,248,.2) 90%);
background: -o-linear-gradient(top, rgba(248,248,248,.3) 20%, rgba(168,173,190,.5) 50%, rgba(168,173,190,.3) 51%, rgba(248,248,248,.2) 90%);
background: -ms-linear-gradient(top, rgba(248,248,248,.3) 20%, rgba(168,173,190,.5) 50%, rgba(168,173,190,.3) 51%, rgba(248,248,248,.2) 90%);
background: linear-gradient(top, rgba(248,248,248,.3) 20%, rgba(168,173,190,.5) 50%, rgba(168,173,190,.3) 51%, rgba(248,248,248,.2) 90%);
box-shadow:inset 0 -2px 0 #f1f1f1,0 1px 0 #f1f1f1,0 2px 0 #9fa2ad,0 3px 0 #f1f1f1,0 4px 0 #9fa2ad;
}
.box li:before,
.box li:after{
display: block;
content: "";
position: absolute;
width: 150px;
}
.box li:before{
top:50%;
height: 1px;
box-shadow: 0 1px 0 #868995,0 2px 1px #fff;
}
.box li:after{
bottom: -65px;
height: 60px;
border-radius:0 0 5px 5px;
background: -webkit-gradient(linear,0 0,0 100%,from(rgba(0,0,0,.1)),to(rgba(0,0,0,0)));
background: -webkit-linear-gradient(top,rgba(0,0,0,.1),rgba(0,0,0,0));
background: -moz-linear-gradient(top,rgba(0,0,0,.1),rgba(0,0,0,0));
background: -o-linear-gradient(top,rgba(0,0,0,.1),rgba(0,0,0,0));
background: -ms-linear-gradient(top,rgba(0,0,0,.1),rgba(0,0,0,0));
background: linear-gradient(top,rgba(0,0,0,.1),rgba(0,0,0,0));
z-index: 1
}
.box li span:first-child{
font:120px 'BitstreamVeraSansMonoBold';
color: #52555a;
display: block;
height: 130px;
line-height: 150px;
}
@font-face {
font-family: 'BitstreamVeraSansMonoBold';
src: url('VeraMono-Bold-webfont.eot');
src: url('VeraMono-Bold-webfont.eot?#iefix') format('embedded-opentype'),
url('VeraMono-Bold-webfont.woff') format('woff'),
url('VeraMono-Bold-webfont.ttf') format('truetype'),
url('VeraMono-Bold-webfont.svg#BitstreamVeraSansMonoBold') format('svg');
font-weight: normal;
font-style: normal;
}
</style>
</head>
<body>
<br>
<div class="box">
<ul>
<li><span id="hour"></span><span>Hours</span></li>
<li><span id="minute"></span><span>Minutes</span></li>
<li><span id="second"></span><span>Seconds</span></li>
</ul>
</div>
<script>
var hour=document.getElementById('hour');
var minute=document.getElementById('minute');
var second=document.getElementById('second');
function showTime(){
var oDate=new Date();
var iHours=oDate.getHours();
var iMinute=oDate.getMinutes();
var iSecond=oDate.getSeconds();
hour.innerHTML=AddZero(iHours);
minute.innerHTML=AddZero(iMinute);
second.innerHTML=AddZero(iSecond);
}
showTime();
setInterval(showTime,1000);
function AddZero(n){
if(n<10){
return '0'+n;
}
return ''+n;
}
</script>
</body>
</html>
| 마우스 우클릭 방지 소스 (0) | 2015.07.17 |
|---|---|
| input태그 type의 종류.. (0) | 2015.07.17 |
| 구글에서 웹문서 노출 많이 되게 하기 (0) | 2015.07.17 |
| 이미지에 마우스 오른쪽 클릭시 경고창 띄우기 (0) | 2015.07.17 |
| 페이지 자동이동 소스 모음 (0) | 2015.07.16 |
사이트에 연관된 도메인을 최대한 많이 구합니다.
sir를 예를 들면
기본 도메인은 sir.co.kr
sir.com
sir.net
sir.org
sir.kr
sir.info
sir.biz
등등을 사서 도메인을 연결합니다.
각각의 도메인이 구글 로봇에게 크롤링이 될 수 있도록 색인 목록에 사이트를 추가합니다.
http://www.google.co.kr/addurl/?continue=/addurl
여기까지만 해도 되지만 더 효과적으로 이용하시려면 구글 웹마스터 도구에서 도메인들을 추가 한뒤 사이트맵 제출 하는 것도 좋습니다.
이젠 구글로봇이 웹문서를 수집 할 때까지 기다리시면 됩니다.
접속자현황에 구글로봇의 접속이 늘어나면 적용이 잘 되고 있다는 겁니다.
이후에 사이트에 올라온 게시물 제목을 하나 복사해서 구글에서 검색하면 이렇게 된 결과를 보실 수 있습니다.
웹문서
검색한 게시물 제목
www.sir.co.kr
검색한 게시물 제목
m.sir.co.kr
검색한 게시물 제목
www.sir.com
검색한 게시물 제목
www.sir.net
===========================================
어제 구글에서 검색하다가 발견한 내용입니다.
사용하는 도메인이 .net인데 .kr과 모바일 사이트인 m.도메인.net 의 3개의 동일한 웹문서가 1,2,3번째에 나란히 노출 되더군요.
국내 검색엔진에도 적용이 되는지 아직 테스트는 못해봤습니다.
구글은 따로 사이트 등록을 안해도 알아서 도메인을 잘 찾아서 긁어가지만 국내 검색엔진은 보조도메인으로 검색되는 결과가 하나도 없더군요.
일단 보조도메인들을 크롤링목록에 추가해달라고 요청을 해놨는데 결과를 기다려봐야 할 듯.
| input태그 type의 종류.. (0) | 2015.07.17 |
|---|---|
| 현재시간 보여주는 소스 (0) | 2015.07.17 |
| 이미지에 마우스 오른쪽 클릭시 경고창 띄우기 (0) | 2015.07.17 |
| 페이지 자동이동 소스 모음 (0) | 2015.07.16 |
| 검색엔진최적화를 위한 제목 태그(Heading tags) 총정리 (0) | 2015.07.15 |
| 현재시간 보여주는 소스 (0) | 2015.07.17 |
|---|---|
| 구글에서 웹문서 노출 많이 되게 하기 (0) | 2015.07.17 |
| 페이지 자동이동 소스 모음 (0) | 2015.07.16 |
| 검색엔진최적화를 위한 제목 태그(Heading tags) 총정리 (0) | 2015.07.15 |
| 국내 HTML5 시장 본격 개화기 (0) | 2015.07.14 |
clock.html