Translate responsive-web-design-projects#2
Conversation
S1ngS1ng
left a comment
There was a problem hiding this comment.
- 根据群里的讨论,
您=>你 - 注意标点和空格
- 注意拼写,英文部分与原文一致即可
| "<strong>User Story #7:</strong> I should see an <code>a</code> element with a corresponding <code>id=\"tribute-link\"</code>, which links to an outside site that contains additional information about the subject of the tribute page. HINT: You must give your element an attribute of <code>target</code> and set it to <code>_blank</code> in order for your link to open in a new tab (i.e. <code>target=\"_blank\"</code>).", | ||
| "<strong>User Story #8:</strong> The <code>img</code> element should responsively resize, relative to the width of its parent element, without exceeding its original size.", | ||
| "<strong>目标:</strong> 使用 <a href='https://codepen.io' target='_blank'>CodePen.io</a> 搭建一个与这个功能上相似的 app: <a href='https://codepen.io/freeCodeCamp/full/zNqgVx' target='_blank'>https://codepen.io/freeCodeCamp/full/zNqgVx</a>.", | ||
| "满足以下 <a href='https://en.wikipedia.org/wiki/User_story' target='_blank'>用户故事</a> 并且通过所有的测试,你可以根据自己喜好装饰它", |
There was a problem hiding this comment.
整句建议:
在满足以下 <a href='https://en.wikipedia.org/wiki/User_story' target='_blank'>用户故事</a> 并能通过所有测试的前提下,你可以根据自己的喜好来美化你的 app。
注意结尾要加句号
| "<strong>User Story #8:</strong> The <code>img</code> element should responsively resize, relative to the width of its parent element, without exceeding its original size.", | ||
| "<strong>目标:</strong> 使用 <a href='https://codepen.io' target='_blank'>CodePen.io</a> 搭建一个与这个功能上相似的 app: <a href='https://codepen.io/freeCodeCamp/full/zNqgVx' target='_blank'>https://codepen.io/freeCodeCamp/full/zNqgVx</a>.", | ||
| "满足以下 <a href='https://en.wikipedia.org/wiki/User_story' target='_blank'>用户故事</a> 并且通过所有的测试,你可以根据自己喜好装饰它", | ||
| "您可以使用 HTML、JavaScript 以及 CSS 来完成项目,因为这是目前这节课所涉及的内容,我们推荐使用纯CSS代码,建议当前应多练习纯CSS。您也可以使用Bootstrap 或者是 SASS。一些别的技术(例如JQurey、React、Angular 或者是 VUE)在当前的项目是不推荐的,因为可能会有无法预知的错误,但在别的项目中我们仍有机会去使用不同的技术栈比如React,我们会接受并尽力去处理在使用建议的技术栈出现的问题,祝您编码愉快!", |
There was a problem hiding this comment.
您 => 你。下同
,因为这是目前这节课所涉及的内容,我们推荐使用纯CSS代码, 建议 =>
。由于目前我们只学到了 CSS,因此建议你只使用 CSS 完成这个项目,顺便还可以巩固一下之前学到的内容。
纯CSS代码、纯CSS、使用Bootstrap 请添加空格
JQurey、VUE 这样的拼写是错误的。请参考原文,或官网。
一些别的技术(……)在当前的项目是不推荐的 建议 =>
在当前的项目中,不推荐使用其他技术,如 ……。
因为可能会有无法预知的错误 =>
因为一旦出现问题,你可能要花很多时间去修复。
注意词组 at your own risk 的意思,不是表示 “会有问题”,而是强调 “一旦出现问题,由本人承担” 这种意思。我提供的翻译也不够好,你再考虑下吧
我们会接受并尽力去处理在使用建议的技术栈出现的问题 =>
我们会接受并尽力处理你在使用建议的技术栈过程中遇到的问题
There was a problem hiding this comment.
at your own risk => 在你自己的风险(有道翻译)
at your own risk => 一旦出现问题,由本人承担。(整体意思对了,但不够简洁)
at your own risk => 风险自担(用户熟悉、一看就懂)
翻译追求的是整体意思的把控,而不是字面意思。
中文有很多大家熟悉的成语、短语可以轻松表达这类意思。
| "<strong>目标:</strong> 使用 <a href='https://codepen.io' target='_blank'>CodePen.io</a> 搭建一个与这个功能上相似的 app: <a href='https://codepen.io/freeCodeCamp/full/zNqgVx' target='_blank'>https://codepen.io/freeCodeCamp/full/zNqgVx</a>.", | ||
| "满足以下 <a href='https://en.wikipedia.org/wiki/User_story' target='_blank'>用户故事</a> 并且通过所有的测试,你可以根据自己喜好装饰它", | ||
| "您可以使用 HTML、JavaScript 以及 CSS 来完成项目,因为这是目前这节课所涉及的内容,我们推荐使用纯CSS代码,建议当前应多练习纯CSS。您也可以使用Bootstrap 或者是 SASS。一些别的技术(例如JQurey、React、Angular 或者是 VUE)在当前的项目是不推荐的,因为可能会有无法预知的错误,但在别的项目中我们仍有机会去使用不同的技术栈比如React,我们会接受并尽力去处理在使用建议的技术栈出现的问题,祝您编码愉快!", | ||
| "<strong>用户故事 #1:</strong> 我的致敬页应有对应 <code>id=\"main\"</code> 的元素, 其中包含其他的所有元素", |
| "满足以下 <a href='https://en.wikipedia.org/wiki/User_story' target='_blank'>用户故事</a> 并且通过所有的测试,你可以根据自己喜好装饰它", | ||
| "您可以使用 HTML、JavaScript 以及 CSS 来完成项目,因为这是目前这节课所涉及的内容,我们推荐使用纯CSS代码,建议当前应多练习纯CSS。您也可以使用Bootstrap 或者是 SASS。一些别的技术(例如JQurey、React、Angular 或者是 VUE)在当前的项目是不推荐的,因为可能会有无法预知的错误,但在别的项目中我们仍有机会去使用不同的技术栈比如React,我们会接受并尽力去处理在使用建议的技术栈出现的问题,祝您编码愉快!", | ||
| "<strong>用户故事 #1:</strong> 我的致敬页应有对应 <code>id=\"main\"</code> 的元素, 其中包含其他的所有元素", | ||
| "<strong>用户故事 #2:</strong> 我应该看到一个具有相应 <code>id=\"title\"</code> 的元素, 其中包含描述致敬页主题的字符串 (即文本) (如 \"Dr. Norman Borlaug\")。", |
There was a problem hiding this comment.
(如 \"Dr. Norman Borlaug\")。 建议 =>
,如 \"Dr. Norman Borlaug\"。
| "<strong>用户故事 #2:</strong> 我应该看到一个具有相应 <code>id=\"title\"</code> 的元素, 其中包含描述致敬页主题的字符串 (即文本) (如 \"Dr. Norman Borlaug\")。", | ||
| "<strong>用户故事 #3:</strong> 我应该看到一个带有对应 <code>id=\"img-div\"</code> 的 <code>div</code> 元素。", | ||
| "<strong>用户故事 #4:</strong> 在 <code>img-div</code> 元素内,我应该看见有对应 <code>id=\"image\"</code> 的 <code>img</code> 元素", | ||
| "<strong>用户故事 #5:</strong> 在 <code>img-div</code> 元素内,我应该看见一个具有相应 <code>id=\"img-caption\"</code> 的元素,其中包含描述 <code>img-div</code> 中显示的图像文本的文本。", |
There was a problem hiding this comment.
其中包含描述 <code>img-div</code> 中显示的图像文本的文本。 =>
其中包含对 <code>img-div</code> 中图像的描述。
| "<strong>用户故事 #4:</strong> 在 <code>img-div</code> 元素内,我应该看见有对应 <code>id=\"image\"</code> 的 <code>img</code> 元素", | ||
| "<strong>用户故事 #5:</strong> 在 <code>img-div</code> 元素内,我应该看见一个具有相应 <code>id=\"img-caption\"</code> 的元素,其中包含描述 <code>img-div</code> 中显示的图像文本的文本。", | ||
| "<strong>用户故事 #6:</strong> 我应该看见具有对应 <code>id=\"tribute-info\"</code> 的元素,其中包含描述致敬页主题的文本内容", | ||
| "<strong>用户故事 #7:</strong> 我应该看见具有对应 <code>id=\"tribute-link\"</code> 的元素,它链接到一个包含有关致敬页主题的其他信息的外部网页,提示: 你必须为元素提供 <code>target</code> 属性,并设置为 <code>_blank</code> 以便在新选项卡中打开连接 (例 <code>target=\"_blank\"</code>).", |
There was a problem hiding this comment.
包含有关致敬页主题的其他信息的外部网页 =>
包含有关致敬页主题额外信息的外部网页
结尾应该使用全角句号
There was a problem hiding this comment.
user story 翻译成用户故事只是直译,也就是字面上的意思。
但在项目这个场景下,user story 应该是功能或需求的意思。
There was a problem hiding this comment.
@huluoyang 我其实一开始加了这个 comment,打开 Wikipedia 之后我就把 comment 删了 😂
我一开始想建议的是“用户需求”或“功能”
| "完成项目并通过所有测试后, 输入你的项目在 CodePen 上的链接", | ||
| "Once you're done, submit the URL to your working project with all its tests passing.", | ||
| "Remember to use the <a href='https://forum.freecodecamp.org/t/how-to-get-help-when-you-are-stuck/19514' target='_blank'>Read-Search-Ask</a> method if you get stuck." | ||
| "要是卡住的话,记得使用 <a href='https://forum.freecodecamp.org/t/how-to-get-help-when-you-are-stuck/19514' target='_blank'>Read-Search-Ask</a> 方法。" |
| "<strong>目标:</strong> 使用 <a href='https://codepen.io' target='_blank'>CodePen.io</a> 搭建一个与这个功能上相似的 app: <a href='https://codepen.io/freeCodeCamp/full/zNqgVx' target='_blank'>https://codepen.io/freeCodeCamp/full/zNqgVx</a>。", | ||
| "在满足以下 <a href='https://en.wikipedia.org/wiki/User_story' target='_blank'>用户故事</a> 并能通过所有测试的前提下,你可以根据自己的喜好来美化你的 app。", | ||
| "你可以使用 HTML、JavaScript 以及 CSS 来完成项目,由于目前我们只学到了 CSS,因此建议你只使用 CSS 完成这个项目,顺便还可以巩固一下之前学到的内容。你也可以使用 Bootstrap 或者是 SASS。在当前的项目中,不推荐使用其他技术如 jQurey、React、Angular 或者是 Vue,因为一旦出现问题,风险自担。但在别的项目中我们仍有机会去使用不同的技术栈比如 React,我们会接受并尽力处理你在使用建议的技术栈过程中遇到的问题,编码愉快!", | ||
| "<strong>用户故事^#1:</strong> 我的致敬页应有对应 <code>id=\"main\"</code> 的元素, 其中包含其他的所有元素", |
| "完成项目并通过所有测试后, 输入你的项目在 CodePen 上的链接", | ||
| "Once you're done, submit the URL to your working project with all its tests passing.", | ||
| "要是卡住的话,记得使用 <a href='https://forum.freecodecamp.org/t/how-to-get-help-when-you-are-stuck/19514' target='_blank'>Read-Search-Ask</a> 方法。" | ||
| "<strong>目标:</strong> 使用 <a href='https://codepen.io' target='_blank'>CodePen.io</a> 搭建一个与这个功能上相似的 app: <a href='https://codepen.io/freeCodeCamp/full/zNqgVx' target='_blank'>https://codepen.io/freeCodeCamp/full/zNqgVx</a>。", |
There was a problem hiding this comment.
参考群内的讨论。行内元素(比如 a)两边是否加空格取决于内容。这里,因为是在全角冒号之后,所以不需要加
<strong> 之后同理
| "Once you're done, submit the URL to your working project with all its tests passing.", | ||
| "要是卡住的话,记得使用 <a href='https://forum.freecodecamp.org/t/how-to-get-help-when-you-are-stuck/19514' target='_blank'>Read-Search-Ask</a> 方法。" | ||
| "<strong>目标:</strong> 使用 <a href='https://codepen.io' target='_blank'>CodePen.io</a> 搭建一个与这个功能上相似的 app: <a href='https://codepen.io/freeCodeCamp/full/zNqgVx' target='_blank'>https://codepen.io/freeCodeCamp/full/zNqgVx</a>。", | ||
| "在满足以下 <a href='https://en.wikipedia.org/wiki/User_story' target='_blank'>用户故事</a> 并能通过所有测试的前提下,你可以根据自己的喜好来美化你的 app。", |
| "在满足以下 <a href='https://en.wikipedia.org/wiki/User_story' target='_blank'>用户故事</a> 并能通过所有测试的前提下,你可以根据自己的喜好来美化你的 app。", | ||
| "你可以使用 HTML、JavaScript 以及 CSS 来完成项目,由于目前我们只学到了 CSS,因此建议你只使用 CSS 完成这个项目,顺便还可以巩固一下之前学到的内容。你也可以使用 Bootstrap 或者是 SASS。在当前的项目中,不推荐使用其他技术如 jQurey、React、Angular 或者是 Vue,因为一旦出现问题,风险自担。但在别的项目中我们仍有机会去使用不同的技术栈比如 React,我们会接受并尽力处理你在使用建议的技术栈过程中遇到的问题,编码愉快!", | ||
| "<strong>用户故事^#1:</strong> 我的致敬页应有对应 <code>id=\"main\"</code> 的元素, 其中包含其他的所有元素", | ||
| "<strong>用户故事^#2:</strong> 我应该看到一个具有相应 <code>id=\"title\"</code> 的元素, 其中包含描述致敬页主题的字符串 (即文本),如 \"Dr. Norman Borlaug\"。", |
| "你可以使用 HTML、JavaScript 以及 CSS 来完成项目,由于目前我们只学到了 CSS,因此建议你只使用 CSS 完成这个项目,顺便还可以巩固一下之前学到的内容。你也可以使用 Bootstrap 或者是 SASS。在当前的项目中,不推荐使用其他技术如 jQurey、React、Angular 或者是 Vue,因为一旦出现问题,风险自担。但在别的项目中我们仍有机会去使用不同的技术栈比如 React,我们会接受并尽力处理你在使用建议的技术栈过程中遇到的问题,编码愉快!", | ||
| "<strong>用户故事^#1:</strong> 我的致敬页应有对应 <code>id=\"main\"</code> 的元素, 其中包含其他的所有元素", | ||
| "<strong>用户故事^#2:</strong> 我应该看到一个具有相应 <code>id=\"title\"</code> 的元素, 其中包含描述致敬页主题的字符串 (即文本),如 \"Dr. Norman Borlaug\"。", | ||
| "<strong>用户故事^#3:</strong> 我应该看到一个带有对应 <code>id=\"img-div\"</code> 的 <code>div</code> 元素。", |
There was a problem hiding this comment.
这里的 code 加空格是对的。因为内容是半角,两边是全角
| "<strong>用户故事^#15:</strong> 在表单元素内,我能看见在最后有个<code>textarea</code>用于附加注释。", | ||
| "<strong>用户故事^#16:</strong> 在表单元素内,我能看见一个<code>id=\"submit\"</code>的按钮,用于提交我所有的输入。", | ||
| "你可以通过 fork 此 <a href='http://codepen.io/freeCodeCamp/pen/MJjpwO' target='_blank'>this CodePen pen</a> 来构建项目,或者你可以使用此 CDN 链接在你喜欢的任何环境中运行测试:<code>https://gitcdn.link/repo/freeCodeCamp/testable-projects-fcc/master/build/bundle.js</code>。", | ||
| "完成项目并通过所有测试后, 输入你的项目在 CodePen 上的链接。", |
| "<strong>用户故事^#1:</strong> 我能看见一个 H1 大小 <code>id=\"title\"</code> 的标题。", | ||
| "<strong>用户故事^#1:</strong> 我能看见一个 P 大小 <code>id=\"description\"</code> 的简述文字。", | ||
| "<strong>用户故事^#3:</strong> 我能看见一个 <code>id=\"survey-form\"</code> 的 <code>form</code>。", | ||
| "<strong>用户故事^#4:</strong> 在 form 元素内, 我需要在 <code>id=\"name\"</code> 的字段中输入我的名字。", |
|
🎉 恭喜良良的第一个PR成功进入仓库,Mission is impossible! |
* part1 * update previous & 2/5 finished * space fix * fix part1&part2 spacing
* part1 * update previous & 2/5 finished * space fix * fix part1&part2 spacing


翻译章节
《响应式网页设计——实战》
变更文件
responsive-web-design-projects.json
responsive-web-design-projects.md
翻译进度
40%
0%