├── .vscode └── settings.json ├── Project 1 ├── images │ └── apj.jpg ├── index.html └── style.css └── README.md /.vscode/settings.json: -------------------------------------------------------------------------------- 1 | { 2 | "liveServer.settings.port": 5501 3 | } -------------------------------------------------------------------------------- /Project 1/images/apj.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/AyushSoni86/HTML-and-CSS/3ded67c20026cf29cf158d5a42affadb0f1ba837/Project 1/images/apj.jpg -------------------------------------------------------------------------------- /Project 1/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | First Project 8 | 9 | 10 | 11 | 12 |
13 | 14 |
15 |

Tribute page

16 |
17 |
18 |
19 | apj abdul kalam image 26 |
27 |
28 |

Dr A.P.J Abdul Kalam

29 |

1931-2015

30 |
31 |
32 |
33 |

MISSILE MAN OF INDIA

34 |
35 |
36 |

37 | Avul Pakir Jainulabdeen Abdul Kalam 15 October 1931 – 27 July 2015) 38 | was an Indian aerospace scientist who served as the 11th president of 39 | India from 2002 to 2007. He was born and raised in Rameswaram, Tamil 40 | Nadu and studied physics and aerospace engineering. He spent the next 41 | four decades as a scientist and science administrator, mainly at the 42 | Defence Research and Development Organisation (DRDO) and Indian Space 43 | Research Organisation (ISRO) and was intimately involved in India's 44 | civilian space programme and military missile development efforts. He 45 | thus came to be known as the Missile Man of India for his work on the 46 | development of ballistic missile and launch vehicle technology. He 47 | also played a pivotal organisational, technical, and political role in 48 | India's Pokhran-II nuclear tests in 1998, the first since the original 49 | nuclear test by India in 1974. 50 |

51 |
52 |
53 | 54 |

Biographies

55 | 56 | 95 |
96 | 97 | 98 | -------------------------------------------------------------------------------- /Project 1/style.css: -------------------------------------------------------------------------------- 1 | body { 2 | background-color: rgba(167, 194, 105, 0.897); 3 | margin: 20px; 4 | padding: 20px; 5 | } 6 | 7 | .image { 8 | display: flex; 9 | border-radius: 20px; 10 | padding: 10px; 11 | margin: 10px; 12 | } 13 | 14 | .title { 15 | padding: 0px 10px; 16 | margin: 10px; 17 | display: flex; 18 | flex-direction: column; 19 | justify-content: center; 20 | align-items: center; 21 | gap: 10px; 22 | } 23 | 24 | .title-1 { 25 | margin: 10px; 26 | font-size: 64px; 27 | font-weight: 700; 28 | color: rgba(0, 0, 255, 0.591); 29 | } 30 | 31 | .title-2 { 32 | margin-left: -50px; 33 | font-size: 44px; 34 | font-weight: 400; 35 | color: rgba(24, 23, 23, 0.774); 36 | } 37 | 38 | .wrapper { 39 | border-radius: 20px; 40 | background-color: rgba(127, 255, 212, 0.733); 41 | padding: 10px; 42 | } 43 | 44 | .container { 45 | display: flex; 46 | align-items: center; 47 | justify-content: center; 48 | gap: 20px; 49 | } 50 | 51 | .section1 { 52 | font-size: 50px; 53 | font-weight: 700; 54 | color: rgba(0, 0, 255, 0.596); 55 | padding: 10px; 56 | margin: 20px; 57 | } 58 | 59 | .content { 60 | font-size: 20px; 61 | display: flex; 62 | margin: 10px; 63 | padding: 0px 20px; 64 | align-items: center; 65 | justify-content: center; 66 | } 67 | 68 | p { 69 | padding: 10px; 70 | margin: 20px; 71 | } 72 | 73 | .bio { 74 | margin-left: 45px; 75 | font-size: 32px; 76 | } 77 | 78 | .bullets { 79 | margin: 10px; 80 | display: flex; 81 | flex-direction: column; 82 | gap: 10px; 83 | font-size: 20px; 84 | } 85 | 86 | .creator { 87 | display: flex; 88 | align-items: center; 89 | justify-content: center; 90 | } 91 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # HTML-and-CSS 2 | Contains Sample Projects using HTML and CSS 3 | --------------------------------------------------------------------------------