overflow-x, overflow-y (CSS3 properties)
W3C CSS3 working draft: The 'overflow-x' and 'overflow-y' properties. Partially supported in Gecko 1.8, Safari 3, Opera 9.5, IE. In all the following test cases the green box has fixed dimensions (80px × 80px, with padding 9px, border 10px.) The blue bar (width 119px, border 1px) should overflow at the right, and the red one (height 119px, border 1px) at the bottom. According to the spec ... some combinations with ‘visible’ are not possible: if one is specified as ‘visible’ and the other is ‘scroll’ or ‘auto’, then ‘visible’ is set to ‘auto’ .... All browsers seem to further reduce the number of combinations giving different results: In Gecko, Safari, Opera, ‘visible’ becomes ‘auto’ also when combined with ‘hidden’ (in other words: ‘visible’ becomes ‘auto’ when combined with anything else different from ‘visible’). In IE7, IE8 there are also the same five distinct results, but they correspond to a different grouping of values: CSS tests home
CSS/(X)HTML Tutorial: Hovering Accessibility Jump Menu
Recently, a reader named Don asked about this theme’saccessibility(accesskey) jump menulocated at the top of each page. Several people have commented that they like the way the jump menu “lights up” upon gaining focus. Whenever a user hovers their cursor over the region at the top of the page, all links in the jump menu change to a more visible color. Then, as the cursor moves over the various menu items, each jump link is further highlighted with an even brighter color and an underline. This progressive focusing is best seen in browsers that support the CSS:hover pseudo-class (e.g., Firefox, Opera, etc.), however the menu remains useful even in CSS-challenged browsers (e.g., Internet Explorer). In this article, I explain how the Perishable Press jump menu is built using Web standards via CSS and (X)HTML, and then provide the specific code required to emulate the jump menu as it appears here at Perishable Press. Step 1: The Markup Okay, looking good. Very nice. Step 2: The Presentation
Le guide ultime des microformats : références et exemples
Bien qu'ils ne fassent pas partie des spécifications HTML du W3C, ils offrent un assortiment utile de conventions de nommage (en utilisant les attributs class, id, rel et rev) qui identifient les points d'intérêt sur une page. Ils permettent de mettre en avant du contenu, tel que les évènements de calendrier, un lien vers l'acceptation de vos licences (dont la GPL) et même des choses plus légères telles que les recettes de cuisine. Si les microformats ne font pas encore partie du standard W3C, les navigateurs Web n'ont pas attendu pour en assurer le support. Les microformats valent vraiment la peine d'y porter un intérêt et de les implémenter dans les sites que vous réalisez. Vous utilisez peut-être déjà les microformats si vous utilisez un CMS tel que WordPress, car ce dernier supporte nativement des formats de données simples, comme l'attribut rel. Si vous êtes nouveau dans l'univers des microformats, vous vous demandez certainement pourquoi vous devriez vous embêter à les utiliser. I-A.
quackit.com
This is the print version of The HTML <aside> tag is used to represent content that is related to the surrounding content within an article or web page, but could still stand alone in its own right. This type of content is often represented in sidebars. An example is a "pull quote" from a longer article. A pull quote (also known as a lift-out quote or a call-out) is a quotation or edited excerpt from an article that is placed in a larger typeface on the same page, serving to lead readers into an article and to highlight a key topic. The <aside> tag was introduced in HTML 5. Example Modify the code below, then click "Update". Attributes HTML tags can contain one or more attributes. There are 3 kinds of attributes that you can add to your HTML tags: Element-specific, global, and event handler content attributes. The attributes that you can add to this tag are listed below. Element-Specific Attributes Global Attributes
60 ressources CSS pour vos prochains Webdesign - ressources
Nous avons regroupé des ressources utiles et tendances pour compléter le CSS de vos réalisations et vous rapprocher encore un peu plus des tendances dans le webdesign ! Bonne lecture. Un peu nouveau comme type d'article, je ne pouvais plus laisser passer des ressources de si bonnes qualités dans ma veille quotidienne sans en parler sur le blog ! Dans le même esprit que les billets sur les icônes, je vous regrouperai les meilleures ressources CSS et XHTML disponibles gratuitement sur la toile pour vous aider. Gradient Editor Border Radius Button Maker Text Shadow Css Web Forms Top 10 Css table designs Pimp your tables with Css3 Some styles for your pagination One page portfolio with html5 and css3 13 css3 buttons Easyframework L'iphone 4 en 3D et sur 360 ° sur illustrator Cs5 incroyable ! Addsoul.com
4.4 Sections — HTML5
4.3 Sections 4.3.1 The body element Categories: Sectioning root. Contexts in which this element can be used: As the second element in an html element. Content model: Flow content. Content attributes: Global attributes onafterprint onbeforeprint onbeforeunload onhashchange onmessage onoffline ononline onpagehide onpageshow onpopstate onstorage onunload Tag omission in text/html: A body element's start tag may be omitted if the element is empty, or if the first thing inside the body element is not a space character or a comment, except if the first thing inside the body element is a meta, link, script, style, or template element. A body element's end tag may be omitted if the body element is not immediately followed by a comment. Allowed ARIA role attribute values: document role (default - do not set), application. Allowed ARIA State and Property Attributes: Global aria-* attributes Any aria-* attributes applicable to the allowed roles. DOM interface: interface HTMLBodyElement 4.3.2 The article Sectioning content. 4.3.3 The
Canvas Tutorial - Introduction
Welcome! In this tutorial, we're going to create a breakout clone that you can play in your browser, using javascript and the In order to use this tutorial, you'll need a browser that supports the <canvas> element. Before you read any further, click on the "run code" button on the left to play the game that we'll end up creating. On every page, you'll be able to click the "run code" button to run the code we've developed so far. In order to make our lives easier, I've included the jQuery framework in every page, which extends javascript in your browser with some useful methods. If you have any comments or questions, feel free to leave a comment on the "comments" tab. next
HTML5 Please - Use the new and shiny responsibly
