本文介绍了Web前端开发中的CSS精灵技术，解释了如何利用CSS精灵减少图片请求并提高页面加载速度。接着探讨了CSS圆角的使用，包括不同类型的圆角设置。此外，还讲解了引用标签如`blockquote`、`q`等的作用。接着，讨论了`iframe`的用处，如数据传输和局部刷新。然后，提到了`map`和`area`在图像映像中的应用，以及如何定义区域。最后，详细阐述了`audio`和`video`标签的使用，包括如何添加控件和实现跨浏览器兼容。
Web前端开发笔记-----14.css精灵、css圆角、引用标签、iframe嵌套页面、map与area、audio与video
文章目录
一、css精灵
Css Sprite
特性：
CSS雪碧也叫做CSS精灵，是一种网页图片应用处理方式。它允许你将一个页面涉及到的所有零星图片都包含到一张大图中去加载。
好处：
可以减少图片的质量，网页的图片加载速度快
减少图片的请求的次数，加快网页的打开
利用背景的定位:
background:url() no-repeat left/right -xxxpx;
二、css圆角
border-radius
圆的设置：border-radius:50%;
复合样式：border-radius:10px 20px; 左上右下 右上左上
border-radius:10px 20px 30px 40px; 左上 右上 右下 左下
椭圆的设置：border-radius:20px / 40px;
半圆的设置：border-radius:50% 50% 0 0；
三、引用标签
blockquote：引用大段的段落解释
q：引用小段的段落解释
abbr：缩写或首字母缩略词
address
最低0.47元/天 解锁文章
2093
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
