freeCodeCamp/curriculum/challenges/english/03-front-end-libraries/bootstrap/create-a-bootstrap-headline.md

1.3 KiB

id title challengeType forumTopicId dashedName
bad87fee1348bd9aec908846 Create a Bootstrap Headline 0 16812 create-a-bootstrap-headline

--description--

Now let's build something from scratch to practice our HTML, CSS and Bootstrap skills.

We'll build a jQuery playground, which we'll soon put to use in our jQuery challenges.

To start with, create an h3 element, with the text jQuery Playground.

Color your h3 element with the text-primary Bootstrap class, and center it with the text-center Bootstrap class.

--hints--

You should add an h3 element to your page.

assert($('h3') && $('h3').length > 0);

Your h3 element should have a closing tag.

assert(
  code.match(/<\/h3>/g) &&
    code.match(/<h3/g) &&
    code.match(/<\/h3>/g).length === code.match(/<h3/g).length
);

Your h3 element should be colored by applying the class text-primary

assert($('h3').hasClass('text-primary'));

Your h3 element should be centered by applying the class text-center

assert($('h3').hasClass('text-center'));

Your h3 element should have the text jQuery Playground.

assert.isTrue(/jquery(\s)+playground/gi.test($('h3').text()));

--seed--

--seed-contents--


--solutions--

<h3 class="text-primary text-center">jQuery Playground</h3>