CSS_给img元素添加边框

最新推荐文章于 2024-07-26 08:00:00 发布

目标是什么呢

最新推荐文章于 2024-07-26 08:00:00 发布

阅读量6k

点赞数 1

分类专栏： CSS 文章标签： CSS

本文链接：https://blog.csdn.net/Mantinyu/article/details/97612892

版权

CSS 专栏收录该内容

1 篇文章 0 订阅

订阅专栏

缘由

在w3cschool上学习css相关的知识，小测验如下：

创建一个名为thick-green-border 类
将这个类应用在img元素中，为img元素周围添加一个10px的实心绿色边框
为类名为thick-green-border元素的顶部和左侧margin设置为40px ，底部设置为-10px，右侧设置为20px
为其设置顶部padding20px

问题

早晨写的时候，img的边框死活出不来，中午用了两个类，一个设置边框的属性，一个添加边框，出来了；后来把两个类的代码合并到thick-green-border类中，又成功了…
总之挺有意思的，怀疑是早晨头脑不清醒犯的低级错误，下面直接附上代码，权当记录了，毕竟惆怅了半个上午的东西。

代码

<html>
<head>
    <style> 
    .thick-green-border {
        width: 100px; 
        margin-top: 40px;
        margin-left: 40px;
        margin-bottom: -10px;
        margin-right: 20px;
        padding-top: 20px;
        border-style: solid;
        border-width: 10px;
        border-color: green;
    } 
    </style> 
</head>
<body>
		<h2 class="red-text">
			CatPhotoApp
		</h2> 
        <img src="https://bit.ly/fcc-relaxing-cat"
         alt="这猫可爱不？"
          class="thick-green-border"/>
 </body>
</html>

至于为什么代码关键字不变色，我还没搞明白。

目标是什么呢

关注

1
点赞
踩
2

收藏

觉得还不错? 一键收藏
1
评论
CSS_给img元素添加边框

缘由在w3cschool上学习css相关的知识，小测验如下：创建一个名为thick-green-border 类将这个类应用在img元素中，为img元素周围添加一个10px的实心绿色边框为类名为thick-green-border元素的顶部和左侧margin设置为40px ，底部设置为-10px，右侧设置为20px为其设置顶部padding20px问题早晨写的时候，img的边框死...
复制链接

扫一扫