Keywords / Programming languages, Image

Tags: Programming languages, Image

Expanding effect for appearing text placed over an image using keyframe animation in CSS3

Expanding effect for appearing text placed over an image using keyframe animation in CSS3
Expanding effect for appearing text that is used in this article consists of two parts where each part performs after another is finished. This effect is only made possible by using @keyframes rule in CSS3.

Horizontal and vertical animated stretching effect for appearing text placed over an image using only CSS3

Horizontal and vertical animated stretching effect for appearing text placed over an image using only CSS3
This article demonstrates how to simply animate an appearing text with horizontal and vertical stretching effect that is placed over an image using only CSS3 without JavaScript.

Zoom and rotate effects for appearing text placed over an image using only CSS3

Zoom and rotate effects for appearing text placed over an image using only CSS3
Animation demonstrated in this article uses only CSS3. It consists of one simple semi-transparent layer placed over the image and appearing text with zoom and rotate effects.

HTML for beginners: working with text and images

HTML for beginners: working with text and images
The current article contains a list of old and well-forgotten articles on how to work with text and images in HTML 4.01. These articles will be useful for beginners who just started learning HTML and have no clue how it works.

Animated image with spreading curtain effect and appearing title using only CSS3

Animated image with spreading curtain effect and appearing title using only CSS3
Animation used in the following article can be applied to images in blocks where blocks are presented as a list of articles/posts/news on websites with this specific design.

Animated image with zoom effect and appearing title using only CSS3

Animated image with zoom effect and appearing title using only CSS3
Nowadays, there are more and more websites which display articles/posts/news as square boxes in several columns where each square has a main image and the title of the article/post/news. The following article contains an example of a simple animation for the main image which can make such squares look more attractive.

How to resize images proportionally using CSS for responsive web design

How to resize images proportionally using CSS for responsive web design
One of the important parts of a responsive web design is resizing the image automatically to fit the width of its container. Actually it's very easy, all you need to do is to set the appropriate value for max-width CSS property.

Image button in HTML

Image button in HTML
Image button is similar in action to that of submit button, but it looks like an image. This expands designer's abilities to improve the form.

Image as a link in HTML

Image as a link in HTML
In addition to hypertext, you can use images as links. The image in this case must be place between the tags <a href=...> and </a>.

Image map in HTML

Image map in HTML
Image map allows you to assign links to different areas of the image. Used in two different versions - server and client.