HTML/CSS

This is a bootstrap contact form template with google maps so that visitors can track your store or shop detail and also all required feature on form fields. Hope you learn from this project.See Demo

I was using tablet yesterday & viewing website pages & came with this idea. I have used bootstrap and some css for making this form look attractive & its also responsive. Download it, learn from it & make your projects better than this, will be worth for this sourcecode .

This is a webpage Design Tutorial. This is for begineers in thml and css. In this tutorial you will know how to make fixed header and nice footer. This is simple and easy to do. Hope you learn from this.

This project will teach you how to create a simple dropdown menu using details and summary element. tag could have additional details that the user can view or hide on demand. The tag is a visible heading of tag. It can be placed either vertically or horizontally. Hope you learn from this.

This project will teach you how to use media rule in css. @media rule allows different style or layout for different media in the same style sheet. I have here in my example a box with a content. You can see the changes of the page content when the user resized the screen(box color and font-size change according to screen size). Hope you learn from this.

This project will teach you how to create a full background image in css. It will create a large photo that will cover the entire background of the webpage. This is simple and easy to understand. We have to set the following properties such as background image(the location of the image), background-position(which should be center center), background-repeat(it should not be tiled), background

This project will teach you how to vertically center your element using css. It has only 2 css properties to be set and that is top which is set to 50% and transform: translateY(-50%). Your element will be perfectly centered vertically. Hope you learn from this.

This project will teach you one example of typography effect using css. There are no images included in this example. What we have to do is skew each letter. The odd letter will set the transform property into 10deg skewY and the even is negative 10deg skewY. This will look like each letter is folding. Hope you learn from this simple project.

This project will teach you how to use a background-blend-mode in css. Background-blend-mode allows you to blend images and background color. We have different kinds of blend modes(multiply, screen, overlay, burn, color, darken...). Each blend modes applied will produce a stunning effect to an image. I have here an examples of all blend modes that you can use. Hope you learn from this.

This project will teach you how to clip text using background-clip in css. First we have to set background-clip into text, set the text-fill-color into transparent so the background image will display. Put a background image and animate. In my example, I have a text LIFELINE which has a background image of a lifeline and slide the image from left to right. Hope you learn from this.