freeCodeCamp/curriculum/challenges/russian/04-data-visualization/data-visualization-with-d3/add-inline-styling-to-eleme...

67 lines
1.9 KiB
Markdown
Raw Blame History

This file contains ambiguous Unicode characters!

This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.

---
id: 587d7fa7367417b2b2512bc6
title: Add Inline Styling to Elements
challengeType: 6
videoUrl: ''
localeTitle: Добавить встроенный стиль в элементы
---
## Description
<section id="description"> D3 позволяет добавлять встроенные стили CSS для динамических элементов с помощью метода <code>style()</code> . Метод <code>style()</code> принимает в качестве аргумента пару ключ-значение, разделенную запятыми. Вот пример, чтобы задать цвет текста выбора синим: <code>selection.style(&quot;color&quot;,&quot;blue&quot;);</code> </section>
## Instructions
<section id="instructions"> Добавьте метод <code>style()</code> в код в редакторе, чтобы весь отображаемый текст имел <code>font-family</code> <code>verdana</code> . </section>
## Tests
<section id='tests'>
```yml
tests:
- text: Элементы <code>h2</code> должны иметь <code>font-family</code> шрифтов verdana.
testString: 'assert($("h2").css("font-family") == "verdana", "Your <code>h2</code> elements should have a <code>font-family</code> of verdana.");'
- text: ''
testString: 'assert(code.match(/\.style/g), "Your code should use the <code>style()</code> method.");'
```
</section>
## Challenge Seed
<section id='challengeSeed'>
<div id='html-seed'>
```html
<body>
<script>
const dataset = [12, 31, 22, 17, 25, 18, 29, 14, 9];
d3.select("body").selectAll("h2")
.data(dataset)
.enter()
.append("h2")
.text((d) => (d + " USD"))
// Add your code below this line
// Add your code above this line
</script>
</body>
```
</div>
</section>
## Solution
<section id='solution'>
```js
// solution required
```
</section>