【簡単】CSSでブログやサイトの画像・文章をコピーをできなくする方法

ブログやサイトを運営していくなかで悩まされるのが、無断転載。

ブログやサイトが大きくなればなるほど無断転載されるリスクも高くなってきます。

無断転載はもちろん法律違反です。

しかし実際のところ無断転載をされても見過ごすしか方法はありません。

そこで今回の記事では、無断転載を予め防止する手段としてCSSで本文や画像のコピーをできなくする方法を紹介します。

コピーを禁止するCSS

※以下で紹介しているコードはブラウザによって正常に機能しない場合があります。

サイト全体のコピーを禁止

body{ user-select:none; 
 -webkit-user-select:none;    
 -ms-user-select: none;  
 -moz-user-select:none;
 -khtml-user-select:none;
 -webkit-user-drag:none;
 -khtml-user-drag:none; }

文章のみコピーを禁止

p{ user-select:none; 
 -webkit-user-select:none;    
 -ms-user-select: none;  
 -moz-user-select:none;
 -khtml-user-select:none;
 -webkit-user-drag:none;
 -khtml-user-drag:none; }

pの他にulやolなどもお好みで付け加えてください。

画像のみコピーを禁止

img {pointer-events: none;}