Help Changing Multiple Font Colors |
Help Changing Multiple Font Colors |
Jabo2531 |
Aug 31 2019, 03:40 AM
Post
#1
|
Group: Members Posts: 3 Joined: 31-August 19 Member No.: 26,977 |
So I have a somewhat simple problem I cant figure out.
I have a super simple web application that works. I want to change it so that when a user enters a color like RED it outputs the word RED but in red text. Same goes with blue, green etc. I understand that php doesn't do any formatting in regards to color, background fonts. etc. thats all with CSS/HTML. Here is the output page CODE <?php $your_name = $_POST['yourName']; $your_color = $_POST['yourColor']; $colors = [ ?> <!DOCTYPE html> <html> <head> <title>Practice</title> <link href="stylesheet2.css" rel="stylesheet" type="text/css" /> <style> </style> </head> <body> <div id="content"> <h1>This is the Second Page</h1> <p> Hello <?php echo $your_name; ?></p> <p> Your Favorite Color is <?php echo $your_color; ?> <p><a href="first.html"> Go Back</a></p> </div> </body> </html> Here is the CSS snippet for the form CODE #content { width: 450px; margin: 0 auto; padding: 0px 20px 20px; background: red; color: blue; border: 2px solid navy; } I have been wracking my brain on this problem for a better part of a week and Im certain it needs an inline style via CODE <span></span> but cant figure out how to merge the two.Thanks in advance |
Christian J |
Aug 31 2019, 02:09 PM
Post
#2
|
. Group: WDG Moderators Posts: 9,656 Joined: 10-August 06 Member No.: 7 |
I want to change it so that when a user enters a color like RED it outputs the word RED but in red text. Same goes with blue, green etc. What if the color name does not exist? QUOTE I understand that php doesn't do any formatting in regards to color, background fonts. etc. thats all with CSS/HTML. You can let PHP generate the HTML and CSS. For example: CSS CODE span.sample {color: <?php echo $your_color; ?>;} HTML CODE <p> Your Favorite Color is <span class="sample"><?php echo $your_color; ?></span> A few notes though: - Users may type in incorrect color values. - Users may inject their own HTML through the form, unless you limit what they're allowed to submit. PHP's htmlspecialchars() function is one way to avoid that. - If the user chooses the same color as the background, the resulting text will be invisible. You can avoid all the above problems by only allowing a whitelist of predefined colors, and comparing the user's input with the list. In addition you can offer the user a list a color names in e.g. a list of radio buttons (but such a list should always be double-checked on the server-side). |
Jabo2531 |
Aug 31 2019, 09:53 PM
Post
#3
|
Group: Members Posts: 3 Joined: 31-August 19 Member No.: 26,977 |
CSS CODE span.sample {color: <?php echo $your_color; ?>;} HTML CODE <p> Your Favorite Color is <span class="sample"><?php echo $your_color; ?></span> This is what I was looking for something really simple, but alas it doesn't want to work. which by all accounts it should. CSS changes the color via referencing the variable then with the output it prints out the text in the color the user is choosing. It is out putting correctly with what you have written but its not doing the color change. |
Christian J |
Sep 1 2019, 04:46 AM
Post
#4
|
. Group: WDG Moderators Posts: 9,656 Joined: 10-August 06 Member No.: 7 |
Make sure that there's no other CSS rule with higher specificity affecting the color. You can override that with e.g. an "!important" keyword:
CODE span.sample {color: <?php echo $your_color; ?> !important;} If it still doesn't work, please post the CSS and HTML that the PHP has generated. |
Jabo2531 |
Sep 5 2019, 02:00 AM
Post
#5
|
Group: Members Posts: 3 Joined: 31-August 19 Member No.: 26,977 |
Make sure that there's no other CSS rule with higher specificity affecting the color. You can override that with e.g. an "!important" keyword: CODE span.sample {color: <?php echo $your_color; ?> !important;} If it still doesn't work, please post the CSS and HTML that the PHP has generated. Thanks for the help, your solution was working for me. My issue was I was putting all the CSS into a external file instead of doing it within the HTML document itself. got it all sorted now and it works correctly. |
Christian J |
Sep 5 2019, 04:49 AM
Post
#6
|
. Group: WDG Moderators Posts: 9,656 Joined: 10-August 06 Member No.: 7 |
|
Lo-Fi Version | Time is now: 25th April 2024 - 07:01 AM |