Use CSS to control the overall webpage Style

Source: hacker Base

In web design, we usually need to unify the overall style of the Web page. Most of the unified style involves the text attributes, the background color of the web page, and the link text attributes. If we apply CSS to control these attributes, this will greatly improve the webpage design speed and unify the overall webpage effect.

To modify the entire webpage, We need to edit an external CSS document. Define and modify different CSS attributes based on this document, and call it in a webpage with the same or similar page elements.

Overall page style change

The 9pt and 10.5pt fonts of are popular on the webpage. Press the shortcut key "Shift + F11" to open the "CSS Style Control Panel" and click the "New Style" button, the "New Style" dialog box is displayed. Check the "Type" of "Redefine HTML Tag". options such as "body", "br", and "cite" are displayed at the Tag, select "body" and then confirm. In this way, we have created a plug-in CSS document. After saving it as all in the SAVE dialog box, we will go to the "Style Definition for body in all.css" dialog box (1 ). Select "Type" in "Category" and define "Font" as "" and "Size" as "9 ", select "Points" and "Color" in the drop-down box to customize the preferred Color. Of course, you can also select the "Background" item in "Category" to define the "Background" color and other Background attributes. Then you will see the overall change in the content on the page.
Changes in the style of preference Elements

The above changes may cause you some trouble. What if you encounter an element on the page, such as the font, font size, and color of the highlighted text! Here we need to define a new CSS Style Sheet to control it, right-click the page editing area, and click the "CSS Style/Edit Style Sheet" command in the pop-up shortcut menu, the Edit Style sheetaskdialog box is displayed. Select all.css in the dialog box and click "New". In the New Style dialog box that appears, select "Make Custom Style (class) the "Type" Type defines a preferred CSS control. If you want to change the attributes of an element on the page, right-click the CSS defined in "Apply Styles" on the "CSS Styles" Panel and execute the "Apply" command.

Unified Control of Hyperlink

Hyperlink is often used in web pages, and the link color of web pages is blue by default. Although it can be changed, the display of a single color on a web page with different background colors is not so effective, let's take a look at how to use CSS to control web pages to achieve different personalized link colors. In the "New Style" dialog box, select the "Type" of "Use CSS Selector". In the "Selector" drop-down box, "a: link (link attribute)" is listed) "," a: hover (attributes of moving the mouse over the link) "," a: visited (attributes after the link is accessed) ",": active (attributes in the Link focus state) "4 options (3). the settings of these four options control all the Link Attributes on the webpage, we can define these four attributes separately, and then add them to the "CSS Style" Panel with CSS control different from the default settings, then, "Apply" it to the link to be changed. If you set the font of "Hover" to a little bigger than "Link", the font will become larger when you move the mouse over the Link. Try to see if it is amazing!
Terminology: CSS (Cascading Style Sheet) is a widely used technology in the process of creating web pages. Web pages controlled by CSS technology are used, designers can more easily and effectively control the overall layout, color, Font, Link, background, different parts of the same page, and the appearance and format of different pages.. After Dreamweaver MX was launched, it improved CSS rendering and design tools, and enhanced the CSS panel to clearly display internal and external defined styles, allowing users to build websites that comply with the latest CSS standards.