Of the new turn... Do a problem page navigation menu 2. Bosses give directions-CodePudding

Home > front end > Of the new turn... Do a problem page navigation menu 2. Bosses give directions

Of the new turn... Do a problem page navigation menu 2. Bosses give directions

Time：10-07

A web page is doing school elective course assignments, programming based almost to zero, also went with online classes to knock out the code, the results in this place card is old for a long time all can not find the cause of the error, is about to hand in the homework, good anxiety

Want to make it below this drop-down menu

But in the end I made this

Click on the product, after the below fan of aperture,,,

What went wrong?

HTML code this is the entire navigation
The

reference

& lt; Div & gt;

Sketch

Rendering

Model

Technology

Animal

Scenery

This is the CSS code

The nav {
height:100px;
Width: 1280 px;
Background - color: # 1 c1f24;
position:absolute;
Padding - top: 500 px;
}
The nav # one {
The font - size: 18 px;
Color: # FFF.
The font-family: "Microsoft jas black";
Padding - left: 370 px;
Padding - top: 30 px;
Float: left;
}
The nav a {
text-decoration:none;
Color: # FFF.
}
The nav h3 {
display:block;
Height: 70 px;
}
The title {
Padding - left: 20 px;
}
. # nav navigation {
Width: 210 px;
The font - size: 18 px;
Color: # FFF.
The font-family: "Microsoft jas black";
Padding - left: 200 px;
Padding - top: 30 px;
Float: left;
}
Li {
The line - height: 45 px;
Border - top: 2 px solid # 666;
Background - color: # 000;
Width: 210 px;
Display: none;

}
. Con {
Display: none;
Background: # 4 b383a;;
}
The hover {
Background - color: # ab7e5f;
}

# navigation p {
font-size:12px;
The line - height: 35 px;
Border - top: 1 px solid # 3 f4041;
Padding - left: 40 px;
}
The nav # two {
The font - size: 18 px;
Color: # FFF.
The font-family: "Microsoft jas black";
Padding - left: 80 px;
Padding - top: 30 px;
Float: left;
}

This is a jQuery

The $(document). Ready (function () {

$(' # navigation). Mouseover (function () {
$(this). The find (" li "). The show ();
});
$(' # navigation). Mouseout (function () {
$(this). The find (" li "). Hide ();
});
$(" li "). Click (function () {
$(this). The find (' con '). The slideToggle (). The parent (). The siblings (.), find (' con '). The slideUp ();
$(this). The find (' title '). The addClass (' hover '). The parent (). The siblings (.), find (' title '). RemoveClass (' hover ');
})
})

Sincerely help bosses give directions

CodePudding user response:

In the front style plus p {margin: 0}, p tags have the default margin, in Chrome, Firefox, Safari, Opera, Maxthon, IE8.0: margin: 12 px 0 px;

19 px in IE6.0 7.0: margin: 0 px;

CodePudding user response:

You use h3, p label this browser is the default style,
In your CSS the top
* {
margin: 0;
padding: 0;
}
Should ok, the hope can help you

Page link：https//www.codepudding.com/frontend/55551.html

Prev:Some problems of JAVAEE,, every brother please give me the answer, I really was crying

Next:NGINX configuration problem, ask for help

Tags：

HTML (CSS)

Links：
CodePudding