adsense

How to Round the Corners on My WordPress Blog





1. Direct your Web browser to the 'wp-admin' directory of your WordPress site and log in to the dashboard. Navigate to 'Appearance' from the menu on the left. Click 'Editor' under 'Appearance' to load the 'Edit Themes' screen. Click on the link to your 'index.php' file and inspect the code that loads in the editor. Load 'header.php' if you wish to examine the header; load 'footer.php' to examine the footer code.
2. Find the tags that create the elements you want to restyle with rounded corners, such as 'div' or 'section' tags around columns or heading tags around the website's title. Take note of the class or ID name assigned to each set of tags. When possible, note the class name of multiple tags when you want to give them all rounded corners, as a class ID only is applied to one tag at a time.

3. Load the 'style.css' style sheet file in the theme editor. Build a CSS selector to 'select' the elements that you want to style with rounded corners by either their ID or class names. Use the hash sign prefix to select by ID and a dot prefix to select by class name. Here are examples of both kinds of selectors:.post {}#header {}
4. Chain your selectors if you plan on giving all of your rounded corners the same 'border-radius' value. Use commas to separate the selectors and put each one on its own line, matching the WordPress guidelines for CSS code:.post,#header {}
5. Write your property-value pairs between the curly braces of your selectors. Round the corners using the 'border-radius' property and a value set in either pixels or percentages. Here is an example of how to use the 'border-radius' property:.post {border-radius: 10px;}The above code gives every post container a border-radius of 10 pixels, creating subtly rounded corners.

Comments

0 Responses to "How to Round the Corners on My WordPress Blog"

Post a Comment

Popular Posts

About