Scribd Logo
Upload

Welcome to Scribd!

  • 19 views

    Main

    Uploaded by

    Fatima Shah
    The document outlines an internship task to create a blog page with HTML, CSS, Bootstrap. It provides requirements for the header, banner, blog posts, sidebar and footer sections. It also mentions using responsive design, CSS styling and Bootstrap components.

    Copyright:

    © All Rights Reserved
    Download as PPTX, PDF, TXT or read online from Scribd

    Main

    Uploaded by

    Fatima Shah
    19 views16 pages
    The document outlines an internship task to create a blog page with HTML, CSS, Bootstrap. It provides requirements for the header, banner, blog posts, sidebar and footer sections. It also mentions using responsive design, CSS styling and Bootstrap components.

    Original Description:

    ppt

    Original Title

    main ppt

    Copyright

    © © All Rights Reserved

    Available Formats

    PPTX, PDF, TXT or read online from Scribd

    Did you find this document useful?

    Is this content inappropriate?

    The document outlines an internship task to create a blog page with HTML, CSS, Bootstrap. It provides requirements for the header, banner, blog posts, sidebar and footer sections. It also mentions using responsive design, CSS styling and Bootstrap components.

    Copyright:

    © All Rights Reserved
    Download as PPTX, PDF, TXT or read online from Scribd
    Download as pptx, pdf, or txt
    19 views16 pages

    Main

    Uploaded by

    Fatima Shah
    The document outlines an internship task to create a blog page with HTML, CSS, Bootstrap. It provides requirements for the header, banner, blog posts, sidebar and footer sections. It also mentions using responsive design, CSS styling and Bootstrap components.

    Copyright:

    © All Rights Reserved
    Download as PPTX, PDF, TXT or read online from Scribd
    Download as pptx, pdf, or txt
    of 16

    Internship

    Index:
    • Introduction of Company
    • Technology
    • Plan
    • Task
    About Company
    RealBotz
    • We at RealBotz provide a range of information technology services designed
    for business productivity.
    • We work in research & development of IT & Software products, for clients from
    different industries, to maximize their working standards by improving their
    production, quality, and thus the revenues by retaining their customer loyalty.​
    Technology
    i. HTML

    ii. CSS

    iii. BOOTSTRAP

    iv. JAVASCRIPT
    HTML
    • HTML stands for Hyper Text Markup Language.
    • HTML is a language for describing web pages.
    • HTML uses markup tags to describe web pages.
    • It is not a programming language it is a markup language.
    • HTML is used to create document on the World Wide Web. It is simply a collection of certain key
    words called ‘Tags’ that are helpful in writing the document to be displayed using a browser on Internet.
    • It is a platform independent language that can be used on any platform such as Windows, Linux and so on.
    • To display a document in web it is essential to mark-up the different elements
    (headings, paragraphs and tables and so on) of the document with the HTML tags.
    • To view a mark-up document user has to open the document in a browser.
    • A browser understands and interpret the HTML tags, identifies the structure of the document
    (which part are which) and makes decision about presentation (how the parts look) of the document.
    CSS
    • CSS stands for "Cascading Style Sheets"
    • Cascading: refers to the procedure that determines which style will apply to
    a certain section, if you have more than one style rule.
    • Style: how you want a certain part of your page to look. You can set things like
    color, margins, font, etc for things like tables, paragraphs, and headings.
    • Sheets: the "sheets" are like templates, or a set of rules, for determining how the webpage will look.
    • CSS is a stylesheet language used to describe the presentation of a document written in HTML or XML.

    CSS Advantages
    • A web application will contain hundreds of web pages, which are created using HTML.
    • Formatting these HTML pages will be a laborious process, as formatting elements need to be applied to
    each and every page.
    • CSS saves lots of work as we can change the appearance and layout of all the web pages by editing just one
    single CSS file.
    Bootstrap:
    Bootstrap is a free and open-source tool collection for creating responsive websites and
    web applications.
    It is the most popular HTML, CSS, and JavaScript framework for developing responsive, mobile-first websites.
    It solves many problems which we had once, one of which is the cross-browser compatibility issue.

    • Bootstrap is the most popular HTML, CSS and JavaScript framework for developing a responsive and mobile
    friendly website.
    • It is absolutely free to download and use.
    • It is a front-end framework used for easier and faster web development.
    • It includes HTML and CSS based design templates for typography, forms, buttons, tables, navigation,
    modals, image carousels and many others.
    • It can also use JavaScript plug-ins.
    • It facilitates you to create responsive designs.
    Javascript
    • JavaScript is a lightweight, cross-platform, single-threaded, and interpreted
    compiled programming language.
    • It is also known as the scripting language for webpages. It is well-known for the
    development of web pages, and many non-browser environments also use it.
    • JavaScript is a (dynamically typed). JavaScript can be used for Client-side developments
    as well as Server-side developments. JavaScript is both an imperative and declarative type of language.
    • JavaScript contains a standard library of objects, like Array, Date and Math and a core set of
    language elements like operators, control structures, and statements.
    • JavaScript is an object-oriented programming language that uses prototypes rather than using classes for
    inheritance.
    • It is a light-weighted and interpreted language. It is a case-sensitive language.
    • JavaScript is supportable in several operating systems including, Windows, macOS, etc.
    • It provides good control to the users over the web browsers.
    TASK
    Instructions:
    • Create a blog page with a responsive design using HTML, CSS, and Bootstrap.
    • Follow the given requirements and implement them in your code.
    • Make sure the page is visually appealing and user-friendly.
    Requirements:
    Header:
    • Include a navigation bar with links for Home, Blog, About, and Contact.
    • The navigation bar should be fixed at the top of the page.
    Banner:
    • Add a banner section with a background image and a heading that says"Welcome to Our
    Blog."
    Blog Posts:
    • Create at least three blog post sections.
    • Each post should have a title, a publication date, a brief excerpt, and a "Read More" link.
    • Use Bootstrap cards or similar elements to structure the blog posts.
    Plan.. Task Start date End Date Status

    Introduction to html 15/01/2024 19/01/2024 Completed

    Introduction to CSS 22/01/2024 23/01/2024 Completed

    Introduction to Bootstrap 24/01/2024 24/01/2024 Completed

    Implement a blog page 25/01/2024 25/01/2024 Completed


    using html, CSS,
    Bootstrap
    Requirement:
    Header, Banner, Blog
    Post, Sidebar, Footer

    Introduction to JavaScript 29/012024 2/2/2024 Pending..


    Sidebar:
    • Add a sidebar with links to recent posts, categories, and popular tags.
    • Include a search bar in the sidebar.
    Footer:
    • Include a footer at the bottom of the page with social media icons (e.g., Twitter, Facebook,
    and Instagram).
    • Add a copyright statement and a link to the privacy policy in the footer.
    Responsive Design:
    • Ensure that the page is responsive and looks good on various screen sizes.
    • Implement a mobile-first approach.
    CSS Styling:
    • Apply CSS styles to enhance the visual appeal of the page.
    • Use custom fonts and colors.
    Bootstrap Usage:
    • Utilize Bootstrap classes for grid layout, navigation bar, cards, and any other
    relevant components.
    Blog Page..
    Thank
    you!!

    You might also like