Download to read offline
More Related Content
![#3 HTML & CSS [know-how]](https://cdn.slidesharecdn.com/ss_thumbnails/html-know-how3-180511205559-thumbnail.jpg?width=640&height=640&fit=bounds)
Similar to Frontend bootcamp
Frontend bootcamp
- 1. FRONT-END BOOTCAMP Introduction toWeb Development
- 2. Chaliye shuru kartehain!
- 3. Speakers of theevent : Bhushan Kale Mrunmayi Shirke Om Gawande
- 5. Bhushan Kale Let’s connecton Linkedin!! https://www.linkedin.com/in/bhushan-kal e-53493b203/ Intro to HTML!
- 7. Types of HTMLTags Container tags Empty tags <h1>This is heading</h1> <br>, <hr>etc.
- 8.
- 9. Text formatting tags: HeadingElement:- There are six heading elements ex: <h1>,<h2>,<h3>,<h4>, <h5>,<h6> Paragraph Element:- <p>This is a paragraph</p>
- 10. HTML <div> tagand <span> tag: The <div> tag defines a division or a section in an HTML document. The <span> tag is used to mark up a part of a text, or a part of a document.
- 11. HTML <img> tag Thistag is used to embed an image in an HTML page.
- 12. <img src="./images/Doraemon.png" alt="Doraemon"> Whatare Attributes? <img src=" " alt="doraemon">
- 13. HTML Lists: Unordered Lists:Ordered Lists:
- 15.
- 16. What is CSS? CascadingStyle Sheet It allows you to add “style” to an HTML (web page) element ex: color, size, or positioning information
- 17. <body> <h1 style="align:center;">This is aheading</h1> <p style="color:red;">This is a paragraph.</p> </body> <head> <style> h1{ margin-left: 40px; } </style> </head> <body> <h1>H1 heading</h1> </body> <head> <link rel="stylesheet" href="mystyle.css"> </head> <body> <h1>This is a heading</h1> <p>This is a paragraph.</p> </body> Inline Internal External 3 CSS definition locations
- 18. A question: how doesthe browser know which HTML element on the webpage this declaration applies to?
- 19. ● Selector - WhatHTML sections does it affect? ● Property - What attribute of that HTML section will be affected? ● Value - What change will be made to that attribute? SYNTAX 3 Elements to a CSS Statement
- 20. p { font-size: 10px; font-color:White; } <p>Content</p> .myclass { font-size: 10px; font-color: White; } <p class=“myclass”>Hey </p> #para1 { font-size: 10px; font-color: White; } <p id=“para1”>Hey</p> * { font-size: 10px; font-color: White; } <p>Every element will be selected</p> Types of Selectors HTML Tag Class Attribute Id Selector Universal Selector
- 22. Tomato Hex: #ff6347 Rgb: rgb(255,99,71) Hsl:hsl(9,100%,64%) Aqua Hex: #00ffff Rgb: rgb(0,255,255) Hsl: hsl(180%, 100%, 50%) Colors in CSS Colors are specified using predefined color names, or RGB, HEX, HSL, RGBA, HSLA values.
- 23. Flexbox Flexbox (Flexible Layout)is a more efficicent way to lay out and align items of your page. Wrap Direction
- 24.
- 25. Lets see moreproperties!
- 26. Om Gawande https://bit.ly/3rskNz2 Intro toJavaScript!
- 27. JavaScript ❏ Dynamic Websites ❏Web Servers ❏ Games ❏ Frameworks ❏ Npm Packages ❏ Anything in the world..!😱
- 28. Variables Const Let Var var x =10 let x = 10
- 29. Functions const sum =( ) => { return 2 + 3 } console.log(sum( ))
- 30.
- 31. ReactJs NextJs ExpressJs NodeJs MongoDb Tailwind CSS Full-stackDeveloper 🚀 What’s next .. ?🤔
- 32. Thank you..! Hope youfound this event interesting! If you have any doubts you can ask,now!