CSS3快速上手之18：图片的格式操作
来源：互联网 发布：淘宝店铺logo免费设计 编辑：程序博客网 时间：2024/05/16 13:06
1.代码：
<!DOCTYPE html><html><head><meta charset="utf-8"> <title>网页title</title> <style>/*---范例1：设定圆角---*/.c1 { border-radius: 8px;}/*---范例2：设定椭圆形---*/.c2 { border-radius: 50px;}/*---范例3：创建缩略图---*/.c3 { border: 1px solid #ddd; border-radius: 4px; padding: 5px;}</style></head><body><h2>范例1：圆角图片</h2><img class="c1" src="paris.jpg" alt="Paris" width="200" height="150"><h2>范例2：椭圆形图片</h2><img class="c2" src="paris.jpg" alt="Paris" width="200" height="150"><h2>范例3：创建缩略图同时作为连接</h2><a target="_blank" href="paris.jpg"><img class="c3" src="paris.jpg" alt="Paris" width="80" height="60"></a></body></html>2.本范例所需的素材：(paris.jpg)
3.结果：
0 0
- CSS3快速上手之18：图片的格式操作
- CSS3快速上手之1：语法格式
- CSS3快速上手之19：响应式图片与文本
- CSS3快速上手之21：响应式+图片滤镜
- CSS3快速上手之2：边框的使用
- CSS3快速上手之3：边框的圆角
- CSS3快速上手之4：多重背景
- CSS3快速上手之5：线性渐变
- CSS3快速上手之9：文字效果
- CSS3快速上手之10：图文效果
- CSS3快速上手之11：图文卡片
- CSS3快速上手之15：动画
- CSS3快速上手之16：column
- CSS3快速上手之17：用户介面
- CSS3快速上手之20：响应式卡片与图片模态框
- CSS3快速上手之6：线性渐变+各种分布
- CSS3快速上手之7：线性渐变+各种分布
- CSS3快速上手之8：径向渐变+各种重复
- Codeforces 691E Xor-sequences【矩阵快速幂，好题】
- 分布式理论之一：Paxos算法的通俗理解
- Burp Suite出了一个类似cloudeye.me的功能
- lnmp下配置PHP虚拟主机vhost
- 用Meta标签代码让360双核浏览器默认极速模式打开网站不是兼容模式
- CSS3快速上手之18：图片的格式操作
- 一些安全软件
- Jersey_Client程序的编写和运行
- Makefile详解
- 走迷宫问题
- matrix2
- Arduino实例1-hello world！
- 去哪儿2017校园招聘笔试题
- 运维笔记7（文件的归档与压缩，linux网络配置 更新：ssh服务配置文件，网络配置的四个方法
