• 设为首页
  • 点击收藏
  • 手机版
    手机扫一扫访问
    迪恩网络手机版
  • 关注官方公众号
    微信扫一扫关注
    迪恩网络公众号

ironhack-labs/lab-html-exercise

原作者: [db:作者] 来自: 网络 收藏 邀请

开源软件名称:

ironhack-labs/lab-html-exercise

开源软件地址:

https://github.com/ironhack-labs/lab-html-exercise

开源编程语言:

HTML 100.0%

开源软件介绍:

logo_ironhack_blue 7

Module Exercise: HTML & CSS

Learning Goals

In this exercise, the goal is to apply as many as possible of the concepts you've just learned:

  • when and how to use different HTML tags,
  • how to structure HTML page and add the content to it using block and inline elements,
  • how to use flexbox to position elements on the page and
  • how to style the page.

Getting started

  1. Fork this repo
  2. Clone this repo

Whenever you create a first significant change, you should make your first commit.

  1. Follow these guidelines to add, commit and push changes.

In the end of this document, you will find guidelines on how to submit the exercise.

Keep in mind that you don't have to wait to fully finish the exercise to make a pull request. You only have to make a pull request once. After that, every time when you make a commit, it will be automatically added and shown in the pull request.

Instructions

Introduction

In this exercise, you will clone the landing page of the NPM website. NPM stands for a Node Package Manager, and you will be using it heavily throughout this course. The version you will be cloning is the one in that you see in the following image. If you want, you can visit the official page to pick up some of their styles, but this is not necessary; you’ll see that the NPM page has been updated, but that’s okay. You already have all the assets for this version in the images folder as well as the necessary text in the index.html.

Our goal is to get as close as possible to this:

You can see the larger version of this picture here. If you're struggling to see the details, feel free to zoom in to 200%. Although it doesn't look too complicated, we will have to apply quite a few styles on our web page: set a background color on different elements, set a font weight (bold, normal), and position elements using our newly acquired skills in flexbox.

We will divide our work into two parts:

  • part I - create a webpage with no styles, just add HTML and
  • part II - add styles and make it perfect.

鲜花

握手

雷人

路过

鸡蛋
该文章已有0人参与评论

请发表评论

全部评论

专题导读
热门推荐
阅读排行榜

扫描微信二维码

查看手机版网站

随时了解更新最新资讯

139-2527-9053

在线客服(服务时间 9:00~18:00)

在线QQ客服
地址:深圳市南山区西丽大学城创智工业园
电邮:jeky_zhao#qq.com
移动电话:139-2527-9053

Powered by 互联科技 X3.4© 2001-2213 极客世界.|Sitemap