括号问题,它让我发疯

时间:2015-12-05 14:41:10

标签: html css adobe-brackets

我真的希望那里有人知道关于括号的事情!我正在为学校做一个项目,昨天一切都很顺利。我有四个页面,一个主页,事件页面,联系页面和关于页面。不知何故,在inspect元素面板中,我在样式部分中加载了事件页面,所以现在,无论我做什么,事件页面中的背景图像都会加载到我的所有其他页面中。即使我从CSS中删除它!我无法弄明白,我不知道我是如何开始的!我如何摆脱它,以便我可以用不同的图像和不同的方式对页面进行不同的设置?!不知道css和html如何提供帮助,但无论如何我都会加载它。

<!doctype html>
<html>
<head>
    <title>events</title>
<meta charset="utf-8">
    </head>



        <link href='https://fonts.googleapis.com/css?family=Miltonian+Tattoo' rel='stylesheet' type='text/css'>
    <link href='https://fonts.googleapis.com/css?family=Convergence' rel='stylesheet' type='text/css'>

    <link rel="stylesheet" href="eventscss.css">



      <body>
        <div id="header">

     <h1>Ready...Set...SPLASH!!</h1>
        </div>

<aside class="sidebar1">

     <h2>Where to?</h2>

    <div id="mainnav">

       <ul>
    <li><a href="index.html">Home</a></li>
    <li><a href="events.html">Events</a></li>
    <li><a href="contact.html">Contact</a></li>
    <li><a href="about.html">About</a></li>
        </ul>

    </div>

    <div id="one">
    <img src="surprisedgirl.jpg" height="200" width="250">
    </div>

        </aside>


<article class="main">
    <h2>PLAN YOUR NEXT BIRTHDAY WITH US!!</h2>
    <p>Does someone have a birthday coming up? Why not plan a pool party? We have three different party packages to choose from. 
    You caan reserve anything from a little table, to an entire pool. We'll try our best to make sure the kiddos have the best 
    birthday ever. They'll be sure to talk about it for months to come. And you'll feel great knowing that you made it happen. 
    (Way to go!...)</p>

    <p> The first Party Package that we offer is the standard Bronze Package.
    You'll get three hours and ride passes for all. Skip straight to the front of the line of any slide you choose. We have party rooms for reservation or you 
    can choose a tent outdoors and poolside. Three large one topping pizzas, beverages, and wrist bands for the slides are all included for a set price of 
    $125. Limit of 10 wristbands. Additional bands can be purchaced for $2.00 per band.</p>

    <p> Second choice for your party plans would be the Silver Package. Five party hours to toy around with, 15 slide wristbands, 
        jump to the front freedom, five large pizzas (three 1 topping, two 2-3 topping) beverages, party room or tent. All of this for only $150!</p>

    <p> The third and final option that we offer is the Gold Package. This is the Mac Daddy of em' all! This package 
        includes all day play, unlimited wristbands, jump to the front freedom, eight large pizzas (of your choice) beverages, party room or tent, and a special Happy Birthday 
        message announced over the loud speaker before singing Happy Birthday! Your birthday boy or girl will feel as if they are on top of the world! This deal can be yours 
        for only $200! <br> Talk about a deal to be had!!</p>

</article>

<aside class="sidebar2">

    <div id="img1">
    <img src="goggle_kids_small.jpg" height="150" width="200">
    </div>

    <div id="img2">
    <img src="waterparkkids.jpg" height="150" width="250">
    </div>

    <div id="img3">
    <img src="slide-01.jpg" height="150" width="200">
    </div>



    </aside>

              <style>
#one img {

  padding-right:20px;
  margin:10px;
  width: 250px;
  height: 300px;
  padding-top: 60px;
  transform: rotate(-10deg)
}
#img1 img{

  padding-right:40px;
  margin:10px;
  width: 250px;
  height: 200px;
  transform: rotate(10deg);
}
#img2 img{

  padding-right:40px;
  margin:10px;
  width: 250px;
  height: 200px;
     transform: rotate(-10deg);

}
#img3 img{

  padding-right:40px;
  margin:10px;
  width: 250px;
  height: 200px;
     transform: rotate(10deg);
    padding-top:20px;
}

</style>


            <div id="footer">
                <h4>Lilly's Pad 238 Main Street, Asheville NC 28804 (828)-669-4828 www.Lillyspad.com</h4>

h1{
    padding-top: 15px;
    margin:0;
    height: 100px;
    font-family:"Miltonian Tattoo";
    font-size: 3em;
    color:whitesmoke;
    text-shadow:3px 3px black;
    text-align: center;
    background-image: url(pool-water-hd-inspiration-1.jpg);
    background-repeat: repeat-x;

}

/*First column*/
.sidebar1 h2, .sidebar2 h2{
    font-family: "Miltonian Tattoo";
    text-align: center;
    color: black;
    text-shadow: 2px 2px white;

}

.sidebar1{
    float: left;
    width: 20%;
    padding: 0 20px 0 10px;
    background-image: url(Water-Drop-background.jpg);
    height: 800px;}

 #one{border-radius: 50%;

}

/*all main styles*/
#mainnav li{
    list-style-type: none;
    padding-top: 30px;}

#mainnav a:link{

    text-decoration: none;
    background-color:#feff00;
    border-radius: 15px;
    display: block;
    background-size: 15px;
    width: 100px;
    padding: 5px 5px 5px 10px;
    margin-bottom: 5px;
    padding-right: 20px;
    font-family:  "Miltonian Tattoo";
    color:black;
    text-align: center;}


#mainnav{
    background-color:#ccf3ff;
    -webkit-box-shadow: -8px 11px 25px 0px rgba(0,0,0,0.68);
    -moz-box-shadow: -8px 11px 25px 0px rgba(0,0,0,0.68);
    box-shadow: -8px 11px 25px 0px rgba(0,0,0,0.68);
    height: 300px;
    border-radius: 20px;
    padding-left:45px;}


.main{
    float: left;
    width: 60%;
    height:800px;
    padding: 0 20px;
    background-image: url(happybirthday.jpg);
    background-size: 400px;
    background-repeat: no-repeat;
    background-position: bottom;
}

.main h2{
    font-family: "Miltonian Tattoo";
    text-align: center;
    font-size: 2em;
}

.main h3{font-family: "Miltonian Tattoo";}

.main p{
    font-family: Convergence;
}

/*Second Column*/
.sidebar2{
    background-image: url(Water-Drop-background.jpg);
    height: 800px;
    float: right;
    width: 20%;
    padding: 0 10px 0 20px;}

.sidebar2 p{
    font-family: Convergence;
    font-style: italic;
    background-color: aliceblue;
    text-align: center;
    border-radius: 30px;
    font-size: 0.9em;
    -webkit-box-shadow: 10px 10px 14px -4px rgba(0,0,0,0.75);
    -moz-box-shadow: 10px 10px 14px -4px rgba(0,0,0,0.75);
    box-shadow: 10px 10px 14px -4px rgba(0,0,0,0.75);
}

#footer{
    background-color:  #feff00;
    clear: both;
    height: 20px;
    text-align: center;
    font-style: italic;
    font-size: .9em;
}

/*To keep from having float drops*/
*{
    -moz-box-sizing: border-box;
    box-sizing: border-box;}

0 个答案:

没有答案