网页设计 百分网手机站

HTML5中你如何使用CSS建立不可选的文字

时间:2020-11-11 19:18:39 网页设计 我要投稿

HTML5中你如何使用CSS建立不可选的文字

  导语:HTML5的功能已经越来越完善了,用CSS实现建立不可选的文字,已经不是什么问题了。下面的是百分网小编为大家搜集的`在HTML5中你如何使用CSS建立不可选的文字方法,希望能帮到你。

  代码如下:

  <!DOCTYPE HTML>

  <html>

  <head>

  <title>Creating non-selectable text using CSS</title>

  <style type="text/css">

  p {

  margin-bottom: 20px;

  padding: 10px;

  background: rgba(10%, 10%, 10%, 0.3);

  -moz-border-radius: 15px;

  border-radius: 15px;

  }

  p#d2 {

  -moz-user-select: none;

  -khtml-user-select: none;

  user-select: none;

  font-style: italic;

  }

  </style>

  </head>

  <body>

  <p id="d1">[selectable] Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur ornare, urna placerat condimentum vehicula, magna est suscipit leo, auctor laoreet erat massa eget tellus. Etiam pharetra, orci eu gravida tempus, enim est venenatis diam, id facilisis justo ante ut arcu. Sed nibh eros, porta ac porta ac, fermentum ut ante. Etiam pulvinar consectetur urna sit amet fermentum. Aliquam quis pellentesque tortor. In ut lobortis enim. Pellentesque luctus orci nec massa lacinia consectetur. Etiam cursus, leo et pellentesque tempus, diam elit interdum ipsum, sed pulvinar nibh justo vel urna. Phasellus ligula elit, sodales eget aliquet et, ullamcorper ut lorem. Praesent eget quam id ligula iaculis tincidunt eu et nulla. Ut dui dui, dictum sed lobortis eu, porta nec urna. In adipiscing, massa sed scelerisque elementum, tortor massa cursus velit, ut tincidunt mi lacus id magna. Morbi vestibulum venenatis massa sit amet convallis. Aliquam erat volutpat.</p>

  <p id="d2">[non selectable] Nam a lacus ante, a tincidunt dolor. Sed felis dolor, ullamcorper vitae luctus at, iaculis eu dui. Mauris ullamcorper nisl id tortor elementum mattis. Aenean ut ligula ac ipsum pharetra dapibus. Praesent convallis tincidunt ligula sit amet adipiscing. Morbi massa mauris, mollis ornare mollis ut, imperdiet nec nibh. Praesent sollicitudin tellus at nisl sodales lobortis euismod purus laoreet. Vivamus nec urna vel nibh volutpat rhoncus quis eget justo. Donec mi lacus, dapibus nec tristique eu, fringilla id mi. Maecenas vitae odio a tortor cursus fermentum eu eget eros. Vestibulum sit amet metus purus. Integer vestibulum sem nec justo facilisis tempor non sit amet justo. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras eget mattis metus.</p>

  <p id="d3">[selectable] Proin lacinia sem fringilla est lacinia facilisis. Praesent turpis massa, bibendum eu ultrices ut, viverra vitae quam. Morbi a lorem mi, eget congue arcu. Sed dapibus molestie neque, eget tempus nibh viverra at. Praesent sit amet vestibulum ipsum. Donec in lectus ac urna accumsan feugiat. Sed at nunc felis. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Duis nec ipsum justo. Nullam laoreet enim vel quam tincidunt imperdiet. Maecenas sollicitudin nulla a metus ornare tempus. Nullam rhoncus fermentum lorem id pellentesque.</p>

  </body>

  </html>

【HTML5中你如何使用CSS建立不可选的文字】相关文章:

1.wps文字如何使用并打功能

2.网页设计中的文字如何设计

3.WPS文字中编号使用全攻略

4.盘点Dreamweaver使用CSS的注意事项

5.Dreamweaver中应用CSS的技巧

6.excel中rank函数如何使用

7.如何在wps文字中使用大括号小括号

8.使用CSS3创建卓越的网站设计

9.网页设计中的文字长度如何控制