利用CSS设计图像样式

最新推荐文章于 2024-09-14 15:29:41 发布

冯晓如

最新推荐文章于 2024-09-14 15:29:41 发布

阅读量607

点赞数

分类专栏： Web前端文章标签：设计图像样式

本文链接：https://blog.csdn.net/honeygirl_/article/details/102809204

版权

本文介绍了如何使用CSS来设计图像样式，包括定义图像大小、边框、不透明度、圆角特效和阴影效果，提供了具体的代码示例，帮助读者掌握CSS图像样式的设置方法。

摘要由CSDN通过智能技术生成

设计图像样式

一、定义图像大小：
二、定义图像边框：
三、定义不透明度：
opacity:0-1
/取值范围是0-1值越小，透明度越高，0为完全透明/
四、定义圆角特效：
五、定义阴影特效：

代码如下：

<html>
    <head>
        <style type='text/css'>
            /*.w200{
                /*定义控制图像高度的类样式*/
                height:400px;
                border:solid 1px red;       /*定义一个边框*/
                /*图像的边框样式*/
                b
                }
                */
            div{
                /*定义固定大小的包含框*/
                height:400px;    /*固定高度*/
                width:50%;      /*定义一个弹性宽度*/
                border:dashed;  /*用虚线点定义图像边框*/
            }
            img{
                /*图像边框样式*/
                width: 100px;
                border: solid green 150px;
                background-color:red blue green yellow;  /*顶边红色，右边蓝色，底边绿色，左边黄色*/
            }
           .op