技能测试：图片和表格元素

在此任务中，你有一张溢出盒子的图像。我们希望图像缩小到适合盒子的大小，而没有多余的空白，并不介意某些图像是否被裁剪。

在下面的例子中看看你能否能符合上面的图片

在此任务中，你会获得一个简单的表格。你的任务是对该表单的外观进行以下更改：

• 使用属性选择器定位.myform 中的**搜索 (search)**字段和按钮。
• 使表单字段和按钮使用与表单其余部分相同的文本大小。
• 给表单字段和按钮设置 10 像素的内边距。
• 为按钮提供紫色背景，白色前景，无边框和 5px 的圆角。

尝试更改下面的实时代码以重新创建图像中显示的示例：

你可以在上面提到的交互式编辑器中练习这些示例。

如果你希望对自己的工作进行评估，或者遇到困难并希望寻求帮助，请执行以下操作：

1. 将你的工作上传到在线共享编辑器中，例如 CodePen, jsFiddle, Glitch.。你可以自己编写代码，也可以使用以上部分中链接到的起点文件。
2. 在MDN Discourse forum Learning category. “学习”类别中写一篇帖子，要求评估帮助。你的帖子应包括：

• 描述性标题，例如“Assessment wanted for Images skill test 1”。
• 你已经尝试过的内容以及你希望我们做什么的详细信息，例如 如果你陷入困境并需要帮助，或者需要评估。
• 指向你要评估或需要帮助的示例的链接（如上面的步骤 1 中所述）。这是很好好习惯 - 如果看不到代码，很难帮助存在问题的人。
• 指向实际任务或评估页面的链接，因此我们可以找到你需要帮助的问题。