http://bucarotechelp.com/design/csseasy This section contains Cascading Style Sheets code for features that you can add to your website. The code code is written simply and explained thoughly in the article so that someone, even without programming experience will understand how to customize it for their own use. en-us Sat, 16 Jun 2018 14:31:49 GMT http://www.rssboard.org/rss-specification http://bucarotechelp.com/design/csseasy/80061202.asp One way to highlight your webpage heading is to add a background image. This is very simple to do using the background-image style property, but since a heading element, is a block element, the background image will extend beyond the length of your heading. Mon, 18 Jun 2018 10:28:30 GMT http://bucarotechelp.com/design/csseasy/80061402.asp One way to highlight your webpage heading is to add a background color. This is very simple to do using the background-color property, but since a heading element, is a block element, you need to place a span within the heading tags and apply the background-color property to the span. Sat, 16 Jun 2018 14:31:49 GMT http://bucarotechelp.com/design/csseasy/80093001.asp By setting the CSS border-color property to a transparent color, and setting the background-origin property to border-box you can create a cool picture frame effect. Thu, 01 Mar 2018 09:30:27 GMT http://bucarotechelp.com/design/csseasy/81040602.asp I provide easy CSS code for 3d text when you move your mouse pointer over the 3D text shown above, the text will appear to be pressed. In this example, I configured the 3d text in a link. Fri, 25 Aug 2017 16:03:07 GMT http://bucarotechelp.com/design/csseasy/81040601.asp I provide easy code to create CSS flaming text animations. You are free to experiment with your own CSS property values. I bet you can create even better flaming text. CSS3 flaming text animations are fun and easy to create. Fri, 25 Aug 2017 14:46:13 GMT http://bucarotechelp.com/design/csseasy/81040702.asp You can give high-visibility to specific text on your webpage by giving it a 3d effect. Using the CSS text-shadow property You can easily turn your text to 3D. Thu, 24 Aug 2017 16:25:54 GMT http://bucarotechelp.com/design/csseasy/81040701.asp CSS3 added many new features, one of them was the ability to create animations entirely in CSS, without JavaScript. CSS3 animations are fun and easy to create. Thu, 24 Aug 2017 13:49:15 GMT http://bucarotechelp.com/design/csseasy/81100801.asp The CSS border-radius syntax seems quite confusing. That's because the full blown expression can have eight values. But don't worry, to create a beautiful oval shaped image requires only one value. Mon, 20 Feb 2017 16:27:58 GMT http://bucarotechelp.com/design/csseasy/81100902.asp Here is an easy way to create nice image text effects. A mask is an image with one color that is transparent, allowing an image behind it to show through, while a different color is used to block the parts of the image behind it. Sun, 19 Feb 2017 21:19:23 GMT http://bucarotechelp.com/design/csseasy/81101001.asp In the past web designers were restricted to a small group of fonts referred to as web-safe fonts. But now, you can easily link to hundreds, if not a thousand beautiful fonts hosted by Google Fonts. Sat, 18 Feb 2017 17:39:58 GMT http://bucarotechelp.com/design/csseasy/81101302.asp The CSS font-face rule allows web designers to load fonts from external sources, they no longer have to use one of the web-safe fonts. This article provides example code. Wed, 15 Feb 2017 17:21:44 GMT http://bucarotechelp.com/design/csseasy/81101901.asp One way to bring attention to a webpage element is to make it pulse. Fortunately, CSS level 3 has provided us with easy to use transitions. In this article You use CSS 3 transitions make a pulsing menu button. Thu, 09 Feb 2017 19:42:35 GMT http://bucarotechelp.com/design/csseasy/81102201.asp CSS level 3 defines 2D and 3D transforms and one of those transforms is 3D rotations. Just think of the beautiful 3D objects you can design using the 3D rotation transforms. Mon, 06 Feb 2017 20:15:25 GMT http://bucarotechelp.com/design/csseasy/81113003.asp CSS example code to center a DIV within a DIV. Sun, 01 Jan 2017 17:19:17 GMT http://bucarotechelp.com/design/csseasy/82011503.asp One of the latest web design trends is flat design, and one of the expressions of this trend is the ghost button. This article provides easy code to create ghost buttons. Tue, 15 Nov 2016 21:13:49 GMT http://bucarotechelp.com/design/csseasy/82011702.asp With today's widespread use of mobile devices, you might want to make images on your webpage adjust their size if your webpage is displayed on a small mobile smartphone screen. This article provides easy code examples to make images responsive. Sun, 13 Nov 2016 19:27:15 GMT http://bucarotechelp.com/design/csseasy/82062701.asp You can easily move the scrollbar of a block-level html element to the left side by setting its direction property to rtl. However, there are a few other thing you need to do to make it work right. Fri, 03 Jun 2016 21:28:34 GMT http://bucarotechelp.com/design/csseasy/82081201.asp The CSS3 transform property allows you to rotate, scale, move, and skew html elements. It be used to skew a div with an image background. In this example I create a cube using the CSS3 transform property. Mon, 18 Apr 2016 17:12:39 GMT http://bucarotechelp.com/design/csseasy/82081901.asp The CSS hsla method gives artists familiar with the HSL (hue, saturation, lightness, alpha) color specification a way to design color with CSS. Mon, 11 Apr 2016 21:23:11 GMT http://bucarotechelp.com/design/csseasy/82082601.asp The growth in users accessing the Web with mobile devices makes that market impossible to ignore. In this article you learn how to use media queries and the CSS column-count property to quickly create a Web page that is responsive to today's mobile devices. Mon, 04 Apr 2016 18:07:42 GMT http://bucarotechelp.com/design/csseasy/87020701.asp The current proper way to center a div is to use CSS to set both its margin-left and margin-right properties to auto. Thu, 24 Oct 2013 16:30:17 GMT http://bucarotechelp.com/design/csseasy/89020302.asp In this article, I show you how to create a nice looking button or badge with a rollover effect that requires no image because it uses CSS (Cascading Style Sheets). I think you'll find that this is amazingly simple to do. Fri, 28 Oct 2011 18:42:38 GMT http://bucarotechelp.com/design/csseasy/94072901.asp It's very easy to add drop shadows to the pictures on your webpages. In this article, I provide you with examples of how to use CSS to add drop shadows to your pictures. Go ahead and experiment with different drop shadow effects. Updated for CSS3. Tue, 25 Oct 2011 16:26:06 GMT http://bucarotechelp.com/design/csseasy/89060201.asp It can be difficult for your eyes to follow a row or column across a large table. In this article, I show you some easy CSS techniques to to add a background color to alternating rows or columns of a table to make it easier to read. Tue, 28 Jun 2011 20:12:23 GMT http://bucarotechelp.com/design/csseasy/90090601.asp If you're going to write quite a voluminous CSS-file, you should follow some general recommendations, which can help to avoid mistakes and to make the code understandable and convenient. For example write all the rules for every selector in the same place. Thu, 25 Mar 2010 14:55:42 GMT http://bucarotechelp.com/design/csseasy/90091501.asp At some point you might find the need to put text over an image. The easiest way is to use a graphics editor, but with a graphics editor, if you don't like the exact location where you placed the text, you have to start all over. By doing it with style code, you can move the text around just by retyping a few digits. Tue, 16 Mar 2010 15:30:10 GMT http://bucarotechelp.com/design/csseasy/90091601.asp A text drop shadow is a nice effect, but it used to require you to use a graphics editor to create a image text. CSS3 introduces the text-shadow property which makes it easy to create text drop shadows without using graphics. Mon, 15 Mar 2010 15:37:52 GMT http://bucarotechelp.com/design/csseasy/91010001.asp In this article I show you how easy it is to use script to display overlapping images on your webpage where you can just change numbers to play around and arrange the images and overlapping to get it just the way you like it without having to repeatedly use a graphics application. Mon, 30 Nov 2009 17:57:14 GMT http://bucarotechelp.com/design/csseasy/91060701.asp One of the most popular website navigation elements used today is the horizontal drop-down menu bar. Using the code provided in this article, you'll be able to create a menu bar that meets your requirements. You'll be able to easily change the number of main menu and sub-menu items, and to style the menu as you desire. Tue, 23 Jun 2009 14:51:38 GMT http://bucarotechelp.com/design/csseasy/91071701.asp A basic blockquote is a bit boring, but there are a few style tricks that you can use to spice them up. In this article you learn how to set a border, how to use graphic quote images and a few other style tricks. Wed, 13 May 2009 16:38:02 GMT http://bucarotechelp.com/design/csseasy/91091501.asp You have undoubtedly seen websites that display text within round cornered boxes, and, since there is no round cornered html element, you wondered how that was done. In this article, you'll learn precisely how to create such a round cornered box. Mon, 16 Mar 2009 16:23:51 GMT http://bucarotechelp.com/design/csseasy/92000001.asp One of the most important CSS webpage layout concepts to understand how to position webpage elements. In this article you'll learn how a web browser places elements on the webpage as it renders the display, and you'll learn about the five different methods of positioning: static, relative, absolute, fixed, and float. Wed, 31 Dec 2008 17:14:33 GMT http://bucarotechelp.com/design/csseasy/92010501.asp One of the most important CSS webpage layout concepts to understand is the box model. Every element on a webpage is actually a rectangular box. Exactly how a box will display depends upon the positioning method used, which other CSS properties you set for the box and how you select the box. Wed, 26 Nov 2008 20:22:47 GMT http://bucarotechelp.com/design/csseasy/92071802.asp CSS menus with rollover effects are the standard for today's Web sites. In this article, you learn how to create a single-level CSS rollover menu. With this information and example code, you should be able to design your own menus. Tue, 13 May 2008 21:47:52 GMT http://bucarotechelp.com/design/csseasy/92080201.asp In a previous article, I described an easy method to create an expanding menu similar to Windows Explorer, but with only one level of sub-menus. This article provides code for a similar expanding menu, except with two levels of sub-menus. Mon, 28 Apr 2008 15:28:07 GMT http://bucarotechelp.com/design/csseasy/92112103.asp One thing this book focuses on that is different than the majority of other CSS book is that is stresses creating semantic markup throughout the design and development process. What this means is that the code is free of presentational information using div and span only when absolutely necessary. Thu, 10 Jan 2008 19:07:09 GMT http://bucarotechelp.com/design/csseasy/93011602.asp Horizontal rules can increase webpage readability by providing a separation between different topics on a page. Horizontal rules are often used to separate a footer or resource box at the bottom of a webpage from the main webpage content. HTML by itself creates some pretty bland horizontal rules. But with CSS designers have the means to create interesting horizontal rules. Tue, 18 Dec 2007 15:25:37 GMT http://bucarotechelp.com/design/csseasy/93051201.asp A pull quote is a sentence or two extracted from an article and placed in quotes. The extracted text is used as a "teaser" to entice the reader to continue reading. By using quotation mark and background images along with choice of fonts, font size and color, you have infinite opportunities for creativity in the design of pull quotes. Tue, 18 Dec 2007 15:25:37 GMT http://bucarotechelp.com/design/csseasy/93051305.asp A starburst is a useful advertising graphic that draws the viewers attention to exclamatory advertising message. It can be entirely graphic, that is, the starbust and the text are all in one graphic image. In this article, I show you how to use a starburst graphic with text that you type in. This has the advantage that you can change the text without editing the graphic. Tue, 18 Dec 2007 15:25:37 GMT http://bucarotechelp.com/design/csseasy/93051901.asp Long ago printing was much more stylish than it is today. The first letter of the first paragraph was much larger than the rest of the text. If you want to publish fictional content on the Web, you can give your story an extra touch of class. Use the information in this article to set a larger first letter for the first paragraph. Tue, 18 Dec 2007 15:25:37 GMT http://bucarotechelp.com/design/csseasy/93061702.asp The early Web was used to communicate data between Universities and one of the most common structures used for that purpose is a table. Even today, many tables use the default styles, which makes them somewhat boring. In this article, I show you how to use CSS (cascading Style Sheets) to make your tables more interesting. Tue, 18 Dec 2007 15:25:37 GMT http://bucarotechelp.com/design/csseasy/93062501.asp Lists are a very common structure found on Web pages. Many lists use the default styles, which makes them somewhat boring. In this article, I show you how to get control of your lists and how to use style rules to make them more interesting. Tue, 18 Dec 2007 15:25:37 GMT http://bucarotechelp.com/design/csseasy/93070101.asp Tabbed navigation depicts file folder tabs as a metaphor to navigate a website. In this article I'll provide the code for tabbed navigation based on a list that uses only CSS, and one that uses CSS combined with graphic images. Tue, 18 Dec 2007 15:25:37 GMT http://bucarotechelp.com/design/csseasy/94102602.asp Creating popup tooltips is extremely easy if you're satisfied with the style defined by the client operating system. With a bit of style code and a bit of Java Script code you can control the appearance of your tooltips. Tue, 18 Dec 2007 15:25:37 GMT http://bucarotechelp.com/design/csseasy/95032801.asp This article provides you with easier expanding menu code than a previous article did by losing automatic menu unexpand feature and added some easy CSS code to provide nice mouse over effects. Tue, 18 Dec 2007 15:25:37 GMT http://bucarotechelp.com/design/csseasy/95050501.asp In this article, you'll learn how to create the rollover effect without using Java Script and without preloading images. You'll learn how to combine the up, over, and down images into a composite image, and how to use Cascading Style Sheets (CSS)to specify a position offset into the image in order to display the proper section for each button state. Tue, 18 Dec 2007 15:25:37 GMT http://bucarotechelp.com/design/csseasy/95060601.asp In this article you'll learn how to create a scrollable area. Then you'll learn how to use Style code to customize the appearance of your scrollable area. Next you'll learn how to layout your webpage with scrollable areas. And last, you'll learn how to load your scrollable area's from external files so you never need to edit your front page again. Tue, 18 Dec 2007 15:25:37 GMT http://bucarotechelp.com/design/csseasy/95081904.asp In this article, you'll learn how to avoid the need to make graphic menu buttons, yet still produce the same visual effect that graphics provides. You'll learn how to create graphical looking buttons by applying simple style rules. Tue, 18 Dec 2007 15:25:37 GMT http://bucarotechelp.com/design/csseasy/96002401.asp In this article you learn how to create a floating menu with only a few simple lines of code. You learn how to make the menu float smoothly, and you learn how to give your floating menu 3D buttons and mouseover effects. Wed, 30 Apr 2008 17:13:55 GMT http://bucarotechelp.com/design/csseasy/96050201.asp This article demonstrates how easy it is to use Internet Explorer's built-in functions to create interesting visual effects to spice up your webpage. Add only a few simple lines of Java Script code and you can create very impressive dynamic effects. Tue, 18 Dec 2007 15:25:37 GMT http://bucarotechelp.com/design/csseasy/97092920.asp You've used color and graphics to create a visually exciting Web site. Then you add a web form with the default font and gray and white colors. You don't have to have dull Web forms. In this article I show you a few tricks that you can use to spice up your Web forms. Tue, 18 Dec 2007 15:25:37 GMT http://bucarotechelp.com/design/csseasy/97112700.asp Popups are usually created by using JavaScript to open a new browser window. But with today's Cascading Style Sheets (CSS) capable browsers you don't need to open a new browser window. Instead, you can create popups by applying styles to html span or div elements. Tue, 18 Dec 2007 15:25:37 GMT