├── README.md ├── image ├── 1.png ├── 2.png └── 3.png ├── index.html └── style.css /README.md: -------------------------------------------------------------------------------- 1 | # WEB-Lab Task 5 2 | 3 | Hi I am MD. RABIUL AWAL SHUVO 4 | I am a student department of software engineering of daffodil internation university. 5 | Now i am a student spring-2022 session 8th semester. Now i have a course Software Engineering WEB Application Lab. So I got a task from Our course teacher. My task number 5 6 | 7 | So i have created this web page. as similar as my task image. 8 | -------------------------------------------------------------------------------- /image/1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DS-Popeye/WEB-Lab/a3a2fd6383e5f61e912bbbb7a05613c72538436d/image/1.png -------------------------------------------------------------------------------- /image/2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DS-Popeye/WEB-Lab/a3a2fd6383e5f61e912bbbb7a05613c72538436d/image/2.png -------------------------------------------------------------------------------- /image/3.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/DS-Popeye/WEB-Lab/a3a2fd6383e5f61e912bbbb7a05613c72538436d/image/3.png -------------------------------------------------------------------------------- /index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | (ID: 193-35-487)Lab Task 5 11 | 12 | 13 | 14 |
15 |
16 |
17 | 18 |
19 |

Prograssion

20 |

Lorem ipsum dolor sit amet consectetur adipisicing elit. Asperiores, ullam fuga. Officiis, iure 21 | natus 22 | et excepturi exercitationem tenetur laudantium aspernatur quia rerum vitae delectus at 23 | reprehenderit 24 | ducimus aut, unde repellendus.

25 |
26 |
27 |
28 | 29 |
30 |

Prograssion

31 |

Lorem ipsum dolor sit amet consectetur adipisicing elit. Asperiores, ullam fuga. Officiis, iure 32 | natus 33 | et excepturi exercitationem tenetur laudantium aspernatur quia rerum vitae delectus at 34 | reprehenderit 35 | ducimus aut, unde repellendus.

36 |
37 |
38 |
39 | 40 |
41 |

Prograssion

42 |

Lorem ipsum dolor sit amet consectetur adipisicing elit. Asperiores, ullam fuga. Officiis, iure 43 | natus 44 | et excepturi exercitationem tenetur laudantium aspernatur quia rerum vitae delectus at 45 | reprehenderit 46 | ducimus aut, unde repellendus.

47 |
48 |
49 |
50 |
51 | 52 | 53 | 54 | -------------------------------------------------------------------------------- /style.css: -------------------------------------------------------------------------------- 1 | @import url('https://fonts.googleapis.com/css2?family=Barlow&display=swap'); 2 | 3 | * { 4 | margin: 0; 5 | padding: 0; 6 | box-sizing: border-box; 7 | font-family: 'Barlow', sans-serif; 8 | } 9 | 10 | section { 11 | height: 100vh; 12 | display: flex; 13 | justify-content: center; 14 | align-items: center; 15 | } 16 | 17 | .conteinar { 18 | display: flex; 19 | margin: 0 15px; 20 | } 21 | 22 | .column { 23 | display: flex; 24 | align-items: center; 25 | background-color: #111111; 26 | color: whitesmoke; 27 | padding: 50px 25px; 28 | } 29 | 30 | .red { 31 | background-color: red; 32 | } 33 | 34 | .column h1 { 35 | margin-bottom: 7px; 36 | } 37 | 38 | .column img { 39 | width: 65px; 40 | height: 65px; 41 | } 42 | 43 | .details { 44 | margin-left: 15px; 45 | } 46 | --------------------------------------------------------------------------------