fix: sync english and chinese responsive web design challenges (#38309)

curriculum/challenges/chinese/01-responsive-web-design/basic-html-and-html5/add-images-to-your-website.chinese.md

@@ -23,7 +23,7 @@ localeTitle: 给网站添加图片
 ## Instructions
 <section id='instructions'>
 让我们给网站添加图片：
-在<code>h2</code>元素前，插入一个<code>img</code>元素
+在<code>main</code>元素里面，给<code>p</code>前面插入一个<code>img</code>元素
 现在设置<code>src</code>属性指向这个地址：
 <code>https://bit.ly/fcc-relaxing-cat</code>
 最后不要忘记给图片添加一个<code>alt</code>文本。
@@ -34,11 +34,11 @@ localeTitle: 给网站添加图片
 
 ```yml
 tests:
-  - text: '网页应该有一张图片。'
+  - text: 网页应该有一张图片。
     testString: assert($("img").length);
-  - text: '图片 src 属性应该为 https://bit.ly/fcc-relaxing-cat。'
+  - text: <code>img</code> 应该有一个<code>src</code>属性，指向猫咪图片。
     testString: assert(/^https:\/\/bit\.ly\/fcc-relaxing-cat$/i.test($("img").attr("src")));
-  - text: '图片必须有<code>alt</code>属性。'
+  - text: <code>img</code> 元素的<code>alt</code>属性值不应为空。
     testString: assert($("img").attr("alt") && $("img").attr("alt").length && /<img\S*alt=(['"])(?!\1|>)\S+\1\S*\/?>/.test(code.replace(/\s/g,'')));
 
 ```

curriculum/challenges/chinese/01-responsive-web-design/basic-html-and-html5/add-placeholder-text-to-a-text-field.chinese.md

@@ -24,12 +24,14 @@ localeTitle: 给输入框添加占位符文本
 
 ```yml
 tests:
-  - text: '给现有的<code>input</code>输入框添加一个<code>placeholder</code>属性。'
+  - text: 给现有的<code>input</code>输入框添加一个<code>placeholder</code>属性。
     testString: assert($("input[placeholder]").length > 0);
-  - text: '设置<code>placeholder</code>属性的值为 ”猫咪图片地址“。'
+  - text: 设置<code>placeholder</code>属性的值为 ”猫咪图片地址“。
     testString: assert($("input") && $("input").attr("placeholder") && $("input").attr("placeholder").match(/猫咪图片地址/gi));
-  - text: '<code>input</code>输入框的语法必须正确。'
-    testString: 'assert($("input[type=text]").length > 0 && code.match(/<input((\s+\w+(\s*=\s*(?:".*?"|''.*?''|[\^''">\s]+))?)+\s*|\s*)\/?>/gi));'
+  - text: 完整的<code>input</code>元素应有一个结束标签
+    testString: assert(!code.match(/<input.*\/?>.*<\/input>/gi));
+  - text: <code>input</code>输入框的语法必须正确。
+    testString: assert($("input[type=text]").length > 0);
 ```
 
 </section>

curriculum/challenges/chinese/01-responsive-web-design/basic-html-and-html5/create-a-bulleted-unordered-list.chinese.md

@@ -33,14 +33,16 @@ HTML 有一个特定的元素用于创建无序列表<code>unordered lists（缩
 
 ```yml
 tests:
-  - text: '创建一个<code>ul</code>无序列表。'
+  - text: 创建一个<code>ul</code>无序列表。
     testString: assert($("ul").length > 0);
-  - text: '你应该在<code>ul</code>无序列表中添加三个<code>li</code>条目。'
+  - text: 你应该在<code>ul</code>无序列表中添加三个<code>li</code>条目。
     testString: assert($("ul li").length > 2);
-  - text: '确保<code>ul</code>无序列表有结束标记。'
+  - text: 确保<code>ul</code>无序列表有结束标记。
     testString: assert(code.match(/<\/ul>/gi) && code.match(/<ul/gi) && code.match(/<\/ul>/gi).length === code.match(/<ul/gi).length);
-  - text: '确保每个<code>li</code>条目都有结束标记。'
+  - text: 确保每个<code>li</code>条目都有结束标记。
     testString: assert(code.match(/<\/li>/gi) && code.match(/<li[\s>]/gi) && code.match(/<\/li>/gi).length === code.match(/<li[\s>]/gi).length);
+  - text: 每个<code>li</code>元素都应该有一个空字符串或者空格。
+    testString: assert($("ul li").filter((_, item) => !$(item).text().trim()).length === 0);
 
 ```