返回顶部
首页 > 资讯 > 前端开发 > html >如何在HTML5中如何使用CSS建立不可选的文字
  • 685
分享到

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

2024-04-02 19:04:59 685人浏览 八月长安
摘要

本篇内容介绍了“如何在HTML5中如何使用CSS建立不可选的文字”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情况吧!希望大家仔细阅读,能够学有所

本篇内容介绍了“如何在HTML5中如何使用CSS建立不可选的文字”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情况吧!希望大家仔细阅读,能够学有所成!

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

代码如下:


<!DOCTYPE HTML>
<html>
<head>
<title>Creating non-selectable text using CSS</title>
<style type="text/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;
}
</style>
</head>
<body>
<div 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.</div>
<div 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.</div>
<div 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.</div>
</body>
</html>

“如何在HTML5中如何使用CSS建立不可选的文字”的内容就介绍到这里了,感谢大家的阅读。如果想了解更多行业相关的知识可以关注编程网网站,小编将为大家输出更多高质量的实用文章!

--结束END--

本文标题: 如何在HTML5中如何使用CSS建立不可选的文字

本文链接: https://lsjlt.com/news/76090.html(转载时请注明来源链接)

有问题或投稿请发送至: 邮箱/279061341@qq.com    QQ/279061341

猜你喜欢
  • 如何在HTML5中如何使用CSS建立不可选的文字
    本篇内容介绍了“如何在HTML5中如何使用CSS建立不可选的文字”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情况吧!希望大家仔细阅读,能够学有所...
    99+
    2024-04-02
  • 怎么在HTML5中使用CSS建立不可选的文字
    本篇内容主要讲解“怎么在HTML5中使用CSS建立不可选的文字”,感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷,实用性强。下面就让小编来带大家学习“怎么在HTML5中使用CSS建立不可选的文字”吧! ...
    99+
    2024-04-02
  • 如何设置css文本不可选中
    这篇文章主要介绍如何设置css文本不可选中,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完! css文本不可选中的设置方法:1、创建一个HTML示例文件;2、...
    99+
    2024-04-02
  • css中如何禁止选中文字
    这篇文章给大家分享的是有关css中如何禁止选中文字的内容。小编觉得挺实用的,因此分享给大家做个参考,一起跟随小编过来看看吧。css的基本语法是什么css的基本语法是:1、css规则由选择器和一条或多条声明两个部分构成;2、选择器通常是需要改...
    99+
    2023-06-14
  • 如何在HTML5中引入css和选择器
    今天就跟大家聊聊有关如何在HTML5中引入css和选择器,可能很多人都不太了解,为了让大家更加了解,小编给大家总结了以下内容,希望大家根据这篇文章可以有所收获。什么是csscss是一种用来表现HTML或XML等文件样式的计算机语言,主要是用...
    99+
    2023-06-05
  • 如何在html5中设置文字的颜色
    如何在html5中设置文字的颜色?很多新手对此不是很清楚,为了帮助大家解决这个难题,下面小编将为大家详细讲解,有这方面需求的人可以来学习下,希望你能有所收获。html是什么html的全称为超文本标记语言,它是一种标记语言,包含了一系列标签....
    99+
    2023-06-06
  • postMessage如何在HTML5中使用
    本篇文章为大家展示了postMessage如何在HTML5中使用,内容简明扼要并且容易理解,绝对能使你眼前一亮,通过这篇文章的详细介绍希望你能有所收获。页面内嵌套iframe,与iframe的消息传递页面与多个页面之间的传递消息针对这些令人...
    99+
    2023-06-09
  • 如何在HTML5中使用weui
    如何在HTML5中使用weui?很多新手对此不是很清楚,为了帮助大家解决这个难题,下面小编将为大家详细讲解,有这方面需求的人可以来学习下,希望你能有所收获。按钮<a href="javascript:;"...
    99+
    2023-06-09
  • 如何在Html5中使用mandMobile
    如何在Html5中使用mandMobile?很多新手对此不是很清楚,为了帮助大家解决这个难题,下面小编将为大家详细讲解,有这方面需求的人可以来学习下,希望你能有所收获。1. 首先安装npm i mand-mobile&n...
    99+
    2023-06-09
  • 如何在HTML5中使用WebSocket
    本篇文章给大家分享的是有关如何在HTML5中使用WebSocket,小编觉得挺实用的,因此分享给大家学习,希望大家阅读完这篇文章后可以有所收获,话不多说,跟着小编一起来看看吧。客户端代码:<html><head>&l...
    99+
    2023-06-09
  • 如何使用max-height来建立纯CSS的滑块
    这篇文章给大家分享的是有关如何使用max-height来建立纯CSS的滑块的内容。小编觉得挺实用的,因此分享给大家做个参考,一起跟随小编过来看看吧。使用 max-height 来建立纯 CSS 的滑块max-height...
    99+
    2023-06-27
  • CSS中如何应用user-select禁止文字选择
    这篇文章主要讲解了“CSS中如何应用user-select禁止文字选择”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“CSS中如何应用user-select禁...
    99+
    2024-04-02
  • Shell中如何建立并使用临时性文件
    这篇文章给大家分享的是有关Shell中如何建立并使用临时性文件的内容。小编觉得挺实用的,因此分享给大家做个参考,一起跟随小编过来看看吧。虽然使用管道可以省去建立临时性文件的需求,不过有时候临时性文件还是派的上用场的。UNIX不同于其他操作系...
    99+
    2023-06-09
  • 如何在HTML5中使用Geolocation API
    这期内容当中小编将会给大家带来有关如何在HTML5中使用Geolocation API,文章内容丰富且以专业的角度为大家分析和叙述,阅读完这篇文章希望大家可以有所收获。Geolocation是HTML5标准下的一个Web API,利用它可以...
    99+
    2023-06-09
  • Linux中如何使用ln命令在文件之间建立连接
    这篇文章主要介绍“Linux中如何使用ln命令在文件之间建立连接”,在日常操作中,相信很多人在Linux中如何使用ln命令在文件之间建立连接问题上存在疑惑,小编查阅了各式资料,整理出简单好用的操作方法,希望对大家解答”Linux中如何使用l...
    99+
    2023-06-12
  • css中如何使用选择器
    这篇文章将为大家详细讲解有关css中如何使用选择器,文章内容质量较高,因此小编分享给大家做个参考,希望大家阅读完这篇文章后对相关知识有一定的了解。代码如下:header>  <nav ...
    99+
    2024-04-02
  • 如何在HTML5中使用video实现视频字幕
    这篇文章将为大家详细讲解有关如何在HTML5中使用video实现视频字幕,文章内容质量较高,因此小编分享给大家做个参考,希望大家阅读完这篇文章后对相关知识有一定的了解。HTML5允许我们使用 元素为视频指定字幕。这个元素的各种属性允许我们指...
    99+
    2023-06-09
  • 如何使用Css实现鼠标移动时禁止选中文字
    这篇文章主要介绍了如何使用Css实现鼠标移动时禁止选中文字,具有一定借鉴价值,感兴趣的朋友可以参考下,希望大家阅读完这篇文章之后大有收获,下面让小编带着大家一起了解一下。这是通过CSS样式来实现的禁止用鼠标...
    99+
    2024-04-02
  • 如何在CSS中使用visited伪类选择器
    如何在CSS中使用visited伪类选择器?相信很多没有经验的人对此束手无策,为此本文总结了问题出现的原因和解决方法,通过这篇文章希望你能解决这个问题。首字母连起来是LVHA,顺序完全符合love-hate,也就是爱恨,所谓由爱生恨,这样顺...
    99+
    2023-06-08
  • 如何在JavaScript中使用可选链操作符
    这篇文章将为大家详细讲解有关如何在JavaScript中使用可选链操作符,文章内容质量较高,因此小编分享给大家做个参考,希望大家阅读完这篇文章后对相关知识有一定的了解。可选链操作符(.)语法obj.propobj.[expr]func.(a...
    99+
    2023-06-15
软考高级职称资格查询
推荐阅读
编程网,编程工程师的家园,是目前国内优秀的开源技术社区之一,形成了由开源软件库、代码分享、资讯、协作翻译、讨论区和博客等几大频道内容,为IT开发者提供了一个发现、使用、并交流开源技术的平台。
  • 官方手机版

  • 微信公众号

  • 商务合作