关灯
开启左侧

[网页制作] 在html5中你如何使用css建立不可选的文字

[复制链接]
swmozowtfl 发表于 2015-7-31 22:03:51 | 显示全部楼层 |阅读模式 打印 上一主题 下一主题
 
代码如下:
<!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>

更多网页制作信息请查看: 网页制作
 

精彩评论8

正序浏览
mwxny 发表于 2016-2-14 10:18:22 | 显示全部楼层
 
楼主说的是什么?我是小白,好像还没看明白!
 
bqtklouu 发表于 2016-2-14 10:18:41 | 显示全部楼层
 
要不我崇拜你?行吗?
 
bqtklouu 发表于 2016-2-14 10:19:21 | 显示全部楼层
 
这篇帖子构思新颖,题材独具匠心,段落清晰,情节诡异,跌宕起伏,主线分明,引人入胜,平淡中显示出不凡的文学功底,可谓是字字珠玑,句句经典,是我辈应当学习之典范(不好意思回错帖了
 
wwzcdenleclv 发表于 2016-2-14 10:19:52 | 显示全部楼层
 
晕倒`````不要造我的谣言哦~~小心我打你pp~~嘿嘿~~~~
 
seazvyt 发表于 2016-3-14 13:42:36 | 显示全部楼层
 
先踹你一脚再说~~~~~~
 
wwzcdenleclv 发表于 2016-3-14 13:42:36 | 显示全部楼层
 
你你你你 呵呵~~~~别这样哦.....
 
Acropozelan 发表于 2016-3-14 13:43:04 | 显示全部楼层
 
哈哈~` 好久没有笑喽~
 
bqtklouu 发表于 2016-3-14 13:43:08 | 显示全部楼层
 
终于看完了~~~
 
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则


0关注

1粉丝

2503帖子

热门图文
热门帖子
排行榜
作者专栏

关注我们:微信订阅号

官方微信

APP下载

全国服务Q Q:

956130084

中国·湖北

Email:956130084@qq.com

Copyright   ©2015-2022  站长技术交流论坛|互联网技术交流平台Powered by©Discuz!技术支持:得知网络  

鄂公网安备 42018502006730号

  ( 鄂ICP备15006301号-5 )