freeCodeCamp

2.3 KiB

Raw Blame History

id	title	challengeType	videoUrl	localeTitle
587d78b1367417b2b2512b0a	Use a Retina Image for Higher Resolution Displays	0		Используйте изображение Retina для дисплеев с более высоким разрешением

Description

Самый простой способ сделать ваши изображения «сетчаткой» (и оптимизировать их для дисплеев сетчатки) - это определить их значения width и height как только половину исходного файла. Вот пример изображения, использующего только половину исходной высоты и ширины:

<Стиль>
img {height: 250px; ширина: 250 пикселей; }
</ Стиль>
<img src = "coolPic500x500" alt = "Самая прекрасная картина">

Instructions

Установите width и height тега img на половину их исходных значений. В этом случае как исходная height и исходная width составляют 200 пикселей.

Tests

tests:
  - text: Ваш тег <code>img</code> должен иметь <code>width</code> 100 пикселей.
    testString: 'assert($("img").css("width") == "100px", "Your <code>img</code> tag should have a <code>width</code> of 100 pixels.");'
  - text: Ваш тег <code>img</code> должен иметь <code>height</code> 100 пикселей.
    testString: 'assert($("img").css("height") == "100px", "Your <code>img</code> tag should have a <code>height</code> of 100 pixels.");'

Challenge Seed

<style>

</style>

<img src="https://s3.amazonaws.com/freecodecamp/FCCStickers-CamperBot200x200.jpg" alt="freeCodeCamp sticker that says 'Because CamperBot Cares'">

Solution

// solution required

2.3 KiB Raw Blame History Unescape Escape