Can someone please help me with a tiny bit of background coloring

Discussion in 'HTML & Website Design' started by japindian, Apr 2, 2007.

  1. #1
    Hi, i have just created the site bypassing[.] info As you can see it looks very...odd. I want to just put the color i used for the header as the background. Unfortunately i have no idea how to get that color :(. Like i can put green or blue all over but that looks weird. If you know how to do this can you please pm me. Ill give you rep and itrader :D
     
    japindian, Apr 2, 2007 IP
  2. rcj662

    rcj662 Guest

    Messages:
    4,403
    Likes Received:
    97
    Best Answers:
    0
    Trophy Points:
    0
    #2
    I think the code for the color in graphics would be close to this code

    DFDFDF
     
    rcj662, Apr 2, 2007 IP
  3. Debs

    Debs Member

    Messages:
    51
    Likes Received:
    1
    Best Answers:
    0
    Trophy Points:
    43
    #3
    The best way to get the color code is open your header graphic up in a graphics program, which will usually have a color picker option. In Fireworks it's a little eyedropper looking icon, which you select then put it on your graphic where the color is that you want,and click. Then it will change the fill color bucket to that color, at which point if you point your mouse and just hover it over the colored square you'll see the color code numbers displayed.

    Hope that helps.

    Debs
     
    Debs, Apr 2, 2007 IP
  4. deezdrama

    deezdrama Guest

    Messages:
    132
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #4
    yep i was gonna say the same thing but using photoshop
     
    deezdrama, Apr 2, 2007 IP
  5. Rasczak

    Rasczak Peon

    Messages:
    131
    Likes Received:
    4
    Best Answers:
    0
    Trophy Points:
    0
    #5
    the fastest way to get the pic into PS is alt+printscreen :) then ctrl+n in PS, enter, ctrl+v :) 3 seconds operation :)
    then you can scan the colour and get the hexa-code of it.
    good luck and cheers!



     
    Rasczak, Apr 3, 2007 IP
    japindian likes this.
  6. aquasonic

    aquasonic Well-Known Member

    Messages:
    90
    Likes Received:
    5
    Best Answers:
    0
    Trophy Points:
    115
    #6
    WAY easier than all that... I have a fancy freeware program that will tell you the colour.

    go to www.w-a-a.org/programs and there's a program in there called Colourificator.exe - download it and it will get you the colour.

    Alternativly - because it's a windows program... if you're on a mac (like me) go to Applications and go in to the Utilities folder... there's a really handy program in there called DigitalColor Meter - that will do the same job. :)


    Hope this helps,


    Sonic
     
    aquasonic, Apr 3, 2007 IP
    Rasczak and japindian like this.
  7. icebreaker

    icebreaker Peon

    Messages:
    349
    Likes Received:
    1
    Best Answers:
    0
    Trophy Points:
    0
    #7
    you can use photoshop to accurately distinguish the perfect color combination that's best for your website.
     
    icebreaker, Apr 3, 2007 IP
  8. japindian

    japindian Peon

    Messages:
    666
    Likes Received:
    15
    Best Answers:
    0
    Trophy Points:
    0
    #8
    Ok, ill buy photoshop, case solved. Thanks for your help.
     
    japindian, Apr 3, 2007 IP
  9. Cheap SEO Services

    Cheap SEO Services <------DoFollow Backlinks

    Messages:
    16,664
    Likes Received:
    1,318
    Best Answers:
    0
    Trophy Points:
    0
    #9
    If you email the pic file I will change it for you in 2 seconds.

    The exact colour is 336799

    Col :)
     
    Cheap SEO Services, Apr 3, 2007 IP
    japindian likes this.
  10. simice

    simice Guest

    Messages:
    80
    Likes Received:
    2
    Best Answers:
    0
    Trophy Points:
    0
    #10
    An even easier way is to use a firefox browser and use the 'Colorzilla' plugin - https://addons.mozilla.org/firefox/271/

    Colorzilla is a small tool to pick and copy colours from anywhere on the screen.
     
    simice, Apr 4, 2007 IP
  11. Rasczak

    Rasczak Peon

    Messages:
    131
    Likes Received:
    4
    Best Answers:
    0
    Trophy Points:
    0
    #11

    GRRRRRRRRRRRRRRREAT tool, thanks & rep added!
     
    Rasczak, Apr 4, 2007 IP
  12. Louis11

    Louis11 Active Member

    Messages:
    783
    Likes Received:
    26
    Best Answers:
    0
    Trophy Points:
    70
    #12
    In regards to your other alignment post, and color question :)

    To be honest with you, the markup is horrible. Did you use a WYSIWYG editor to create it? I'm not bothered to sift through the mess, so I figured I would bestow something on you... CSS/XHTML

    
    body {
    
            margin: 0px; 
    
            padding: 0px;
    
            text-align: center;
    
            background: #FFFFFF;
    
            }
    
                    
    
        img{
    
            border: 0px;
    
            }
    
                
    
        #content{
    
            width: 800px;
    
            margin: 0px auto;
    
            text-align:left;
    
            }
    
                
    
        #column{
    
            background-color: #A7C82B;
    
            /* I Just set this at 500px as it
    
            /* appered you where going for a fixed
    
            /*  layout */
    
            height: 500px;
    
            }   
    
                
    
        #column div{
    
            float: left;
    
            margin: 5px;
    
            }
    
                    
    
        #content p{
    
            background-color: #;
    
            padding: 5px;
    
            background-color: #B0CE41;
    
            font-weight: bold;
    
            color: #FFFFFF;
    
            font-size: 12px;
    
            }
    
    Code (style.css):
    Save that as style.css...

    
    <html>
    
    <head>
    
            <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
    
            <link rel="StyleSheet" href="style.css" type="text/css" media="all" />
    
            <title>Bypass.info</title>
    
        </head>
    
        <body>
    
            <div id="content">
    
                <div id="head"><img src="http://bypassing.info/index_files/image002.jpg" alt="Bypass Filters!" /></div>
    
                <div id="column">         
    
                    <div id="left" style="width: 590px;">
    
                        <p>Welcome To GetPastFirewalls.com,<br />
    
                        I am sure we all have been at school or work and want to visit a fun site, for a break. So we login to the 
    
                        computer and the filters at school or work have blocked the site! So of course we go search for a proxy, 
    
                        but again almost all the proxies are blocked.<br /><br />
    
    
    
                        So we have to go find a "Unknown proxy" that hasn't been blocked which could take endless hours. Well here 
    
                        is the solution to this problem.<br /><br />
    
    
    
                        GetPastFirewalls.com sends an email to your email every Monday, Wednesday and Friday with a brand new proxy. 
    
                        This cuts down the time and searching to just checking your mail at school, and clicking on a link!<br /><br />
    
                        
    
                        The best part about GetPastFirewalls.com, is the fact that is 100% free. That’s right no fees, unlike many 
    
                        sites that charge up to $20! For this service. We are proud to offer it for free.<br /><br />
    
                        
    
                        Of course, we keep your email safe and never give it to ANY party; not second not third.<br /><br />
    
                        
    
                        It's always nice to hear any suggestions and feed back so please feel free to contact us.<br /><br />               
    
                        
    
                        - GetPastFirewalls.com Owner
    
                        </p>
    
                    </div>
    
                    
    
                    <div id="right" style="width: 180px;">
    
                        <p>
    
                        This is your other side bar. To get a nother green box below it just add more paragraph tags
    
                        below. CSS will handle the rest :)
    
                        </p>
    
                        <p>
    
                        Like this! Simply by adding another paragraph!
    
                        </p>
    
                    </div>
    
                    
    
                </div>
    
            </div>
    
        </body>
    
    </html>
    
    Code (index.html):
    Do you see how much cleaner that code is? And how much more readable it is? Basically, instead of using that mess of tables, paragraphs, breaks and who knows what to create those simple green boxes I just created a psuedo class of the ID "Column" and just called up several paragraphs

    Tested in IE and FF and displays perfect

    Hope that helps!
    - Louis
     
    Louis11, Apr 4, 2007 IP
    japindian likes this.