初始点

要开始评估，您应该:

• Make local copies of the HTML and CSS — save them as index.html and style.css in a new directory.
• Save local copies of the top, bottom and logo images in the same directory as your code files.

工程概要

您已经获得了创建信件朝向的纸模板所需的文件。 你只需要把文件放在一起。 要到达那里，您需要:

主信

• Apply the CSS to the HTML.
• Add a background declaration to the letter that:
  • Fixes the top image to the top of the letter
  • Fixes the the bottom image to the bottom of the letter
  • Adds a semi-transparent gradient over the top of both of the previous backgrounds that gives the letter a bit of texture. Make it slightly dark right near the top and bottom, but completely transparent for a large part of the center.
• Add another background declaration that just adds the top image to the top of the letter, as a fallback for browsers that don't support the previous declaration.
• Add a white background color to the letter.
• Add a 1mm top and bottom solid border to the letter, in a color that is inkeeping with the rest of the color scheme.

标志

• To the <h1>, add the logo as a background image.
• Add a filter to the logo to give it a subtle drop shadow.
• Now comment out the filter and implement the drop shadow in a different (slightly more cross-browser compatible) way, which still follows the shape of the round image.

提示和提示

• Remember that you can create a fallback for older browsers by putting the fallback version of a declaration first, followed by the version that works across newer browsers only. Older browsers will apply the first declaration and ignore the second one, whereas newer browsers will apply the first one, then override it with the second one.
• Feel free to create your own graphics for the assessment if you wish.

例子

以下屏幕截图显示了完成的设计可以是什么样子的示例:

;">

评定

如果您作为有组织课程的一部分参加此评估，您应该能够将您的工作交给您的老师/导师进行标记。 如果您是自学习的，那么您可以轻松地通过 dev-mdc 邮件列表，或者在 #mdn IRC频道中。 org / IRC"class ="external"> Mozilla IRC 。 尝试练习第一 - 没有什么可以通过作弊获得！