2018-10-10 18:03:03 -04:00
|
|
|
|
---
|
|
|
|
|
id: 587d7791367417b2b2512ab4
|
2020-12-16 00:37:30 -07:00
|
|
|
|
title: 使用 width 属性调整元素的宽度
|
2018-10-10 18:03:03 -04:00
|
|
|
|
challengeType: 0
|
2020-02-11 15:46:34 +08:00
|
|
|
|
videoUrl: 'https://scrimba.com/c/cvVLPtN'
|
|
|
|
|
forumTopicId: 301039
|
2018-10-10 18:03:03 -04:00
|
|
|
|
---
|
|
|
|
|
|
2020-12-16 00:37:30 -07:00
|
|
|
|
# --description--
|
|
|
|
|
|
2021-01-08 11:20:48 -08:00
|
|
|
|
你可以使用 CSS 里的 `width` 属性来指定元素的宽度。属性值可以是相对单位(比如 em)、绝对单位(比如 px)、或者其父元素宽度的百分比。下面这段代码可以把图片的宽度设置为 220px:
|
2020-02-11 15:46:34 +08:00
|
|
|
|
|
|
|
|
|
```css
|
|
|
|
|
img {
|
|
|
|
|
width: 220px;
|
|
|
|
|
}
|
|
|
|
|
```
|
|
|
|
|
|
2020-12-16 00:37:30 -07:00
|
|
|
|
# --instructions--
|
2018-10-10 18:03:03 -04:00
|
|
|
|
|
2021-01-08 11:20:48 -08:00
|
|
|
|
请使用 `fullCard` class 来选择卡片元素,为它添加 `width` 属性,并将它的宽度设置为 245px。
|
2018-10-10 18:03:03 -04:00
|
|
|
|
|
2020-12-16 00:37:30 -07:00
|
|
|
|
# --hints--
|
2018-10-10 18:03:03 -04:00
|
|
|
|
|
2021-01-08 11:20:48 -08:00
|
|
|
|
应使用 `fullCard` class 选择器将卡片的 `width` 属性值设置为 `245px`。
|
2018-10-10 18:03:03 -04:00
|
|
|
|
|
2020-12-16 00:37:30 -07:00
|
|
|
|
```js
|
|
|
|
|
const fullCard = code.match(/\.fullCard\s*{[\s\S]+?[^}]}/g);
|
|
|
|
|
assert(
|
|
|
|
|
fullCard &&
|
|
|
|
|
/width\s*:\s*245px\s*(;|})/gi.test(fullCard[0]) &&
|
|
|
|
|
$('.fullCard').css('maxWidth') === 'none'
|
|
|
|
|
);
|
2018-10-10 18:03:03 -04:00
|
|
|
|
```
|
|
|
|
|
|
2020-12-16 00:37:30 -07:00
|
|
|
|
# --solutions--
|
2020-02-11 15:46:34 +08:00
|
|
|
|
|