下面的例子展示了在HTML5中你如何使用CSS建立不可选的文字。

Creating non-selectable text using CSS

div {

margin-bottom: 20px;

padding: 10px;

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

-moz-border-radius: 15px;

border-radius: 15px;

}

div#d2 {

-moz-user-select: none;

-khtml-user-select: none;

user-select: none;

font-style: italic;

}

[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.
[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.
[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.

css 文字可选,在HTML5中如何使用CSS建立不可选的文字相关推荐

  1. [css] 如何清除在项目中无用的css代码呢?

    [css] 如何清除在项目中无用的css代码呢? 1.IDE中,会对没有使用到的样式,自己进行检测,删除时候,还需要手动删除. 2.webpack中,有基于消除无用css的插件(purifycss-w ...

  2. webpack 打包html中css样式如果处理,webpack中单独打包css样式

    这次给大家带来webpack中单独打包css样式,webpack中单独打包css样式的注意事项有哪些,下面就是实战案例,一起来看一下. 零.介绍 以下是个人项目中总结出来的一些基本知识,记录在这里,加 ...

  3. html5中怎么让文字旋转动画效果图,HTML5中实现的CSS 3D文字旋转动画

    一个基于HTML5的网页文字3D旋转动画效果,支持中文和英文字符,浏览请注意要使用支持CSS3技术的浏览器,比如Opera.Chrome等,主要结合transition 和 animation来实现, ...

  4. Html5中的徽章,CSS 常见样式 特殊用法 贯穿线徽章箭头

    ### 贯穿渐变线,中间插值 - 如图: > ![在这里插入图片描述](https://img-blog.csdnimg.cn/20190427200554843.png) ![在这里插入图片描 ...

  5. php框架 css文件引用,yii框架中怎么引入css文件

    一.我们在shop目录下的assets目录下面创建一个文件目录(我以default为例),在default下面创建一个css文件目录,将我们的css文件直接放在该目录下面. 二.我们在shop目录下面 ...

  6. WEB网页设计中的DIV+CSS入门(转自:中国站长在线网)

    CSS是Cascading Style Sheets(层叠样式表)的缩写.是一种对web文档添加样式的简单机制,属于表现层的布局语言. 一.基本语法规范 分析一个典型CSS的语句: p {COLOR: ...

  7. html5中的css特性,浅谈HTML5 CSS3的新交互特性

    本文标题的这副图片,是用phosotshop制作的.但是,在搜索引擎中你却无法搜索到它,搜索引擎还没有强大到能够识别图片里面的文字.并且由于图片的体积不算太小,可能网速慢的网友在浏览的时候不得不耐心的 ...

  8. CSS中的长度单位和HTML5中多媒体标签的使用

    CSS中的长度单位和HTML5中多媒体标签的使用 第一部分.长度单位 1.基本长度单位 2.长度单位的换算 第二部分.vw.vh.vmin.vmax 1.vw.vh.vmin.vmax的含义 2.vw ...

  9. HTML5中input输入框默认提示文字向左向右移动

    HTML5中input输入框默认提示文字向左向右移动 首先演示input输入框代码 <style>* {margin: 0;padding: 0;}.sousuo {width: 458p ...

最新文章

  1. shell中大于、等于、小于
  2. loj6300 「CodePlus 2018 3 月赛」博弈论与概率统计
  3. [HNOI2015]接水果
  4. 初学Java Web(6)——JSP学习总结
  5. 深入了解数据分析丨《精益数据分析》超详细读书笔记
  6. B10_NumPy数组操作、修改数组形状、翻转数组、修改数组维度、连接数组、分割数组、数组元素的添加与删除
  7. hive工作中分享总结
  8. android音乐进度条设计代码,【Android】Android开发实现进度条效果,SeekBar的简单使用。音量,音乐播放进度,视频播放进度等...
  9. 虎牙联合河北省反诈中心推出“青少年反诈教育公开课”
  10. 30岁学编程python_我30岁了,转行学编程可以吗? 排除法告诉你答案
  11. 华为最强AI芯片麒麟980发布:全球首款7nm手机芯片,双核NPU,6项世界第一
  12. 进阶06 List集合
  13. 您操作系统的msxml组件版本过低_Fuchsia OS –未来的Google操作系统?
  14. 区块链:数字广告假量的“终结者”
  15. Tapping and Tripping with NFC 基于NFC手机的公共交通票据系统
  16. 香港各个大学计算机类专业
  17. 依分布收敛、依概率收敛、均方收敛、几乎处处收敛
  18. ubuntu18.04+opencv3.4.10+opencv3.4.10contrib+LSD使用
  19. 2020算法提前批_2020年网页设计的极大沉默,算法可理解性的ni灭
  20. 深入目标检测原理学习笔记1

热门文章

  1. 解决android4.0系统中菜单(Menu)添加Icon无效问题
  2. Struts2国际化——完整实例代码
  3. 利用ssh-copy-id无需密码登录远程服务器
  4. nginx缓存页面后,串会话问题的解决方案(转)
  5. 常用功能-删除功能测试点
  6. win10 python3.5.2环境下 安装xgboost
  7. php 基础入门篇之前言
  8. asp.net mvc 过滤器
  9. Asset Store 下载的package存在什么地方?
  10. elipse手机设备显示Target unknown或者offline解决方法