- 您现在的位置：
- 首页
- >
- 文档
- >
- IT计算机
- >
- CSS与Script
HTML5基础教程-CSS3中的content和attr的用法
- 上传者：study
- 文件大小：24 (KB)
- 文档格式：.docx
文档分类: CSS与Script
关于本文
- 本文标题：HTML5基础教程-CSS3中的content和attr的用法.docx
- 链接地址：https://www.shanxuedoc.com/item/11278.html
- 内容摘要：CSS3中的content和attr的用法CSS3的出现使得样式表的功能变得越来越强大，而某种意义上也可以说它让我们开发起来越来越容易了。CSS3里虽然有很多重量级的新特征出现——例如traitioanimatio和traforms，但有一个特征虽然不是那么抢眼，但却是非常的有用，它就是content和attr表达式，它们能在你的页面下面悄悄的使用CSS来生成内容，下面让我们看看 attr 和 content 如何相互配合产生神奇效果的。基本content用法content属性能让程序员使用CSS往页面元素里填写内容：。myDiv:after{content:我是一个使用content属性生产的静态文字}请注意，如果想让伪元素:after绝对定位，你必须对你的div设置position:relative。content 和 attr 配合使用如果你不想把content内容在CSS里写死，那你可以使用attr表达式来从页面元素中动态的获取内容：divdataline=1divdiv[dataline]:after{content:attr(dataline)属性名称上不要加引号！}attr属性通常和自定义属性data配合使用，因为传统的其它属性虽然也能存值，但通常不适合存放表达性文字。content里的字符串连接操作这种字符串连接很像常规编程语言了：divdataline=1divdiv[dataline]:after{content:[lineattr(dataline)]}还需要用JavaScript里拼装字符串吗？CSS3里就能完成这些，是不是感觉CSS3可以部分的替代Javascript了！ attr的动态生成页面内容的能力着实是一件让人兴奋的事情。你实际上可以用它配合content对页面的很多其他元素和属性进行操作。
- 版权声明：
1、本站所有资源如无特殊说明，都需要本地电脑安装OFFICE2007和PDF阅读器，压缩文件请下载最新的WinRAR软件解压。
2、本站的文档不包含任何第三方提供的附件图纸，如果需要附件，请联系上传者，文件的所有权益归上传用户所有。
3、未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
4、善学网仅提供信息存储空间，仅对用户上传内容的表现方式做保护处理，对用户上传分享的文档内容本身不做任何修改或编辑，并不能对任何下载内容负责。
5、下载文件中如有侵权或不适当内容，请与我们联系，我们立即纠正。
6、本站不保证下载资源的准确性、安全性和完整性，同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。
-小月博客_hntidu_1.Jpeg?v=637787161810271352 "从零学习前端开发之-—-CSS3基础与加强(3)-小月博客")
