はじめに
この実験では、CSS プログラミングに深く入り、user-select プロパティを調べます。この実験の目的は、Web ページ内の特定の要素の選択を無効にする方法を教えることで、ユーザーがコンテンツをコピーすることを防ぐのに役立ちます。この実験が終了するとき、user-select プロパティの使い方とその Web デザインへの影響について、より深く理解するようになります。
これは Guided Lab です。学習と実践を支援するためのステップバイステップの指示を提供します。各ステップを完了し、実践的な経験を積むために、指示に注意深く従ってください。過去のデータによると、この 初級 レベルの実験の完了率は 88%です。学習者から 100% の好評価を得ています。
選択を無効にする
VM には既に index.html と style.css が用意されています。
要素のコンテンツを選択不可能にするには、セレクターに CSS プロパティ user-select: none を追加します。ただし、この方法はユーザーがコンテンツをコピーすることを防ぐために完全に安全ではありません。
例：
<p>You can select me.</p>
<p class="unselectable">You can't select me!</p>
.unselectable {
user-select: none;
}
右下隅の「Go Live」をクリックして、ポート 8080 で Web サービスを実行してください。その後、Web 8080 タブを更新して Web ページをプレビューできます。
まとめ
おめでとうございます！選択を無効にする実験を完了しました。技術力を向上させるために、LabEx でさらに多くの実験を行って練習してください。