![\"A](\"//i.imgur.com/jOc1JF1.png\" "\\"Click")
/g), 'message: The opening main tag should come before the paragraph tag.');",
- "assert(code.match(/<\\/p>\\s*?<\\/main>/g), 'message: The closing main tag should come after your closing paragraph tag.');"
- ],
- "type": "waypoint",
- "challengeType": 0,
- "translations": {}
- },
{
"id": "bad87fee1348bd9aedf08833",
"title": "Fill in the Blank with Placeholder Text",
@@ -286,6 +276,7 @@
"Web developers traditionally use lorem ipsum text as placeholder text. The 'lorem ipsum' text is randomly scraped from a famous passage by Cicero of Ancient Rome.",
"Lorem ipsum text has been used as placeholder text by typesetters since the 16th century, and this tradition continues on the web.",
"Well, 5 centuries is long enough. Since we're building a CatPhotoApp, let's use something called kitty ipsum text.",
+ "
", "Replace the text inside your
p element with the first few words of this kitty ipsum text: Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff."
],
"challengeSeed": [
@@ -306,6 +297,7 @@
"Webentwickler nutzen für gewöhnlich \"Lorem Ipsum Text\" als Platzhalter. Es heißt \"Lorem Ipsum\", weil es die ersten zwei Wörter aus einer bekannten Passage von Cicero des alten Roms sind.",
"\"Lorem Ipsum\" Text wurde seit dem 16. Jahrhundert von Schriftsetzern als Platzhalter verwendet. Und diese Tradition setzt sich im Web fort.",
"Nun gut, fünf Jahrhunderte sind lange genug. Da wir eine CatPhotoApp entwickeln, lass uns stattdessen lieber kitty ipsum text nutzen.",
+ "", "Ersetze den Text in deinem
p Element mit den ersten Wörtern des \"Kitty Ipsum\" Textes: Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff."
]
},
@@ -315,6 +307,7 @@
"Les développeurs Web utilisent traditionnellement du lorem ipsum comme texte de substitution. Le texte lorem ipsum provient d'un extrait de Cicero, de la Rome antique.",
"Le texte lorem ipsum a été utilisé comme faux-texte par des typographes depuis le 16ème siècle et cette tradition se poursuit sur le Web.",
"Enfin, 5 siècles est suffisament long. Étant donné que nous fabriquons une application de photos de chats, utilisons plutôt du texte Kitty ipsum.",
+ "", "Remplacez le texte à l'intérieur des éléments
p avec ces quelques mots du texte Kitty ipsum : Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff."
]
},
@@ -324,6 +317,7 @@
"Desenvolvedores web tradicionalmente usam Lorem Ipsum como texto de preenchimento. Lorem Ipsum é chamado assim pois essas são as duas primeiras palavras de uma passagem famosa de Cícero da Roma Antiga.",
"O texto Lorem Ipsum tem sido utilizado como texto de espaço reservado por compositores desde o século 16, e esta tradição continua na web.",
"Bem, 5 séculos é um tempo longo o bastante. Já que estamos desenvolvendo um aplicativo sobre fotos de gatos (CatPhotoApp), vamos usar algo chamado Kitty Ipsum.",
+ "", "Substitua o texto dentro do seu elemento
p pelas primeiras palavras deste texto Kitty Ipsum: Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff."
]
},
@@ -333,101 +327,12 @@
"Традиционно web-разработчики используют текст lorem ipsum в качестве замещающего текста. Он называется тектсом lorem ipsum по первым двум словам известного пассажа Цицерона из Древнего Рима.",
"Текст lorem ipsum применяется в качестве замещающего текста наборщиками с 16-го века, и эта традиция продолжается в сети.",
"5 веков довольно долгий период. Так как мы строим приложение CatPhotoApp, давайте используем нечто называемое текстом kitty ipsum.",
+ "", "Замените текст внутри вашего элемента
p первыми двумя словами текста kitty ipsum: Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff."
]
}
}
},
- {
- "id": "bad87fee1348bd9aedf08812",
- "title": "Add Images to your Website",
- "description": [
- "You can add images to your website by using the img element, and point to a specific image's URL using the src attribute.",
- "An example of this would be:",
- "<img src=\"https://www.your-image-source.com/your-image.jpg\">",
- "All img elements must have an alt attribute. The text inside an alt attribute is used for screen readers to improve accessibility and is displayed if the image fails to load.",
- "Let's add an alt attribute to our img example above:",
- "<img src=\"https://www.your-image-source.com/your-image.jpg\" alt=\"Author standing on a beach with two thumbs up.\">",
- "Note that in most cases, img elements are self-closing.",
- "Try it with this image:",
- "https://bit.ly/fcc-relaxing-cat"
- ],
- "challengeSeed": [
- "",
- "",
- "",
- "CatPhotoApp
", - "", - "Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.
", - "Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.
" - ], - "tests": [ - "assert($(\"img\").length > 0, 'message: Your page should have an image element.');", - "assert(new RegExp(\"\\/\\/bit.ly\\/fcc-relaxing-cat|\\/\\/s3.amazonaws.com\\/freecodecamp\\/relaxing-cat.jpg\", \"gi\").test($(\"img\").attr(\"src\")), 'message: Your image should have asrc attribute that points to the kitten image.');",
- "assert(code.match(/alt\\s*?=\\s*?(\\\"|\\').*(\\\"|\\')/), 'message: Your image element must have an alt attribute.');"
- ],
- "type": "waypoint",
- "challengeType": 0,
- "translations": {
- "de": {
- "description": [
- "Du kannst img Elemente verwenden, um Bilder in deine Website einzubauen. Um zur URL des Bildes zu verweisen, benutzt du das src Attribut.",
- "Ein Beispiel dafür wäre:",
- "<img src=\"https://www.deine-bild-quelle.com/dein-bild.jpg\">",
- "Beachte dass in den meisten Fällen img Elemente selbstschließend sind.",
- "Versuche es mit diesem Bild:",
- "https://bit.ly/fcc-relaxing-cat"
- ]
- },
- "fr": {
- "title": "Ajouter des images à votre site Web",
- "description": [
- "Vous pouvez ajouter des images à votre site Web en utilisant l'élément img et pointer vers une URL d'image spécifique en utilisant l'attribut src.",
- "Un exemple de cette procédure serait :",
- "<img src=\"https://www.your-image-source.com/your-image.jpg\">",
- "Note that in most cases, img elements are self-closing.",
- "Prenez note que dans la plupart des cas, les éléments img sont auto-fermants.",
- "Essayez avec cette image :",
- "https://bit.ly/fcc-relaxing-cat"
- ]
- },
- "pt-br": {
- "title": "Adicione Imagens em sua Página Web",
- "description": [
- "Você pode adicionar imagens à sua página da internet com o uso do elemento img, e apontar para a URL específica de uma imagem utilizando o atributo src.",
- "Um exemplo para isso seria:",
- "<img src=\"https://www.your-image-source.com/your-image.jpg\">",
- "Observe que na maior parte dos casos, os elementos img são de fechamento automático.",
- "Agora, tente fazer isso com essa imagem:",
- "https://bit.ly/fcc-relaxing-cat"
- ]
- },
- "ru": {
- "title": "Добавьте изображения к вашему сайту",
- "description": [
- "Вы можете добавлять изображения к вашему сайту с помощью элемента img и указывать ссылки определённых изображений с помощтю атрибута src.",
- "Примером добавления мзображения может служить:",
- "<img src=\"https://www.your-image-source.com/your-image.jpg\">",
- "Обратите внимание, что в большинстве случаев элементы img являются самозакрывающимися.",
- "Попробуйте добавить изображение используя следующую ссылку:",
- "https://bit.ly/fcc-relaxing-cat"
- ]
- }
- }
- },
{
"id": "bad87fee1348bd9aedf08802",
"title": "Uncomment HTML",
@@ -435,6 +340,7 @@
"Commenting is a way that you can leave comments within your code without affecting the code itself.",
"Commenting is also a convenient way to make code inactive without having to delete it entirely.",
"You can start a comment with <!-- and end a comment with -->",
+ "
",
"Uncomment your h1, h2 and p elements."
],
"challengeSeed": [
@@ -443,7 +349,7 @@
"",
"CatPhotoApp
",
"",
- "Hello Paragraph
",
+ "Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.
",
"-->"
],
"tests": [
@@ -460,6 +366,7 @@
"Kommentieren erlaubt dir Kommentare innerhalb des Codes zu hinterlassen, ohne diesen selbst zu beeinflussen.",
"Dies ist auch ein guter Weg, um Code inaktiv zu machen ohne diesen komplett löschen zu müssen.",
"Du kannst einen Kommentar mit <!-- starten und ihn mit --> wieder beenden.",
+ "
",
"Entkommentiere deine h1, h2 und p Elemente."
]
},
@@ -469,6 +376,7 @@
"Commenter est une façon de laisser des commentaires dans votre code sans affecter le fonctionnement du code.",
"Commenter est aussi un moyen pratique de rendre du code inactif sans devoir le supprimer entièrement.",
"Vous pouvez débuter un commentaire avec <!-- et le terminer avec -->.",
+ "
",
"Décommenter vos éléments h1, h2 et p."
]
},
@@ -478,6 +386,7 @@
"\"Comentar\" é uma forma de deixar anotações em seu código sem afetá-lo.",
"Comentar também é um jeito conveniente de deixar seu código inativo sem precisar apagá-lo por completo.",
"Você pode iniciar um comentário com <!-- e terminar seu comentário com -->.",
+ "
",
"Remova o comentário dos elementos h1, h2 e p."
]
},
@@ -487,6 +396,7 @@
"Комментирование - способ хранения заметок по коду без воздействия на сам код.",
"Также комментирование - неплохой метод отключения части кода без необходимости его удаления.",
"Вы можете начать комментарий с <!-- и закончить его -->",
+ "
",
"Раскомментируйте свои элементы h1, h2 и p."
]
}
@@ -498,6 +408,7 @@
"description": [
"Remember that in order to start a comment, you need to use <!-- and to end a comment, you need to use -->",
"Here you'll need to end the comment before your h2 element begins.",
+ "
",
"Comment out your h1 element and your p element, but leave your h2 element uncommented."
],
"challengeSeed": [
@@ -506,7 +417,7 @@
"",
"CatPhotoApp
",
"",
- "Hello Paragraph
",
+ "Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.
",
"-->"
],
"tests": [
@@ -523,6 +434,7 @@
"description": [
"Denk daran, dass du einen Kommentar mit <!-- anfangen und mit --> wieder beenden werden.",
"Hier wirst du deinen Kommentar vor dem h2 Element beenden müssen.",
+ "
",
"Kommentiere die h1 und p Elemente aus, aber lasse dein h2 Element unkommentiert."
]
},
@@ -531,6 +443,7 @@
"description": [
"Souvenez-vous que pour débuter un commentaire, vous devez utiliser <!-- et que pour le terminer, vous devez utiliser -->.",
"Ici vous devrez terminer le commentaire juste avant que l'élément h2 commence.",
+ "
",
"Commentez les éléments h1 et p, mais laissez l'élément h2 tel quel."
]
},
@@ -539,6 +452,7 @@
"description": [
"Lembre-se que para iniciar um comentário você precisa utilizar <!--, e para terminar um comentário é necessário usar -->.",
"Aqui, você deverá terminar o comentário antes que seu elemento h2 inicie.",
+ "
",
"Comente o elemento h1 e o elemento p, e deixe o elemento h2 sem nenhum comentário."
]
},
@@ -547,6 +461,7 @@
"description": [
"Помните, что для начала комментария вам необходимо использовать <!--, а для завершения комментария - -->",
"Тут вам необходимо завершить комментарий до начала вашего элемента h2.",
+ "
",
"Закомментируйте ваши элементы h1 и p, но оставьте ваш элемент h2 раскомментированным."
]
}
@@ -558,6 +473,7 @@
"description": [
"Our phone doesn't have much vertical space.",
"Let's remove the unnecessary elements so we can start building our CatPhotoApp.",
+ "
",
"Delete your h1 element so we can simplify our view."
],
"challengeSeed": [
@@ -579,6 +495,7 @@
"description": [
"Unser Smartphone hat nicht sehr viel vertikalen Platz.",
"Lass uns die unwichtigen Elemente entfernen, damit wir unsere CatPhotoApp entwickeln können.",
+ "
",
"Lösche die Elemente h1, damit wir etwas Ordnung schaffen."
]
},
@@ -587,6 +504,7 @@
"description": [
"Notre téléphone n'a pas beaucoup d'espace vertical.",
"Enlevons les éléments superflus pour débuter la construction de notre application de photos de chats.",
+ "
",
"Supprimez l'élément h1 afin de simplifier l'affichage."
]
},
@@ -595,6 +513,7 @@
"description": [
"Nosso celular não possui muito espaço vertical.",
"Vamos eliminar os elementos desnecessários para começar a construir nosso CatPhotoApp.",
+ "
",
"Apague o elemento h1 para simplificar o nosso espaço."
]
},
@@ -603,11 +522,124 @@
"description": [
"Наш телефон не очень большой по-вертикали.",
"Давайте удалим некоторые ненужные элементы, чтобы мы могли приступить к созданию приложения CatPhotoApp.",
+ "
",
"Удалите ваш h1 элемент, чтобы упростить общий вид."
]
}
}
},
+ {
+ "id": "bad87fee1348bd9aecf08801",
+ "title": "Introduction to HTML5 Elements",
+ "description": [
+ "HTML5 introduces more descriptive HTML tags. These include header, footer, nav, video, article, section and others.",
+ "These tags make your HTML easier to read, and also help with Search Engine Optimization (SEO) and accessibility.",
+ "The main HTML5 tag helps search engines and other developers find the main content of your page.",
+ "Note
Many of the new HTML5 tags and their benefits are covered in the Applied Accessibility section.",
+ "
",
+ "Create a second p element after the existing p element with the following kitty ipsum text: Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.",
+ "Wrap the paragraphs with an opening and closing main tag."
+ ],
+ "challengeSeed": [
+ "CatPhotoApp
",
+ "",
+ "Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.
"
+ ],
+ "tests": [
+ "assert($(\"p\").length > 1, 'message: You need 2 p elements with Kitty Ipsum text.');",
+ "assert(code.match(/<\\/p>/g) && code.match(/<\\/p>/g).length === code.match(/p
elements has a closing tag.');",
+ "assert.isTrue((/Purr\\s+jump\\s+eat/gi).test($(\"p\").text()), 'message: Your p element should contain the first few words of the provided additional kitty ipsum text.');",
+ "assert($('main').length === 1, 'message: Your code should have one main element.');",
+ "assert($(\"main\").children(\"p\").length === 2, 'message: The main element should have two paragraph elements as children.');",
+ "assert(code.match(/\\s*?/g), 'message: The opening main tag should come before the first paragraph tag.');",
+ "assert(code.match(/<\\/p>\\s*?<\\/main>/g), 'message: The closing main tag should come after the second closing paragraph tag.');"
+ ],
+ "type": "waypoint",
+ "challengeType": 0,
+ "translations": {}
+ },
+ {
+ "id": "bad87fee1348bd9aedf08812",
+ "title": "Add Images to your Website",
+ "description": [
+ "You can add images to your website by using the img element, and point to a specific image's URL using the src attribute.",
+ "An example of this would be:",
+ "<img src=\"https://www.your-image-source.com/your-image.jpg\">",
+ "All img elements must have an alt attribute. The text inside an alt attribute is used for screen readers to improve accessibility and is displayed if the image fails to load.",
+ "Let's add an alt attribute to our img example above:",
+ "<img src=\"https://www.your-image-source.com/your-image.jpg\" alt=\"Author standing on a beach with two thumbs up.\">",
+ "Note that in most cases, img elements are self-closing.",
+ "
",
+ "Try it with this image:",
+ "https://bit.ly/fcc-relaxing-cat"
+ ],
+ "challengeSeed": [
+ "CatPhotoApp
",
+ "",
+ " ",
+ " ",
+ " Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.
",
+ " Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.
",
+ " "
+ ],
+ "tests": [
+ "assert($(\"img\").length > 0, 'message: Your page should have an image element.');",
+ "assert(new RegExp(\"\\/\\/bit.ly\\/fcc-relaxing-cat|\\/\\/s3.amazonaws.com\\/freecodecamp\\/relaxing-cat.jpg\", \"gi\").test($(\"img\").attr(\"src\")), 'message: Your image should have a src attribute that points to the kitten image.');",
+ "assert(code.match(/alt\\s*?=\\s*?(\\\"|\\').*(\\\"|\\')/), 'message: Your image element must have an alt attribute.');"
+ ],
+ "type": "waypoint",
+ "challengeType": 0,
+ "translations": {
+ "de": {
+ "description": [
+ "Du kannst img Elemente verwenden, um Bilder in deine Website einzubauen. Um zur URL des Bildes zu verweisen, benutzt du das src Attribut.",
+ "Ein Beispiel dafür wäre:",
+ "<img src=\"https://www.deine-bild-quelle.com/dein-bild.jpg\">",
+ "Beachte dass in den meisten Fällen img Elemente selbstschließend sind.",
+ "
",
+ "Versuche es mit diesem Bild:",
+ "https://bit.ly/fcc-relaxing-cat"
+ ]
+ },
+ "fr": {
+ "title": "Ajouter des images à votre site Web",
+ "description": [
+ "Vous pouvez ajouter des images à votre site Web en utilisant l'élément img et pointer vers une URL d'image spécifique en utilisant l'attribut src.",
+ "Un exemple de cette procédure serait :",
+ "<img src=\"https://www.your-image-source.com/your-image.jpg\">",
+ "Note that in most cases, img elements are self-closing.",
+ "Prenez note que dans la plupart des cas, les éléments img sont auto-fermants.",
+ "
",
+ "Essayez avec cette image :",
+ "https://bit.ly/fcc-relaxing-cat"
+ ]
+ },
+ "pt-br": {
+ "title": "Adicione Imagens em sua Página Web",
+ "description": [
+ "Você pode adicionar imagens à sua página da internet com o uso do elemento img, e apontar para a URL específica de uma imagem utilizando o atributo src.",
+ "Um exemplo para isso seria:",
+ "<img src=\"https://www.your-image-source.com/your-image.jpg\">",
+ "Observe que na maior parte dos casos, os elementos img são de fechamento automático.",
+ "
",
+ "Agora, tente fazer isso com essa imagem:",
+ "https://bit.ly/fcc-relaxing-cat"
+ ]
+ },
+ "ru": {
+ "title": "Добавьте изображения к вашему сайту",
+ "description": [
+ "Вы можете добавлять изображения к вашему сайту с помощью элемента img и указывать ссылки определённых изображений с помощтю атрибута src.",
+ "Примером добавления мзображения может служить:",
+ "<img src=\"https://www.your-image-source.com/your-image.jpg\">",
+ "Обратите внимание, что в большинстве случаев элементы img являются самозакрывающимися.",
+ "
",
+ "Попробуйте добавить изображение используя следующую ссылку:",
+ "https://bit.ly/fcc-relaxing-cat"
+ ]
+ }
+ }
+ },
{
"id": "bad87fee1348bd9aedf08816",
"title": "Link to External Pages with Anchor Elements",
@@ -616,43 +648,21 @@
"Here's a diagram of an a element. In this case, the a element is used in the middle of a paragraph element, which means the link will appear in the middle of a sentence.",
"![\"a](\"//i.imgur.com/hviuZwe.png\" "\\"Click")
",
"Here's an example:",
- "<p>Here's a <a href=\"http://freecodecamp.com\"> link to Free Code Camp</a> for you to follow.</p>",
+ "<p>Here's a <a href=\"http://freecodecamp.com\"> link to freeCodeCamp</a> for you to follow.</p>",
+ "
",
"Create an a element that links to http://freecatphotoapp.com and has \"cat photos\" as its anchor text."
],
"challengeSeed": [
- "",
- "",
- "",
- "CatPhotoApp
",
- "",
- "![\"A](\"https://bit.ly/fcc-relaxing-cat\")
",
- "",
- "Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.
",
- "Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.
"
+ "CatPhotoApp
",
+ "",
+ " ",
+ " ",
+ " ",
+ " ",
+ " ",
+ " Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.
",
+ " Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.
",
+ " "
],
"tests": [
"assert((/cat photos/gi).test($(\"a\").text()), 'message: Your a element should have the anchor text of \"cat photos\".');",
@@ -669,7 +679,8 @@
"So sieht ein a Element aus. In diesem Fall wird es innerhalb eines Paragraphen Elements verwendet. Das bedeutet dein Link wird innerhalb des Satzes erscheinen.",
"",
"Hier ist ein Beispiel:",
- "<p>Hier ist ein <a href=\"http://freecodecamp.com\"> Link zu Free Code Camp</a> dem du folgen kannst.</p>",
+ "<p>Hier ist ein <a href=\"http://freecodecamp.com\"> Link zu freeCodeCamp</a> dem du folgen kannst.</p>",
+ "
",
"Erstelle ein a Element, das auf http://freecatphotoapp.com verlinkt und den \"cat photos\" als anchor text (Link-Text) beinhaltet."
]
},
@@ -680,7 +691,8 @@
"Aquí está un diagrama de un elemento a. En este caso, el elemento a se utiliza en el medio de un elemento de párrafo, lo que significa que el enlace aparecerá en el medio de una frase. ",
" ",
"He aquí un ejemplo:",
- "<p>Aquí está un <a href=\"https://freecodecamp.com\"> enlace a Free Code Camp</a> para que lo sigas.</p>",
+ "<p>Aquí está un <a href=\"https://freecodecamp.com\"> enlace a freeCodeCamp</a> para que lo sigas.</p>",
+ "
",
"Crea un elemento a que se vincule a http://freecatphotoapp.com y tenga como texto de ancla \"fotos de gatos\"."
]
},
@@ -691,7 +703,8 @@
"Aqui está um diagrama de um elemento a. Neste caso, o elemento a é utilizado no meio de um elemento de parágrafo, o que significa que o link externo aparecerá no meio de uma frase.",
" ",
"Veja um exemplo:",
- "<p>Aqui está um <a href=\"https://freecodecamp.com\"> link ligado ao Free Code Camp</a> para que você o siga.</p>",
+ "<p>Aqui está um <a href=\"https://freecodecamp.com\"> link ligado ao freeCodeCamp</a> para que você o siga.</p>",
+ "
",
"Crie um elemento a que esteja ligado ao site http://freecatphotoapp.com e tenha como texto de âncora \"fotos de gatos\"."
]
},
@@ -702,7 +715,8 @@
"Вот диаграмма элемента a. В этом случае, элемент a использован в середине элемента параграфа, что значит, что ссылка появится в середине предложения.",
"",
"Вот пример:",
- "<p>Вот <a href=\"http://freecodecamp.com\"> ссылка на Free Code Camp</a> для перехода на ресурс.</p>",
+ "<p>Вот <a href=\"http://freecodecamp.com\"> ссылка на freeCodeCamp</a> для перехода на ресурс.</p>",
+ "
",
"Создайте элемент a, который присоединяет http://freecatphotoapp.com и имеет значение \"cat photos\" в качестве текста якоря."
]
}
@@ -722,44 +736,20 @@
"
",
"Change your external link to an internal link by changing the href attribute to \"#bottom\" and the anchor text from \"cat photos\" to \"Jump to Bottom\".",
"Then add an anchor link with a name attribute set to \"bottom\" after the last paragraph.",
- "Note
Additional kitty ipsum text has been added to the paragraphs to better show the effect of clicking the internal anchor link to jump to the bottom of the page."
+ "Note
Additional kitty ipsum text has been added to the paragraphs to better show the effect of clicking the internal anchor link to jump to the bottom of the page. Also, this change will only apply to this challenge. The next challenge goes back to showing your external link."
],
"challengeSeed": [
- "",
- "",
- "",
- "CatPhotoApp
",
- "",
- "cat photos",
- "",
- "",
- "",
- "Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff. Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched. Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.
",
- "Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched. Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff. Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.
"
+ "CatPhotoApp
",
+ "",
+ " ",
+ " cat photos",
+ " ",
+ " ",
+ " ",
+ " Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff. Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched. Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.
",
+ " Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched. Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff. Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.
",
+ " ",
+ " "
],
"tests": [
"assert($('a').length == 2, 'message: There should be only two anchor tags on your page.');",
@@ -777,46 +767,22 @@
"Again, here's a diagram of an a element for your reference:",
"",
"Here's an example:",
- "<p>Here's a <a href=\"https://freecodecamp.com\"> link to Free Code Camp</a> for you to follow.</p>",
+ "<p>Here's a <a href=\"https://freecodecamp.com\"> link to freeCodeCamp</a> for you to follow.</p>",
"Nesting just means putting one element inside of another element.",
- "Now nest your existing a element within a new p element (just after the existing h2 element) so that the surrounding paragraph says \"View more cat photos\", but where only \"cat photos\" is a link, and the rest of the text is plain text."
+ "
",
+ "Now nest your existing a element within a new p element (just after the existing main element) so that the surrounding paragraph says \"View more cat photos\", but where only \"cat photos\" is a link, and the rest of the text is plain text."
],
"challengeSeed": [
- "",
- "",
- "",
- "CatPhotoApp
",
- "",
- "cat photos",
- "",
- "",
- "",
- "Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.
",
- "Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.
"
+ "CatPhotoApp
",
+ "",
+ " ",
+ " cat photos",
+ " ",
+ " ",
+ " ",
+ " Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.
",
+ " Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.
",
+ " "
],
"tests": [
"assert(($(\"a[href=\\\"http://freecatphotoapp.com\\\"]\").length > 0 || $(\"a[href=\\\"http://www.freecatphotoapp.com\\\"]\").length > 0), 'message: You need an a element that links to \"http://freecatphotoapp.com\".');",
@@ -837,9 +803,10 @@
"Hier ist nochmal ein Beispiel für ein a Element:",
"",
"Hier ist ein Beispiel:",
- "<p>Hier ist ein <a href=\"https://freecodecamp.com\"> Link zu Free Code Camp</a> dem du folgen kannst.</p>",
+ "<p>Hier ist ein <a href=\"https://freecodecamp.com\"> Link zu freeCodeCamp</a> dem du folgen kannst.</p>",
"Nesting bedeuted ein Element innerhalb eines anderen Elements zu schreiben",
- "Jetzt umschließe dein a Element mit einem neuen p Element (direkt nach dem bereits existierenden h2 Element) indem steht \"View more cat photos\", wo allerdings nur \"cat photos\" ein Link ist und der Rest normaler Text."
+ "
",
+ "Jetzt umschließe dein a Element mit einem neuen p Element (direkt nach dem bereits existierenden main Element) indem steht \"View more cat photos\", wo allerdings nur \"cat photos\" ein Link ist und der Rest normaler Text."
]
},
"es": {
@@ -848,9 +815,10 @@
"Una vez más, aquí está un diagrama de un elemento a para tu referencia:",
"",
"He aquí un ejemplo:",
- "<p>Aquí hay un <a href=\"https://freecodecamp.com\"> enlace a Free Code Camp</a> para que lo sigas.</p>",
+ "<p>Aquí hay un <a href=\"https://freecodecamp.com\"> enlace a freeCodeCamp</a> para que lo sigas.</p>",
"Anidamiento simplemente significa poner un elemento dentro de otro elemento.",
- "Ahora anida el elemento a existente dentro de un nuevo elemento p (justo después del elemento h2 que ya tienes) de tal forma que el párrafo que lo rodee diga \"View more cat photos\", pero que sólo \"cat photos\" sea un enlace, y el resto sea texto plano ."
+ "
",
+ "Ahora anida el elemento a existente dentro de un nuevo elemento p (justo después del elemento main que ya tienes) de tal forma que el párrafo que lo rodee diga \"View more cat photos\", pero que sólo \"cat photos\" sea un enlace, y el resto sea texto plano ."
]
},
"pt-br": {
@@ -859,8 +827,9 @@
"Outra vez, aqui está um diagrama de um elemento a para você usar como referência.",
"",
"Veja um exemplo:",
- "<p>Este é um <a href=\"https://freecodecamp.com\"> link ligado ao Free Code Camp</a> para que você o siga.</p>",
+ "<p>Este é um <a href=\"https://freecodecamp.com\"> link ligado ao freeCodeCamp</a> para que você o siga.</p>",
"Aninhamento significa ter um elemento no interior de outro elemento.",
+ "
",
"Agora, aninhe o elemento a existente dentro de um novo elemento p de forma que o parágrafo diga \"View more cat photos\", mas onde apenas \"cat photos\" seja um link, e o resto seja texto comum."
]
},
@@ -870,9 +839,10 @@
"Вот диаграмма элемента a:",
"",
"Вот пример:",
- "<p>Вот <a href=\"https://freecodecamp.com\"> ссылка на Free Code Camp</a> для перехода на ресурс.</p>",
+ "<p>Вот <a href=\"https://freecodecamp.com\"> ссылка на freeCodeCamp</a> для перехода на ресурс.</p>",
"Вложенность значит установку одного элемента внутрь друго элемента.",
- "Теперь вложите ваш существующий элемент a внутрь нового элемента p (сразу после существующего элемента h2) таким образом, что добавляемый параграф сообщает: \"View more cat photos\", но где только \"cat photos\" является ссылкой, а остальной текст обычный."
+ "
",
+ "Теперь вложите ваш существующий элемент a внутрь нового элемента p (сразу после существующего элемента main) таким образом, что добавляемый параграф сообщает: \"View more cat photos\", но где только \"cat photos\" является ссылкой, а остальной текст обычный."
]
}
}
@@ -883,44 +853,19 @@
"description": [
"Sometimes you want to add a elements to your website before you know where they will link.",
"This is also handy when you're changing the behavior of a link using jQuery, which we'll learn about later.",
+ "
",
"The current value of the href attribute is a link that points to \"http://freecatphotoapp.com\". Replace the href attribute value with a #, also known as a hash symbol, to create a dead link."
],
"challengeSeed": [
- "",
- "",
- "",
- "CatPhotoApp
",
- "",
- "Click here to view more cat photos.
",
- "",
- "",
- "",
- "Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.
",
- "Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.
"
+ "CatPhotoApp
",
+ "",
+ " Click here to view more cat photos.
",
+ " ",
+ " ",
+ " ",
+ " Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.
",
+ " Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.
",
+ " "
],
"tests": [
"assert($(\"a\").attr(\"href\") === \"#\", 'message: Your a element should be a dead link with the value of the href attribute set to \"#\".');"
@@ -933,6 +878,7 @@
"description": [
"Manchmal wirst du a Elemente zu deiner Website hinzufügen möchten, ohne dass du das Ziel des Links kennst.",
"Das ist auch nützlich, wenn du die Funktion eines Links mit jQuery verändern willst. Das werden wir später noch behandeln.",
+ "
",
"Ersetze den Inhalt des href Attributs deines a Elements mit einem #, auch bekannt als Hash Symbol, um einen toten Link zu erzeugen."
]
},
@@ -941,6 +887,7 @@
"description": [
"A veces quieres agregar elementos a a tu sitio web antes de saber qué enlazarán.",
"Esto también es útil cuando estás cambiando el comportamiento de un enlace usando jQuery, lo cual aprenderemos más adelante.",
+ "
",
"Reemplaza el atributo href de tu elemento a con un #, también conocido como un símbolo de número o de hash, para convertirlo en un vínculo muerto."
]
},
@@ -949,6 +896,7 @@
"description": [
"As vezes você pode querer adicionar elementos a em sua página web antes de saber o link que as ligará.",
"Isso também é útil quando você desejar mudar o comportamento de um link utilizando jQuery, o que vamos aprender mais adiante.",
+ "
",
"Substitua o atributo href de seu elemento a por um #, também conhecido como símbolo de hash ou hashtag. Isso o transformará em um link inativo."
]
},
@@ -957,6 +905,7 @@
"description": [
"Иногда вам нужно добавить элементы a к вашему сайту до того, как вы знаете куда будут вести ссылки.",
"Также это может оказаться полезно, когда вы меняете поведение ссылки используя jQuery, что мы изучим позже.",
+ "
",
"Замените значение атрибута href вашего элемента a на #, известное как хэш-символ, для превращения элемента в мёртвую ссылку."
]
}
@@ -970,48 +919,23 @@
"Nest your image within an a element. Here's an example:",
"<a href=\"#\"><img src=\"https://bit.ly/fcc-running-cats\" alt=\"Three kittens running towards the camera.\"></a>",
"Remember to use # as your a element's href property in order to turn it into a dead link.",
+ "
",
"Place the existing image element within an anchor element.",
"Once you've done this, hover over your image with your cursor. Your cursor's normal pointer should become the link clicking pointer. The photo is now a link."
],
"challengeSeed": [
- "",
- "",
- "",
- "CatPhotoApp
",
- "",
- "Click here for cat photos.
",
- "",
- "",
- "",
- "Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.
",
- "Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.
"
+ "CatPhotoApp
",
+ "",
+ " Click here to view more cat photos.
",
+ " ",
+ " ",
+ " ",
+ " Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.
",
+ " Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.
",
+ " "
],
"tests": [
- "assert($(\"a\").children(\"img.smaller-image\").length > 0, 'message: Nest the existing img element within an a element.');",
+ "assert($(\"a\").children(\"img\").length > 0, 'message: Nest the existing img element within an a element.');",
"assert(new RegExp(\"#\").test($(\"a\").children(\"img\").parent().attr(\"href\")), 'message: Your a element should be a dead link with a href attribute set to #.');",
"assert(code.match(/<\\/a>/g) && code.match(//g).length === code.match(/a elements has a closing tag.');"
],
@@ -1022,6 +946,7 @@
"title": "Verlinke ein Bild",
"description": [
"Du kannst jedes Element in einen Link verwandeln, indem du es mit einem a Element umschließt.",
+ "
",
"Umschließe dein Bild mit einem a Element. Hier ist ein Beispiel:",
"<a href=\"#\"><img src=\"https://bit.ly/fcc-running-cats\"></a>",
"Vergewissere dich, dass du ein # innerhalb des href Attributs des a Elements nutzt, um daraus einen toten Link zu machen.",
@@ -1032,6 +957,7 @@
"title": "Convierte una imagen en un vínculo",
"description": [
"Puedes convertir elementos en enlaces al anidarlos dentro de un elemento a.",
+ "
",
"Anida tu imagen dentro de un elemento a. He aquí un ejemplo: ",
"<a href=\"#\"><img src=\"https://bit.ly/fcc-running-cats\"/></a>",
"Recuerda usar # como atributo href de tu elemento a con el fin de convertirlo en un vínculo muerto.",
@@ -1042,6 +968,7 @@
"title": "Transforme uma Imagem em um Link",
"description": [
"Você pode transformar elementos em links ao aninhá-los com um elemento a.",
+ "
",
"Aninhe sua imagem dentro de um elemento a. Temos aqui um exemplo.",
"<a href=\"#\"><img src=\"https://bit.ly/fcc-running-cats\"/></a>",
"Lembre de usar # como atributo href de seu elemento a para tornar o link inativo."
@@ -1051,6 +978,7 @@
"title": "Превратите изображение в ссылку",
"description": [
"Вы можете превратить элементы в ссылки путём их вложения внутрь элементов a.",
+ "
",
"Вложите ваше изображение в элемент a. Вот пример:",
"<a href=\"#\"><img src=\"https://bit.ly/fcc-running-cats\"></a>",
"Не забывайте использовать # в качестве значения атрибута href вашего элемента a для превращения ссылки в мёртвую.",
@@ -1068,44 +996,19 @@
"For example: ",
"<ul>
<li>milk</li>
<li>cheese</li>
</ul>
",
"would create a bullet point-style list of \"milk\" and \"cheese\".",
+ "
",
"Remove the last two p elements and create an unordered list of three things that cats love at the bottom of the page."
],
"challengeSeed": [
- "",
- "",
- "",
- "CatPhotoApp
",
- "",
- "Click here for cat photos.
",
- "",
- "",
- "",
- "Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.
",
- "Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.
"
+ "CatPhotoApp
",
+ "",
+ " Click here to view more cat photos.
",
+ " ",
+ " ",
+ " ",
+ " Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.
",
+ " Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.
",
+ " "
],
"tests": [
"assert($(\"ul\").length > 0, 'message: Create a ul element.');",
@@ -1124,6 +1027,7 @@
"Zum Beispiel:",
"<ul>
<li>Milch</li>
<li>Käse</li>
</ul>
",
"würde eine ungeordnete Liste für \"Milch\" und \"Käse\" erstellen.",
+ "
",
"Entferne die letzten zwei p Elemente und erstelle eine ungeordnete Liste von drei Dingen die Katzen lieben am Ende der Seite"
]
},
@@ -1135,6 +1039,7 @@
"Por ejemplo: ",
"<ul>
<li>leche</li>
<li>queso</li>
</ul>
",
"creará una lista con viñetas y con elementos \"leche\" y \"queso\".",
+ "
",
"Elimina los dos últimos elementos p y en la parte inferior de la página crea una lista no ordenada de tres cosas que los gatos aman."
]
},
@@ -1149,6 +1054,7 @@
" <li>queijo</li>",
"</ul>",
"Isso criará uma lista com marcadores que tem como elementos \"leite\" e \"queijo\".",
+ "
",
"Apague os dois últimos elementos p e no final da página crie uma lista não ordenada com três coisas que os gatos adoram."
]
},
@@ -1160,6 +1066,7 @@
"Например: ",
"<ul>
<li>milk</li>
<li>cheese</li>
</ul>
",
"создаст ненумерованный список из \"milk\" и \"cheese\".",
+ "
",
"Удалите последние два элемента p и создайте неупорядоченный список из трёх вещей, которые любят кошки."
]
}
@@ -1174,49 +1081,25 @@
"For example:",
"<ol>
<li>Garfield</li>
<li>Sylvester</li>
</ol>
",
"would create a numbered list of \"Garfield\" and \"Sylvester\".",
+ "
",
"Create an ordered list of the top 3 things cats hate the most."
],
"challengeSeed": [
- "",
- "",
- "",
- "CatPhotoApp
",
- "",
- "Click here for cat photos.
",
- "",
- "",
- "",
- "Things cats love:
",
- "",
- " - cat nip
",
- " - laser pointers
",
- " - lasagna
",
- "
",
- "Top 3 things cats hate:
"
+ "CatPhotoApp
",
+ "",
+ " Click here to view more cat photos.
",
+ " ",
+ " ",
+ " ",
+ " Things cats love:
",
+ " ",
+ " - cat nip
",
+ " - laser pointers
",
+ " - lasagna
",
+ "
",
+ " Top 3 things cats hate:
",
+ " ",
+ " "
],
"tests": [
"assert((/Top 3 things cats hate:/i).test($(\"ol\").prev().text()), 'message: You should have an ordered list for \"Top 3 things cats hate:\"');",
@@ -1238,6 +1121,7 @@
"Zum Beispiel:",
"<ol>
<li>Garfield</li>
<li>Sylvester</li>
</ol>
",
"würde eine nummerierte Liste mit \"Garfield\" und \"Sylvester\" erstellen.",
+ "
",
"Erstelle eine geordnete Liste von den drei Dingen, die Katzen am meisten hassen."
]
},
@@ -1249,6 +1133,7 @@
"Por ejemplo:",
"<ol>
<li>Garfield</li>
<li>Sylvester</li>
</ol>
",
"creará una lista numerada con \"Garfield\" y \"Sylvester\".",
+ "
",
"Crea una lista ordenada de los 3 cosas que más odian los gatos."
]
},
@@ -1263,6 +1148,7 @@
" <li>Sylvester</li>",
"</ol>",
"Isso criará uma lista numerada com \"Garfield\" e \"Sylvester\".",
+ "
",
"Crie uma lista ordenada com as três coisas que os gatos mais odeiam."
]
},
@@ -1274,6 +1160,7 @@
"Например:",
"<ol>
<li>Garfield</li>
<li>Sylvester</li>
</ol>
",
"создаст нумерованный список из \"Garfield\" и \"Sylvester\".",
+ "
",
"Создайте нумерованный список из 3-х вещей, который кошки больше всего ненавидят."
]
}
@@ -1288,54 +1175,31 @@
"You can create one like this:",
"<input type=\"text\">",
"Note that input elements are self-closing.",
+ "
",
"Create an input element of type text below your lists."
],
"challengeSeed": [
- "",
- "",
- "",
- "CatPhotoApp
",
- "",
- "Click here for cat photos.
",
- "",
- "",
- "",
- "Things cats love:
",
- "",
- " - cat nip
",
- " - laser pointers
",
- " - lasagna
",
- "
",
- "Top 3 things cats hate:
",
- "",
- " - flea treatment
",
- " - thunder
",
- " - other cats
",
- "
"
+ "CatPhotoApp
",
+ "",
+ " Click here to view more cat photos.
",
+ " ",
+ " ",
+ " ",
+ " Things cats love:
",
+ " ",
+ " - cat nip
",
+ " - laser pointers
",
+ " - lasagna
",
+ "
",
+ " Top 3 things cats hate:
",
+ " ",
+ " - flea treatment
",
+ " - thunder
",
+ " - other cats
",
+ "
",
+ " ",
+ " ",
+ " "
],
"tests": [
"assert($(\"input[type=text]\").length > 0, 'message: Your app should have an input element of type text.');"
@@ -1351,6 +1215,7 @@
"So kannst du eines erstellen:",
"<input type=\"text\">",
"Beachte, dass input Elemente selbstschließend sind.",
+ "
",
"Erstelle ein input Element des Typ (\"type\") text unter deinen Listen."
]
},
@@ -1362,6 +1227,7 @@
"Puedes crear uno como este:",
"<input type=\"text\">",
"Ten en cuenta que los elementos input son de cierre automático.",
+ "
",
"Crea un elemento input de tipo text debajo de tus listas."
]
},
@@ -1373,6 +1239,7 @@
"Você pode criar um assim:",
"<input type=\"text\">",
"Note que os elementos input são de fechamento automático.",
+ "
",
"Crie um elemento input de tipo text abaixo de suas listas."
]
},
@@ -1384,6 +1251,7 @@
"Вы можете создать текстовое поле следующим образом:",
"<input type=\"text\">",
"Обратите внимание, что элементы input самозакрывающиеся.",
+ "
",
"Создайте элемент input типа text под вашими списками."
]
}
@@ -1396,55 +1264,30 @@
"Your placeholder text is what appears in your text input before your user has input anything.",
"You can create placeholder text like so:",
"<input type=\"text\" placeholder=\"this is placeholder text\">",
+ "
",
"Set the placeholder value of your text input to \"cat photo URL\"."
],
"challengeSeed": [
- "",
- "",
- "",
- "CatPhotoApp
",
- "",
- "Click here for cat photos.
",
- "",
- "",
- "",
- "Things cats love:
",
- "",
- " - cat nip
",
- " - laser pointers
",
- " - lasagna
",
- "
",
- "Top 3 things cats hate:
",
- "",
- " - flea treatment
",
- " - thunder
",
- " - other cats
",
- "
",
- ""
+ "CatPhotoApp
",
+ "",
+ " Click here to view more cat photos.
",
+ " ",
+ " ",
+ " ",
+ " Things cats love:
",
+ " ",
+ " - cat nip
",
+ " - laser pointers
",
+ " - lasagna
",
+ "
",
+ " Top 3 things cats hate:
",
+ " ",
+ " - flea treatment
",
+ " - thunder
",
+ " - other cats
",
+ "
",
+ " ",
+ " "
],
"tests": [
"assert($(\"input[placeholder]\").length > 0, 'message: Add a placeholder attribute to the existing text input element.');",
@@ -1460,6 +1303,7 @@
"Platzhaltertexte erscheinen in deinen input Feldern, bevor der Nutzer etwas eingibt.",
"Du kannst Platzhalter auf folgende Weise erstellen:",
"<input type=\"text\" placeholder=\"Das ist ein Platzhalter.\">",
+ "
",
"Setze bei deinem input Element den Wert für placeholder auf \"cat photo URL\"."
]
},
@@ -1469,6 +1313,7 @@
"El texto de relleno es el que aparece en un campo de texto antes de que un usuario haya ingresado datos.",
"Puedes crear un texto de relleno de esta manera:",
"<input type=\"text\" placeholder=\"este es un texto de relleno\">",
+ "
",
"Establece el valor del texto de relleno de tu campo de texto como \"cat photo URL\"."
]
},
@@ -1478,6 +1323,7 @@
"O texto indicativo é o que aparece em um campo de texto antes que um usuário tenha escrito algo.",
"Você pode criar um texto indicativo assim:",
"<input type=\"text\" placeholder=\"isso é um texto indicativo\">",
+ "
",
"Estabeleça o valor do texto indicativo do seu campo de texto como \"cat photo URL\"."
]
},
@@ -1487,6 +1333,7 @@
"Ваш замещающий текст - это то, что отображается в виде текста внутри input пока пользователь не ввёл туда что-либо.",
"Вы можете создать замещающий текст следующим образом:",
"<input type=\"text\" placeholder=\"это замещающий текст\">",
+ "
",
"Установите значение атрибута placeholder вашего текстового поля input равными \"cat photo URL\"."
]
}
@@ -1499,55 +1346,30 @@
"You can build web forms that actually submit data to a server using nothing more than pure HTML. You can do this by specifying an action on your form element.",
"For example:",
"<form action=\"/url-where-you-want-to-submit-form-data\"></form>",
+ "
",
"Nest your text field in a form element. Add the action=\"/submit-cat-photo\" attribute to this form element."
],
"challengeSeed": [
- "",
- "",
- "",
- "CatPhotoApp
",
- "",
- "Click here for cat photos.
",
- "",
- "",
- "",
- "Things cats love:
",
- "",
- " - cat nip
",
- " - laser pointers
",
- " - lasagna
",
- "
",
- "Top 3 things cats hate:
",
- "",
- " - flea treatment
",
- " - thunder
",
- " - other cats
",
- "
",
- ""
+ "CatPhotoApp
",
+ "",
+ " Click here to view more cat photos.
",
+ " ",
+ " ",
+ " ",
+ " Things cats love:
",
+ " ",
+ " - cat nip
",
+ " - laser pointers
",
+ " - lasagna
",
+ "
",
+ " Top 3 things cats hate:
",
+ " ",
+ " - flea treatment
",
+ " - thunder
",
+ " - other cats
",
+ "
",
+ " ",
+ ""
],
"tests": [
"assert($(\"form\") && $(\"form\").children(\"input\") && $(\"form\").children(\"input\").length > 0, 'message: Nest your text input element within a form element.');",
@@ -1563,6 +1385,7 @@
"Du kannst Web Formulare bauen, die Daten zu einem Server übertragen – und das nur mit HTML. Das wird möglich, indem du eine Aktion für dein form Element bestimmst.",
"Zum Beispiel:",
"<form action=\"/url-wohin-du-deine-formular-daten-senden-willst\"></form>",
+ "
",
"Umschließe dein Textfeld mit einem form Element. Füge anschließend das Attribut action=\"/submit-cat-photo\" hinzu."
]
},
@@ -1572,6 +1395,7 @@
"Puedes construir formularios web que realmente envíen datos a un servidor usando nada más que HTML puro. Puedes hacerlo especificando una acción en tu elemento form.",
"Por ejemplo:",
"<form action=\"/url-al-que-quieres-enviar-los-datos-del-formulario\"></form>",
+ "
",
"Anida tu campo de texto en un elemento form. Agrega el atributo action=\"/submit-cat-photo\" a este elemento de formulario."
]
},
@@ -1581,6 +1405,7 @@
"É possível construir formulários web que realmente enviem dados a um servidor utilizando nada além de HTML puro. Você pode fazer isso especificando uma ação em seu elemento form.",
"Por exemplo:",
"<form action=\"/url-para-onde-você-quer-enviar-os-dados-do-formulário\"></form>",
+ "
",
"Aninhe seu campo de texto em um elemento form. Adicione o atributo action=\"/submit-cat-photo\" para este elemento de formulário."
]
},
@@ -1590,6 +1415,7 @@
"Вы можете строить web-формы, которые отправляют данные серверу, не ипользуя ничего кроме HTML. Вы можете достичь этого указанием действия в атрибутах элемента form.",
"Например:",
"<form action=\"/url-куда-вы-хотите-отправить-данные-формы\"></form>",
+ "
",
"Вложите ваше текстовое поле в элемент form. Добавьте атрибут action=\"/submit-cat-photo\" к этому элементу формы."
]
}
@@ -1602,57 +1428,32 @@
"Let's add a submit button to your form. Clicking this button will send the data from your form to the URL you specified with your form's action attribute.",
"Here's an example submit button:",
"<button type=\"submit\">this button submits the form</button>",
+ "
",
"Add a submit button to your form element with type submit and \"Submit\" as its text."
],
"challengeSeed": [
- "",
- "",
- "",
- "CatPhotoApp
",
- "",
- "Click here for cat photos.
",
- "",
- "",
- "",
- "Things cats love:
",
- "",
- " - cat nip
",
- " - laser pointers
",
- " - lasagna
",
- "
",
- "Top 3 things cats hate:
",
- "",
- " - flea treatment
",
- " - thunder
",
- " - other cats
",
- "
",
- ""
+ "CatPhotoApp
",
+ "",
+ " Click here to view more cat photos.
",
+ " ",
+ " ",
+ " ",
+ " Things cats love:
",
+ " ",
+ " - cat nip
",
+ " - laser pointers
",
+ " - lasagna
",
+ "
",
+ " Top 3 things cats hate:
",
+ " ",
+ " - flea treatment
",
+ " - thunder
",
+ " - other cats
",
+ "
",
+ " ",
+ " "
],
"tests": [
"assert($(\"form\").children(\"button\").length > 0, 'message: Your form should have a button inside it.');",
@@ -1669,6 +1470,7 @@
"Lass uns nun einen submit Button hinzufügen. Durch einen Klick auf diesen Button werden die Daten des Formulars an die URL gesendet, welche du in dem action Attribut deines Formulars angegeben hast.",
"Hier ist ein Beispiel einen solchen Button:",
"<button type=\"submit\">Dieser Button überträgt die Daten des Formulars.</button>",
+ "
",
"Füge einen Button zum Senden mit dem Typ submit und \"Submit\" als Text zu deinem form Element hinzu."
]
},
@@ -1678,6 +1480,7 @@
"Añadamos un elemento submit a tu formulario. Al hacer clic en este botón enviará los datos del formulario a la URL especificada en el atributo action de tu formulario. ",
"He aquí un ejemplo de un botón de envío:",
"<button type=\" submit\">este botón envía el formulario</botón>",
+ "
",
"Agrega un botón de enviar a tu elemento form con el tipo submit y con el texto \"Submit\"."
]
},
@@ -1687,6 +1490,7 @@
"Vamos inserir um elemento submit ao seu formulário. Ao clicar neste botão, os dados inseridos serão enviados para a URL especificada no atributo action do formulário.",
"Aqui está um exemplo de um botão de enviar:",
"<button type=\" submit\">este botão enviará o formulário</button>",
+ "
",
"Adicione um botão de enviar ao seu elemento form com o tipo submit e com o texto \"Submit\"."
]
},
@@ -1696,6 +1500,7 @@
"Давайте добавим кнопку отправки submit к вашей форме. Нажатие на эту кнопку отправит данные из вашей формы по адресу, указанному в атрибуте action вашей формы.",
"Вот пример кнопки отправки:",
"<button type=\"submit\">эта кнопка отправляет данные формы</button>",
+ "
",
"Добавьте кнопку отправки к вашему элементу form с указанием типа submit и \"Submit\" в качестве отображаемого текста."
]
}
@@ -1707,60 +1512,35 @@
"description": [
"You can require specific form fields so that your user will not be able to submit your form until he or she has filled them out.",
"For example, if you wanted to make a text input field required, you can just add the word required within your input element, like this: <input type=\"text\" required>",
+ "
",
"Make your text input a required field, so that your user can't submit the form without completing this field.",
"Then try to submit the form without inputing any text. See how your HTML5 form notifies you that the field is required?",
- "Note: This field does not work in Safari."
+ "Note
This field does not work in Safari."
],
"challengeSeed": [
- "",
- "",
- "",
- "CatPhotoApp
",
- "",
- "Click here for cat photos.
",
- "",
- "",
- "",
- "Things cats love:
",
- "",
- " - cat nip
",
- " - laser pointers
",
- " - lasagna
",
- "
",
- "Top 3 things cats hate:
",
- "",
- " - flea treatment
",
- " - thunder
",
- " - other cats
",
- "
",
- ""
+ "CatPhotoApp
",
+ "",
+ " Click here to view more cat photos.
",
+ " ",
+ " ",
+ " ",
+ " Things cats love:
",
+ " ",
+ " - cat nip
",
+ " - laser pointers
",
+ " - lasagna
",
+ "
",
+ " Top 3 things cats hate:
",
+ " ",
+ " - flea treatment
",
+ " - thunder
",
+ " - other cats
",
+ "
",
+ " ",
+ " "
],
"tests": [
"assert($(\"input\").prop(\"required\"), 'message: Your text input element should have the required attribute.');"
@@ -1773,6 +1553,7 @@
"description": [
"Du kannst bestimmte Felder eines Formulars zu Pflichtfeldern erklären. Damit ist es deinen Usern nicht mehr möglich, das Formular abzuschicken, ohne die Pflichtfelder auszufüllen.",
"Um zum Beispiel ein Textfeld zum Pflichtfeld zu erklären, kannst du einfach ein required innerhalb deines input Elements hinzufügen: <input type=\"text\" required>",
+ "
",
"Mache aus deinem input Feld ein Pflichtfeld – \"required\" – damit deine Nutzer das Formular nicht abschicken können, ohne dieses Feld auszufüllen.",
"Probier dann dein Formular ohne einen Text abzuschicken. Siehst du wie dein HTML5 Formular dich darauf hinweißt dass das Feld verpflichtend ist?",
"Beachte: dieses Feld funktioniert nicht in Safari."
@@ -1783,6 +1564,7 @@
"description": [
"Puedes especificar un campo obligatorio en un formulario para que tu usuario no pueda enviar el formulario hasta que lo haya llenado.",
"Por ejemplo, si quieres requerir obligatoriamente un campo de texto, puedes agregar la palabra required dentro de tu elemento input, usarías: <input type=\"text\" required> ",
+ "
",
"Haz de tu campo de texto un campo obligatorio, de manera que tu usuario no pueda enviar el formulario sin completar este campo.",
"Luego, intenta enviar el formulario sin ingresar texto alguno. ¿Ves cómo tu formulario HTML5 te notifica que el campo es obligatorio?",
"Nota: Este campo no funciona en Safari."
@@ -1793,6 +1575,7 @@
"description": [
"Você pode especificar um campo como obrigatório para que seu usuário não consiga enviar o formulário até que o tenha completado.",
"Por exemplo, se você quiser tornar obrigatório um campo de texto, basta adicionar a palavra required dentro de seu elemento input assim: <input type=\"text\" required>",
+ "
",
"Faça com que seu campo de texto seja obrigatório, de forma que o usuário não possa enviar o formulário sem ter completado esse campo.",
"Após isso, tente enviar o formulário sem digitar nenhum texto no campo. Percebe como seu formulário HTML5 mostra que o campo é obrigatório?"
]
@@ -1802,6 +1585,7 @@
"description": [
"Вы можете требовать заполнения определённых полей формы, таким образом пользователь не сможет отправить данные формы до их заполнения.",
"Например, если бы вы хотели сделать заполнение текстового поля обязательным, вы могли бы добавить слово required внутрь вашего элемента input: <input type=\"text\" required>",
+ "
",
"Сделайте ваше текстовое поле input обязательным required для заполнения, чтобы пользователь не мог отправить данные формы без заполнения этого поля.",
"Далее попробуйте отправить данные формы без ввода какого-либо текста. Видите как ваша HTML5-форма уведомляет вас о том, что поле обязательное для заполнения?",
"Внимание: это поле не работает в Safari."
@@ -1819,58 +1603,33 @@
"All related radio buttons should have the same name attribute.",
"Here's an example of a radio button:",
"<label><input type=\"radio\" name=\"indoor-outdoor\"> Indoor</label>",
+ "
",
"Add a pair of radio buttons to your form. One should have the option of indoor and the other should have the option of outdoor."
],
"challengeSeed": [
- "",
- "",
- "",
- "CatPhotoApp
",
- "",
- "Click here for cat photos.
",
- "",
- "",
- "",
- "Things cats love:
",
- "",
- " - cat nip
",
- " - laser pointers
",
- " - lasagna
",
- "
",
- "Top 3 things cats hate:
",
- "",
- " - flea treatment
",
- " - thunder
",
- " - other cats
",
- "
",
- ""
+ "CatPhotoApp
",
+ "",
+ " Click here to view more cat photos.
",
+ " ",
+ " ",
+ " ",
+ " Things cats love:
",
+ " ",
+ " - cat nip
",
+ " - laser pointers
",
+ " - lasagna
",
+ "
",
+ " Top 3 things cats hate:
",
+ " ",
+ " - flea treatment
",
+ " - thunder
",
+ " - other cats
",
+ "
",
+ " ",
+ " "
],
"tests": [
"assert($('input[type=\"radio\"]').length > 1, 'message: Your page should have two radio button elements.');",
@@ -1892,6 +1651,7 @@
"Alle Radiobuttons mit Bezug zueinander sollten das gleiche name Attribut teilen.",
"Ein Beispiel eines Radiobuttons:",
"<label><input type=\"radio\" name=\"indoor-outdoor\"> Indoor</label>",
+ "
",
"Füge ein Paar Radiobuttons zu deinem Formular hinzu. Einer sollte die Option indoor und der andere die Option outdoor haben."
]
},
@@ -1904,6 +1664,7 @@
"Todos los botones de radio relacionados deben tener el mismo atributo name.",
"He aquí un ejemplo de un botón de radio:",
"<label><input type=\"radio\" name=\"dentro-fuera\"> Dentro</label>",
+ "
",
"Agrega un par de botones de radio a tu formulario. Uno debe tener la opción de indoor y el otro debe tener la opción outdoor. "
]
},
@@ -1916,6 +1677,7 @@
"Todos os botões de seleção relacionados devem ter o mesmo atributo name.",
"Temos aqui um exemplo de um botão de seleção/rádio:",
"<label><input type=\"radio\" name=\"indoor-outdoor\"> Indoor</label>",
+ "
",
"Adicione um par de botões de seleção ao seu formulário. Um deles deve ter a opção indoor enquanto o outro deve ter a opção outdoor."
]
},
@@ -1928,6 +1690,7 @@
"Все относящиеся друг к другу, формирующие группу, радио-кнопки должны иметь один и тот же атрибут name.",
"Вот пример радио-кнопки:",
"<label><input type=\"radio\" name=\"indoor-outdoor\"> Indoor</label>",
+ "
",
"Добавьте пару радио-кнопок к вашей форме. Одна должна соответствовать варианту indoor, а другая - outdoor."
]
}
@@ -1943,60 +1706,35 @@
"All related checkbox inputs should have the same name attribute.",
"Here's an example of a checkbox:",
"<label><input type=\"checkbox\" name=\"personality\"> Loving</label>",
+ "
",
"Add to your form a set of three checkboxes. Each checkbox should be nested within its own label element. All three should share the name attribute of personality."
],
"challengeSeed": [
- "",
- "",
- "",
- "CatPhotoApp
",
- "",
- "Click here for cat photos.
",
- "",
- "",
- "",
- "Things cats love:
",
- "",
- " - cat nip
",
- " - laser pointers
",
- " - lasagna
",
- "
",
- "Top 3 things cats hate:
",
- "",
- " - flea treatment
",
- " - thunder
",
- " - other cats
",
- "
",
- ""
+ "CatPhotoApp
",
+ "",
+ " Click here to view more cat photos.
",
+ " ",
+ " ",
+ " ",
+ " Things cats love:
",
+ " ",
+ " - cat nip
",
+ " - laser pointers
",
+ " - lasagna
",
+ "
",
+ " Top 3 things cats hate:
",
+ " ",
+ " - flea treatment
",
+ " - thunder
",
+ " - other cats
",
+ "
",
+ " ",
+ " "
],
"tests": [
"assert($('input[type=\"checkbox\"]').length > 2, 'message: Your page should have three checkbox elements.');",
@@ -2016,6 +1754,7 @@
"Alle zusammengehörende Checkboxes sollten das gleiche name Attribut haben.",
"Hier ist ein Beispiel für eine Checkbox:",
"<label><input type=\"checkbox\" name=\"personality\"> Loving</label>",
+ "
",
"Füge deinem Formular drei Checkboxen hinzu. Jedes dieser Elemente sollte innerhalb seines eigenen label Elements liegen. Alle sollten das gleiche name Attribut personality teilen."
]
},
@@ -2028,6 +1767,7 @@
"Todas las entradas de casillas de verificación relacionadas deben tener el mismo atributo name.",
"He aquí un ejemplo de una casilla de verificación:",
"<label><input type=\"checkbox\" name=\"personalidad\"> Cariñoso</label>",
+ "
",
"Añade a tu formulario un conjunto de tres casillas de verificación. Cada casilla de verificación debe estar anidada dentro de su propio elemento label. Las tres deben tener personality como su atributo name."
]
},
@@ -2040,6 +1780,7 @@
"Todas as caixas de seleção relacionadas devem ter o mesmo atributo name.",
"Veja aqui um exemplo de uma caixa de verificação:",
"<label><input type=\"checkbox\" name=\"personality\"> Carinhoso</label>",
+ "
",
"Adicione ao seu formulário um conjunto de três caixas de verificação. Cada uma delas deve estar aninhada dentro de seu próprio elemento label. As três devem compartilhar o atributo name."
]
},
@@ -2052,6 +1793,7 @@
"Все относящиеся друг к другу флаги должны иметь одинаковый атрибут name.",
"Вот пример флаговой кнопки:",
"<label><input type=\"checkbox\" name=\"personality\"> Loving</label>",
+ "
",
"Добавьте набор из трёх флаговых кнопок к вашей форме. Каждый флаг должен быть вложен внутрь собственного элемента label. Все три флага должны иметь одинаковый атрибут name, значение которго равно personality."
]
}
@@ -2064,63 +1806,38 @@
"You can set a checkbox or radio button to be checked by default using the checked attribute.",
"To do this, just add the word \"checked\" to the inside of an input element. For example:",
"<input type=\"radio\" name=\"test-name\" checked>",
+ "
",
"Set the first of your radio buttons and the first of your checkboxes to both be checked by default."
],
"challengeSeed": [
- "",
- "",
- "",
- "CatPhotoApp
",
- "",
- "Click here for cat photos.
",
- "",
- "",
- "",
- "Things cats love:
",
- "",
- " - cat nip
",
- " - laser pointers
",
- " - lasagna
",
- "
",
- "Top 3 things cats hate:
",
- "",
- " - flea treatment
",
- " - thunder
",
- " - other cats
",
- "
",
- ""
+ "CatPhotoApp
",
+ "",
+ " Click here to view more cat photos.
",
+ " ",
+ " ",
+ " ",
+ " Things cats love:
",
+ " ",
+ " - cat nip
",
+ " - laser pointers
",
+ " - lasagna
",
+ "
",
+ " Top 3 things cats hate:
",
+ " ",
+ " - flea treatment
",
+ " - thunder
",
+ " - other cats
",
+ "
",
+ " ",
+ " "
],
"tests": [
"assert($('input[type=\"radio\"]').prop(\"checked\"), 'message: Your first radio button on your form should be checked by default.');",
@@ -2135,6 +1852,7 @@
"Du kannst Checkboxen und Radiobuttons standardmäßig markiert machen, indem du das checked Attribut verwendest.",
"Das kannst du erreichen, indem du das Word \"checked\" innerhalb des Inputelements eingefügst. Zum Beispiel so:",
"<input type=\"radio\" name=\"test-name\" checked>",
+ "
",
"Stelle sicher, dass jeweils deine ersten Radiobuttons und Checkboxen standardmäßig markiert sind."
]
},
@@ -2144,6 +1862,7 @@
"Puedes marcar por omisión una casilla de verificación o un botón de radio usando el atributo checked.",
"Para ello, sólo tienes que añadir la palabra \"checked\" en el interior de un elemento input. Por ejemplo:",
"<input type=\"radio\" name=\"nombre-de-prueba\" checked>",
+ "
",
"Establece como marcados por omisión el primero de tus botones de radio y la primera casilla de verificación."
]
},
@@ -2153,6 +1872,7 @@
"É possível deixar um botão ou caixa de seleção ativado por padrão ao utilizar o atributo checked.",
"Para isso, basta você acrescentar a palavra \"checked\" no interior de um elemento de entrada. Por exemplo:",
"<input type=\"radio\" name=\"nome-de-teste\" checked>",
+ "
",
"Estabeleça como marcados por padrão o primeiro dos seus botões de seleção/rádio e a primeira caixa de seleção."
]
},
@@ -2162,6 +1882,7 @@
"Вы можете установить флаг или радио-кнопку отмеченной по-умолчанию с помощью атрибута checked.",
"Для этого добавьте слово \"checked\" в качестве атрибута элемента input. Например:",
"<input type=\"radio\" name=\"test-name\" checked>",
+ "
",
"Установите первую радио-кнопку и первый флаг из наборов отмеченными по-умолчанию."
]
}
@@ -2172,67 +1893,42 @@
"title": "Nest Many Elements within a Single Div Element",
"description": [
"The div element, also known as a division element, is a general purpose container for other elements.",
- "The div element is probably the most commonly used HTML element of all. It's useful for passing the CSS of its own class declarations down to all the elements that it contains.",
+ "The div element is probably the most commonly used HTML element of all.",
"Just like any other non-self-closing element, you can open a div element with <div> and close it on another line with </div>.",
+ "
",
"Try putting your opening div tag above your \"Things cats love\" p element and your closing div tag after your closing ol tag so that both of your lists are within one div.",
"Nest your \"Things cats love\" and \"Things cats hate\" lists all within a single div element."
],
"challengeSeed": [
- "",
- "",
- "",
- "CatPhotoApp
",
- "",
- "Click here for cat photos.
",
- "",
- "",
- "",
- "Things cats love:
",
- "",
- " - cat nip
",
- " - laser pointers
",
- " - lasagna
",
- "
",
- "Top 3 things cats hate:
",
- "",
- " - flea treatment
",
- " - thunder
",
- " - other cats
",
- "
",
- "",
- ""
+ "CatPhotoApp
",
+ "",
+ " Click here to view more cat photos.
",
+ " ",
+ " ",
+ " ",
+ " Things cats love:
",
+ " ",
+ " - cat nip
",
+ " - laser pointers
",
+ " - lasagna
",
+ "
",
+ " Top 3 things cats hate:
",
+ " ",
+ " - flea treatment
",
+ " - thunder
",
+ " - other cats
",
+ "
",
+ " ",
+ " ",
+ " "
],
"tests": [
"assert($(\"div\").children(\"p\").length > 1, 'message: Nest your p elements inside your div element.');",
@@ -2247,8 +1943,9 @@
"title": "Umschließe viele Elemente mit einem einzigen Div Element",
"description": [
"Das div Element oder \"Division\" ist ein allgemeiner Container für andere Elemente.",
- "Das div Element ist wahrscheinlich das am häufigsten verwendete HTML Element. Es ist nützlich um die CSS Stile der eigenen Klasse an die enthaltenen Elemente zu vererben.",
+ "Das div Element ist wahrscheinlich das am häufigsten verwendete HTML Element.",
"Wie jedes andere Element – das sich nicht selbst schließt – kannst du ein div Element mit <div> öffnen und mit </div> wieder schließen.",
+ "
",
"Versuche dein öffnendes div Element überhalb des p Elements von \"Things cats love\" und das schließende div unterhalb des schließenden ol Elements zu platzieren. Damit befinden sich beide Listen innerhalb eines div",
"Umschließe deine \"Thins cats love\" und \"Things cats hate\" Listen mit einem einzelnen div Element."
]
@@ -2257,8 +1954,9 @@
"title": "Anida muchos elementos dentro de una sólo elemento Div",
"description": [
"El elemento div, también conocido como un elemento de división, es un contenedor de propósito general para otros elementos.",
- "El elemento div es probablemente el elemento HTML más utilizado. Es útil para pasar el CSS de sus propias declaraciones de clase a todos los elementos que contiene. ",
+ "El elemento div es probablemente el elemento HTML más utilizado.",
"Al igual que cualquier otro elemento sin cierre automático, puedes abrir una etiqueta div con <div> y cerrarla en otra línea con </div> .",
+ "
",
"Trata de poner tu etiqueta de apertura div por encima de elemento p \"Things cat love\", y tu etiqueta de cierre de div después de tu etiqueta de cierre de ol, para que cada una de tus listas estén dentro de un div. ",
"Anida tus listas \"Things cats love\" y \"Things cats hate\" dentro de un solo elemento div."
]
@@ -2267,8 +1965,9 @@
"title": "Aninhe Muitos Elementos Dentro de um só Elemento Div",
"description": [
"O elemento div, também conhecido como elemento de divisão, é um contentor de propósito geral para outros elementos.",
- "O elemento div é provavelmente o elemento HTML mais utilizado. Ele é útil para adicionar o CSS de suas próprias declarações de classe para todos os elementos que o contém.",
+ "O elemento div é provavelmente o elemento HTML mais utilizado.",
"Da mesma forma que qualquer outro elemento sem fechamento automático, você deve abrir uma tag div com <div> e fechá-la em outra linha com </div>.",
+ "
",
"Tente colocar sua tag de abertura div acima do elemento p \"Things cat love\", e sua tag de fechamento de div depois da tag de fechamento do ol, para que cada uma de suas listas esteja dentro de um div.",
"Aninhe suas listas \"Things cats love\" e \"Things cats hate\" no interior de um único elemento div."
]
@@ -2277,8 +1976,9 @@
"title": "Вложите множество элементов внутрь одного элемента div",
"description": [
"Элемент div, известный как элемент раздела, является контейнером общего назначения для других элементов.",
- "Элемент div возможно наиболее широко используемый HTML элемент из всех возможных. Он полезен для передачи собственных CSS-свойств вниз по дереву элементов, которые он содержит.",
+ "Элемент div возможно наиболее широко используемый HTML элемент из всех возможных.",
"Как и с любым другим несамозакрывающимся элементом, вы можете открыть элемент div меткой <div> и закрыть на следующей строке меткой </div>.",
+ "
",
"Попробуйте разместить открывающую метку div над вашим элементом p с текстом \"Things cats love\", а закрывающую метку div после закрытия элемента ol, таким образом оба ваших списка оказываются внутри одного элемента div.",
"Вложите ваши списки \"Things cats love\" и \"Things cats hate\" внутрь одного элемента div."
]