2.4 动手 - 修改更多HTML

  1. 把导航栏的英文换成中文,并添加一列「报名 Girls Coding Day」,链接到 https://girlscodingday.org/考察知识点:考察学员 Lists,参考 HTML 列表

  2. 修改<header>元素中的内容 ( 考察知识点: Text-Based Element , 参考 HTML 文本格式化

    • 修改<h1>元素中内容为「Girls Coding Day」

    • 增加<h3>标签,其内容为「我也愿意贡献力量帮助更多的女性学习编程」 (考察知识点: Headings系列)

    • <span>标签嵌套一个<a>标签(链接为 Bootstrap模板下载地址 https://startbootstrap.com/template-overviews/clean-blog/)考察知识点: Paragraphs,Opening Links in a New Window, 参考资料 HTML 链接

    • 将「博客」二字加粗(考察知识点:Bold Text with Strong, 参考资料 HTML 文本格式化

    • 将「制作」二字变成斜体(考察知识点:Italicize Text with Emphasis, 参考资料 HTML 文本格式化

      Inquiry Learning

      1. 什么是块元素?

      2. 什么是内联元素?

      3. Div元素和span元素哪个是块元素?哪个是内联元素?

      Learning by Reading : 阅读 HTML <div><span> , 理解块元素和内联元素

    • https://unsplash.com/ 下载图片到img文件夹,修改图片名字,替换掉背景图 (考察知识点:Image, 参考资料 HTML 图像

  3. 修改页面最下端<footer>元素中的内容如下图所示

    • 修改twitter图标为微信图标

    • facebook图标为微博图标, 如果有微博请链接到自己的微博

      Advice for tutor

    • 添加邮箱图标,点击图标可以发送邮件。邮件需要包含主题(subject)和正文(body) (参考: Mailto Links | CSS-Tricks) (备注:Linking to an Email Address)

    • 修改copyright段落内容

Last updated