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