Use PHP and CSS to change the webpage text size _ PHP Tutorial

Use PHP and CSS to change the webpage text size. When designing a website with PHP and CSS to change the text size of a webpage, remember that not all visitors are awesome young people, they are not necessarily familiar with Web tracking's use of PHP and CSS to change the size of webpage texts. remember that not all visitors are awesome young people when designing websites, they are not necessarily familiar with the various Web browser usage methods.

When designing a website, keep in mind that not all visitors are excited young people, and they are not necessarily completely familiar with the use of Web browsers. Smart designers understand this and often incorporate various special accessible features into the design of the website so that even elders or persons with disabilities can easily and comfortably use the website, instead of spending extra effort.

The text size regulator is one of the most effective accessible features that any website may need. In short, it is a tool used to change the text size of a webpage, this feature is usually used to increase text size so that it is easy to read. many browsers have come with this feature, but beginners of web browsers do not know how to use this feature. therefore, website designers often put easier-to-use buttons on each web page to implement this function.

This guide will show you how to use PHP and CSS to add a text size regulator with this function on the webpage. Therefore, add this accessibility to your website as soon as possible, in this way, you will learn how to use the earned points from users over 50 years old.

Note: This guide assumes that you have installed Apache and PHP

How does it work?

Before writing code, it is very helpful to take some time to understand how the text size regulator works. Each page on the website contains a series of control buttons that allow users to select the text size of the page: small, medium, and large. Each font size corresponds to a CSS style sheet, these style sheets save the rules used to render the webpage text size.

When a user makes a selection, PHP stores the selected font size in a session variable and reloads the webpage. the page reads the selected font size from the session variable, and dynamically call the corresponding style sheet to re-render the webpage with a smaller font size or larger font size.

Process

Step 1: Create a webpage

Starting from creating an HTML document, complete the placeholder content first. List A is an example:

List:

Text size: small | href = "resize. php? S = medium "> medium | large

Loremipsum dolor sit amet,

Consecteturadipisicingelit, sed do eiusmodtemporincididuntutlabore et dolore

Magna aliqua. Utenim

Ad minim veniam, quisnostrud exercitation ullamcolaboris nisi utaliquip ex ea

Commodoconsequat.

Duisauteirure dolor in reprehenderit in

Voluptatevelitessecillumdoloreeufugiatnullapariatur.

Deleteursintoccaecatcupidatat non proident, sunt in culpa qui

Officiadeseruntmollitanim id estlaborum.

Note the text hyperlinks at the top of the page. each hyperlink points to a script file named resize. php and passes the selected font size to it through the url get method.

Store this document with the. php extension in your Web server directory, for example, index. php.

Step 2: create a style sheet

Next, create a style sheet file for each text size: small.css, medium.cssand large.css. this is the content of the small.css file:

Body {

Font: 10px

}

In the same sample, you can create medium.css and large.css, respectively using 17px and 25px to save these style sheet files and the web pages created in the previous step in the same directory.

Step 3: create a mechanism for changing the text size

As described above, the webpage can find the pre-defined session variables to "know" which style table file to load, and the session variables are resize through the script file. php control (see list B). This file is activated when you click the button to change the text size at the top of the page. this is resize. php content:

List B

// Start session

// Import selected size into session

Session_start ();

$ _ SESSION ['textsize'] = $ _ GET ['s '];

Header ("Location:". $ _ SERVER ['http _ referer']);

?>

This is simple. when you select a new text size, resize. php uses the GET method to obtain the font size value, store it in the SESSION variable $ _ SESSION ['textsize'], and redirect the browser to the opened page. [Next]

Of course, there is still a lack of components: intelligently allowing the web page to automatically detect the size of the text currently selected by the user and load the corresponding style sheet. in order to add this function, open the index of your webpage file. php, and add the following statement to the beginning of the file (see list C ):

List C

// Start session

// Import variables

Session_start ();

// Set default text size for this page

If (! Isset ($ _ SESSION ['textsi

...