Skip to main content

Differences Between CSS & CSS3

The original Cascading Style Sheets specification, as well as its much more recent CSS3 revision, are technologies used to enhance and format HTML Web pages. CSS was initially designed to handle the presentation layer of a Web page in a more efficient manner than formatting with HTML, which was never intended to handle the complex construction of the contemporary Web. Because CSS2 is a a universally adopted extension of CSS1, the term CSS without a number implies the inclusion of CSS2. The CSS3 spec is still under development as of July 2014, so Web developers need to consider feature support varies between browsers.

CSS3 Is Backwards Compatible With CSS

CSS3 is an update to CSS2 that maintains compatibility with all of CSS's features -- CSS3 doesn't deprecate any of the CSS code. The CSS3 code is designed to make Web pages look better and load faster as well as reduce development time to build pages in a user's browser. CSS3 makes Web design less reliant on image files for page design elements and reduces file transfer requests and download time by using fewer images. CSS1 focused on appearance formatting, whereas CSS2 added positioning capabilities for text and objects. Older browser versions like IE 9 and prior do not widely support CSS3's added features, which can require extra development time to maintain CSS fall-back code.

CSS3 Adds Rounded Corners and Gradients

Prior to CSS3, Web developers needed to design image files to add things like rounded corners for structural borders and background image gradients; CSS3 includes comparable features that can be added with a few lines of code. In CSS, a Web developer has to design a border or gradient, upload it to the image server, place the image on the page and use CSS to correctly position the border. In CSS3, the Web developer can accomplish something similar with code like ".roundBorder{border-radius:10px;}". Background gradients are a bit more complicated and require different code for different browsers. For example, a white-to-black gradient for Chrome and IE uses code like ".gradBG{background: liner-gradient(white,black);}"

CSS3 Adds Animation Features and Text Effects

CSS3 has a handful of features not present in CSS to improve how your page elements look. With CSS3, Web developers can add a text-shadow to text to make it easier to read or add visual flair and can force line breaks within longer words to make them fit inside columns with word wrap. Before CSS3, Web developers needed to code animation in scripting languages like JavaScript and jQuery; CSS3 adds several animation features to the design layer. The W3C is still working on a Web animations standard to work out compatibility issues between the different animation techniques.

CSS3 Defines Text Columns

CSS3 adds the capability to split text sections into multiple columns to read like a newspaper. In the CSS2 spec, Web developers have a difficult time constructing multi-column text sections because the standard is not equipped to automatically split text. Particularly with sites that feature responsive design, a development technique that rearranges and resizes content based on the viewing device's screen resolution, people with larger monitors may have a difficult time reading text rows that sprawl across the scree







Comments

Post a Comment

Popular posts from this blog

Design Tools to Help You Create Your Next Project- Part 3

Coolors Coolors   is a super fast color scheme generator. You can explore thousands of pre-existing color schemes (each one features five colors). Or, you can generate your own in a matter of minutes. Once you go to the “generate” page, hit the space bar to start with a different color scheme, and then you can adjust each color’s hue, saturation, and brightness accordingly. Web Gradients Web Gradients   is a collection of almost 200 background gradients, created by the  itmeo  team. You can use each of these content backdrops for any part of your website. You’ll find a .PNG version of each gradient, as well as easy-to-copy CSS3 crossbrowser code. Bonus: there are even curated packs for  Sketch  &  Photoshop . Color Hunt On  Color Hunt , browse through countless palettes, comprised of four colors each. You can browse and sort through the list based on what’s hot and popular, or just pick “random” and see what comes u...
Post a Comment
Read more

WordPress 4.8 Release Candidate 2 on June 1, 2017

The second release candidate for WordPress 4.8 is now available. To test WordPress 4.8, you can use the  WordPress Beta Tester  plugin or you can  download the release candidate here  (zip). We’ve made  a handful of changes  since releasing RC 1 last week. For more details about what’s new in version 4.8, check out the  Beta 1 ,  Beta 2 , and  RC1  blog posts. Think you’ve found a bug?  Please post to the  Alpha/Beta support forum . If any known issues come up, you’ll be able to  find them here . Happy testing!                                                                                                                   ...
Post a Comment
Read more

#PHP 5.6 is now in security fix only mode, which runs until the end of 2018. Plan your upgrades to PHP 7!- The 5th Annual China PHP Conference

Supported Versions Each release branch of PHP is fully supported for two years from its initial stable release. During this period, bugs and security issues that have been reported are fixed and are released in regular point releases. After this two year period of active support, each branch is then supported for an additional year for critical security issues only. Releases during this period are made on an as-needed basis: there may be multiple point releases, or none, depending on the number of reports. Once the three years of support are completed, the branch reaches its end of life and is no longer supported. Currently Supported Versions Branch Initial Release Active Support Until Security Support Until 5.6   * 28 Aug 2014 2 years, 8 months ago 19 Jan 2017 4 months ago 31 Dec 2018 in 1 year, 7 months 7.0 3 Dec 2015 1 year, 5 months ago 3 Dec 2017 in 6 months 3 Dec 2018 in 1 year, 6 months 7.1 1 Dec 2016 5 months ago 1 Dec 2018 in 1 year, 6 months 1 Dec 2019 in ...
Post a Comment
Read more