iPhoneButtons.css
/* |
File:iPhoneButtons.css |
Abstract: CSS properties for the iPhoneButtons sample. |
Defines and styles all buttons on "iPhone Buttons" page. |
Version: <1.0> |
Disclaimer: IMPORTANT: This Apple software is supplied to you by |
Apple Inc. ("Apple") in consideration of your agreement to the |
following terms, and your use, installation, modification or |
redistribution of this Apple software constitutes acceptance of these |
terms. If you do not agree with these terms, please do not use, |
install, modify or redistribute this Apple software. |
In consideration of your agreement to abide by the following terms, and |
subject to these terms, Apple grants you a personal, non-exclusive |
license, under Apple's copyrights in this original Apple software (the |
"Apple Software"), to use, reproduce, modify and redistribute the Apple |
Software, with or without modifications, in source and/or binary forms; |
provided that if you redistribute the Apple Software in its entirety and |
without modifications, you must retain this notice and the following |
text and disclaimers in all such redistributions of the Apple Software. |
Neither the name, trademarks, service marks or logos of Apple Inc. |
may be used to endorse or promote products derived from the Apple |
Software without specific prior written permission from Apple. Except |
as expressly stated in this notice, no other rights or licenses, express |
or implied, are granted by Apple herein, including but not limited to |
any patent rights that may be infringed by your derivative works or by |
other works in which the Apple Software may be incorporated. |
The Apple Software is provided by Apple on an "AS IS" basis. APPLE |
MAKES NO WARRANTIES, EXPRESS OR IMPLIED, INCLUDING WITHOUT LIMITATION |
THE IMPLIED WARRANTIES OF NON-INFRINGEMENT, MERCHANTABILITY AND FITNESS |
FOR A PARTICULAR PURPOSE, REGARDING THE APPLE SOFTWARE OR ITS USE AND |
OPERATION ALONE OR IN COMBINATION WITH YOUR PRODUCTS. |
IN NO EVENT SHALL APPLE BE LIABLE FOR ANY SPECIAL, INDIRECT, INCIDENTAL |
OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF |
SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS |
INTERRUPTION) ARISING IN ANY WAY OUT OF THE USE, REPRODUCTION, |
MODIFICATION AND/OR DISTRIBUTION OF THE APPLE SOFTWARE, HOWEVER CAUSED |
AND WHETHER UNDER THEORY OF CONTRACT, TORT (INCLUDING NEGLIGENCE), |
STRICT LIABILITY OR OTHERWISE, EVEN IF APPLE HAS BEEN ADVISED OF THE |
POSSIBILITY OF SUCH DAMAGE. |
Copyright (C) 2007 Apple Inc. All Rights Reserved. |
*/ |
body |
{ |
margin: 0px; |
padding: 0px; |
background-color: #fff; |
/* Turn off font resizing */ |
-webkit-text-size-adjust: none; |
} |
/* The button class defines properties for buttons that are either 30px or 46px high */ |
.button |
{ |
/* Set a button to be a block so its height and width can be adjusted */ |
display: block; |
/* Use the highest button height to ensure that text will vertically align on all buttons */ |
line-height: 46px; |
/* A button will expand to the width of its parent cell if no width is specified */ |
width: 150px; |
font-size: 20px; |
font-weight: bold; |
font-family: Helvetica, sans-serif; |
color: #fff; |
text-decoration: none; |
text-align: center; |
} |
/* Builds a button using a 29x46 image */ |
.blue |
{ |
margin: 3px auto; |
color: #fff; |
/* Put a 1 pixel blur black shadow below the button's text */ |
text-shadow: #000 0px 1px 1px; |
/* The right and left borders are 14 pixels wide */ |
border-width: 0px 14px 0px 14px; |
/* The leftButton image is split into three. Both left and right sides are 14 pixels wide. */ |
/* The remaining 1 pixel is used for the middle part of the image. */ |
/* The left and right sides will remain fixed while the middle part is scaling horizontally. */ |
-webkit-border-image: url(images/blueButton.png) 0 14 0 14; |
} |
/* Builds a button using a 29x46 image */ |
.white |
{ |
margin: 3px auto; |
border-width: 0px 14px 0px 14px; |
color: #000; |
/* Put a 1 pixel blur white shadow below the button's text */ |
text-shadow: #fff 0px 1px 1px; |
/* Note that the -webkit-border-image values are given as 0 14 0 14 and not 0px 14px 0px 14px */ |
-webkit-border-image: url(images/whiteButton.png) 0 14 0 14; |
} |
/* Builds a button using a 29x46 image */ |
.black |
{ |
border-width: 0px 14px 0px 14px; |
color: #fff; |
/* Put a 1 pixel blur black shadow below the button's text */ |
text-shadow: #000 0px 1px 1px; |
-webkit-border-image: url(images/grayButton.png) 0 14 0 14; |
margin: 3px auto; |
} |
/* Creates a button using a 18x30 image */ |
.blackLeft |
{ |
margin: 3px auto; |
color: #fff; |
/* Put a 1 pixel blur black shadow below the button's text */ |
text-shadow: #000 0px 1px 1px; |
border-width: 0px 5px 0px 12px; |
/* -webkit-border-image divides the leftButton image into 2 corners and middle part. */ |
/* The left corner is 12 pixels wide. The right corner is 5 pixels wide and the middle part is 1 pixel. */ |
-webkit-border-image: url(images/leftButton.png) 0 5 0 12; |
} |
/* Creates a button using a 18x30 image */ |
.blackRight |
{ |
margin: 3px auto; |
border-width: 0px 12px 0px 5px; |
color: #fff; |
text-shadow: #000 0px 1px 1px; |
/* -webkit-border-image divides the rightButton image into three parts. */ |
/* The right and left corners of the image are respectively 12 pixels and 5 pixels wide. */ |
/* This leaves 1 pixel for the midlle part of the image. */ |
-webkit-border-image: url(images/rightButton.png) 0 12 0 5; |
} |
Copyright © 2007 Apple Inc. All Rights Reserved. Terms of Use | Privacy Policy | Updated: 2007-12-03