MiladParvane
جمعه 11 بهمن 1392, 11:26 صبح
کد اچ تی ام ال با ای اس پی دات نت ام وی سی
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width" />
<link href="~/Content/Site.css" rel="stylesheet" />
</head>
<body>
<div id="wraper">
<header id="header">
<div id="logo"><h1><a href="#">بنگاه خبری و تحلیلی</a></h1>
</div>
<div id="Search">
<input class="TxtSearch" type="search" placeholder="جستجو ..." />
<img src="~/Content/Images/search.png" />
</div>
<nav id="menu">
<ul>
<li><a href="@Url.Action("Index","Home")">صفحه نخست</a>
</li>
<li><a id="news">گروه خبر</a>
@Html.Action("Branch")
</li>
<li>
@Html.ActionLink("درباره ما","AboutUs")
</li>
<li>@Html.ActionLink("ارتباط با ما","ContactUs")</li>
</ul>
</nav>
</header>
<div id="Container">
@RenderBody()
</div>
<aside id="aside">
</aside>
</div>
</body>
<script src="~/Scripts/jquery-1.7.1.min.js"></script>
<script src="~/sliderengine/amazingslider.js"></script>
<script src="~/sliderengine/initslider-1.js"></script>
<script src="~/sliderengine/jquery.js"></script>
<script src="~/Content/Site.js"></script>
</html>
کد css
body {
margin:0px;
padding:0px;
background-color:whitesmoke;
}
#wraper {
background-color:whitesmoke;
direction:rtl;
width:980px;
margin:auto;
margin-top:15px;
}
#header {
height:250px;
width:980px;
float:right;
background-image:url('Images/Header.jpg');
}
#logo {
width: 300px;
height: 70px;
float: right;
}
#logo h1 {
margin-right:30px;
margin-top:70px;
color:whitesmoke;
}
#logo h1 a {
text-decoration:none;
color:whitesmoke;
}
#menu {
width: 980px;
height: 35px;
float: right;
background-color: black;
color: white;
margin-top:145px;
}
#menu ul {
margin: 0px;
padding: 0px;
}
#menu ul li {
text-align:center;
float: right;
list-style: none;
font-family:tahoma;
font-size: 8pt;
cursor: pointer;
height: 25px;
width: 100px;
padding-top:10px;
}
#menu ul li a
{
display:block;
height:25px;
text-decoration:none;
color:white;
}
#menu ul li:hover {
background-color:darkred;
}
#NewsGroup {
background-image:url('../Content/Images/BackGround.png');
position:absolute;
z-index:2;
}
#NewsGroup a
{
height:15px;
text-decoration:none;
display:block;
text-align:center;
padding-left:10px;
padding-right:10px;
color:black;
}
#NewsGroup a:hover
{
color:#646161;
}
#NewsGroup ul li:hover
{
background-color:gold;
}
#NewsGroup ul li
{
margin:0px;
float:none;
display:block;
}
#Search {
width:240px;
height:27px;
float:left;
margin-left:30px;
margin-top:42px;
background-color:white;
border-style:solid;
border-width:1px;
border-color:white;
border-radius:5px;
}
#Search img {
float:left;
cursor:pointer;
margin-left:3px;
margin-top:2px;
}
.TxtSearch {
height:27px;
width:208px;
border-style:none;
}
#PorBazdidTarin
{
width:490px;
height:297px;
float:right;
}
#PorBazdidTarin a:hover
{
background-color:#363178;
border-radius:5px;
color:white;
opacity:1;
padding-right:15px;
}
#Title_PorBazdidTarin h1
{
margin-right:50px;
color:#696969;
}
.NewsTitleFor30Days
{
text-decoration: none;
font-family: Tahoma;
font-size: 9pt;
color: black;
}
#Title_PorBazdidTarin
{
width:450px;
height:35px;
float:right;
}
#Links
{
width:480px;
height:232px;
margin-top:60px;
overflow:auto;
text-align:right;
z-index:1;
}
#Links a
{
cursor:pointer;
color:darkblue;
font-family:Tahoma;
text-decoration:none;
font-size:10pt;
opacity:.9;
padding-top:5px;
padding-bottom:5px;
padding-left:15px;
display:block;
}
#Links ul li
{
list-style:none;
margin-right:0px;
line-height:25px;
display:block;
}
#Links ul li a:hover
{
color:#c1c0c0;
}
#Section1
{
width:480px;
border-radius:5px;
border-color:#d8d8d8;
border-style:solid;
border-width:2px;
}
#AboutUs
{
height:400px;
width:980px;
float:right;
}
#AboutUs p
{
margin-top:20px;
margin-right:30px;
font-family:Arial;
font-size:11pt;
}
#ContactUs
{
height:400px;
width:980px;
float:right;
}
#ContactUs p
{
margin-top: 20px;
margin-right: 30px;
font-family: Arial;
font-size: 11pt;
}
#aside
{
position:fixed;
width:300px;
margin-top:230px;
border-color:#d8d8d8;
border-style:solid;
border-width:2px;
border-radius:5px;
background-color:green;
height:100px;
}