Getting to Know CSS Blend Modes

by Shwetank Dixit in Articles

CSS Blend Modes provide a way to specify how one layer will interact or “blend” with the one underneath. Until now, this was the domain of photo editing applications, but now they are available on the web using CSS itself!

Understanding 3D Transforms

by Tiffany Brown in Articles

In this article we’ll dig in to 3D transforms in detail, looking at the fundamental differences between 3D and 2D transforms, the 3D transforms available, and some demos that show how these work.

Opera’s WebKit Patches

by Bruce Lawson in Blog

About five weeks ago, we announced that Opera’s products would transition to using WebKit. We said “Opera will contribute to the WebKit and Chromium projects. Our work on web standards to advance the web continues.”

Understanding the CSS Transforms Matrix

by Tiffany Brown in Articles

In this article we explain how transform matrices work — these involve some rather complicated math, but they are not so hard to understand when you sit down and check out a few examples! Once you understand how to put together matrices, you can use them inside the CSS transform: matrix(); and transform: matrix3d(); functions to apply transform effects to your web pages.

Opera Mobile Emulator Build With Experimental WebKit Prefix Support

by Bruce Lawson in Articles

Through our site compatibility work, we have experienced that many site authors only use -webkit- prefixed CSS, thereby ignoring other vendor prefixes and not even including an unprefixed equivalent. This leads to a reduced user experience on non-WebKit browsers, as they don’t receive the same shiny effects, even although they support them. To tackle this problem, we are releasing an experimental Opera Mobile Emulator build with experimental support for selected -webkit- prefixes.

Tweaking Spatial Navigation for TV Browsing

by Daniel Davis in Tv

Opera’s spatial navigation is the most common navigation mechanism on web-enabled TVs and devices. It offers an intuitive way for users to navigate web pages. Using a sprinkling of CSS3, developers can take full control over the exact order in which elements receive focus, to further enhance the browsing experience.

CSS3 Multi-Column Layout

by Molly E. Holzschlag in Articles

Multiple column design that allows text to flow naturally from column to column depending on width and other parameters has proven invaluable in print design, crossing languages, cultures and a range of media. The good news is that now it is coming to web design, courtesy of the CSS3 Multi-column Layout Module. In this article we show you how to get to grips with it.

Creating Web Content for TV

by Patrick H. Lauke in Tv

This guide is aimed at web developers wishing to optimize their web sites and applications for better compatibility with web-enabled/connected televisions, with a particular emphasis on the Opera Device SDK and its functionality.

Cross-Browser CSS box-shadows

by Rustam Gaffanov in Articles

CSS3 box-shadow is a very useful property — creating drop shadows programmatically can save web designers a lot of time in image editing software. However we have a problem if we need to replicate those shadows in Internet Explorer, which does not support this property. In this article, we present a cross-browser solution that uses box-shadow in supporting browsers, and IE filters to fake the drop shadows in IE.

Introduction to HTML5 Video

by Patrick H. Lauke, Bruce Lawson in Articles

This article gives you an introduction to <video> and some of its associated APIs. We look at why native video support in browsers is important, give an overview of the element’s markup, and outline the most important ways in which video can be controlled via JavaScript.

CSS Text Shadows and Background Sizing

by Christopher Schmitt in Articles

In this article Christopher Schmitt explores a couple of great new CSS design properties available in CSS3 — text-shadow for creating drop shadows, and background-size for automatically resizing background images as the browser window changes size. Exciting stuff indeed!

Entries with “css” tag