0
9 پاسخ
2
سلام دوست عزیز
شما یه همچین چیزی مد نظرتونه ؟
Code
footer / aside / article / header / nav
همه اینایی که گفتم در این تصویر اورده شده ؟
0
0
0
سلام
عکسی که فرستادید خیلی گویا نیست ؟ راستش من هنوز دقیقا نفهمیدم شما چه کاری می خواهید انجام دهید ؟
در تصویری که فرستادید بالای header که نواری قرار ندارد .
کلا ترتیب این اشیا ذر ساختار HTML5 به صورت زیر است :
- header
- nav
- aside
- article
- footer
1
سلام فکرکنم شما یه همچین چیزی می خواستید ؟ درسته ؟
1
اگه بخواهید اون ایکون رو استفاده کنید باید یه سری فایل به پروژه اضافه کنید تا اون ایکون رو بتواند نشان دهد .
کد css هم دارد که الان حضور ذهن ندارم ولی اگه پیداش کردم برای شما می فرستمش .
Itpro باشید
1
ممنونم آقای ورز شی من نمیدونستم اسمِ اون نوار aside هست. لطفا نگاهی به فایلِ پیوست بندازین. من همه قسمتاشو انجام دادم بجز اون نوار بالای header می‌شه لطفا کمکم کنین؟ ممنونم.
Code
<!DOCTYPE html>
<html>
<head>
<meta charset="ISO-8859-1">
<title>My Website</title>
<style type="text/css">
body
{
font-family:Verdana;
font-size: 12px;
}
.header
{
background-color:red;
position:absolute;
text-align:center;
right:20px;
left:240px;
top:20px;
height:20px;
}
.footer
{
background-color:pink;
}
.navigations
{
background-color:blue;
height:300px;
width:200px;
left:20px;
margin-top:50px;
}
.content
{
position:absolute;
text-align:center;
overflow:auto;
min-height:300px;
max-height:500px;
padding:10px;
top:50px;
right:20px;
left:240px;
background-color:grey;
}
.footer
{
position:absolute;
background-color:red;
text-align:center;
right:20px;
left:240px;
height:20px;
margin-top:20px;
}
</style>
</head>
<body>
<header class="header">
<p>header</p>
</header>
<nav class="navigations">
<p>Navigation</p>
</nav>
<div class="content">
<p>Main</p>
</div>
<footer class ="footer">
<p>footer</p>
</footer>
</body>
</html>
2
Code
<htm>
<!DOCTYPE html>
<html>
<head>
<title> </title>
<style>
* {
padding:0;
margin:0;
border:0;
}
body {
direction:rtl;
}
#main {
width: 80%;
height: auto;
border: 4px solid black;
margin: auto;
margin-top:30px;
background-color:silver;
position:relative;
}
#search_box {
width:14%;
height:30px;
border:2px solid black;
right:0;
margin:20px;
font-size:22px;
text-align:left;
border-radius:20px;
background-color:white;
position:absolute;
}
#addres_bar {
width:65%;
height: 30px;
border: 2px solid black;
left: 0;
margin-top: 20px;
margin-bottom:20px;
margin-left:50px;
font-size: 22px;
text-align: left;
border-radius: 20px;
background-color: white;
position: absolute;
}
#cover_1 {
width:99.8%;
height:700px;
background-color:white;
margin-bottom:35px;
margin-top:70px;
border:2px solid black;
position:relative;
}
header {
width: 90%;
height: auto;
position: absolute;
border: 2px solid black;
margin-bottom: 10px;
margin-top: 20px;
border-radius:20px;
margin-right:50px;
background-color: white;
text-align: center;
color: black;
font-size: 23px;
}
article {
width: 90%;
height:77%;
border: 2px solid black;
margin: auto;
border-radius: 20px;
position: absolute;
margin-right: 50px;
background-color: white;
text-align: center;
color: black;
font-size: 23px;
margin-top:65px;
}
footer {
width: 90%;
height: auto;
border: 2px solid black;
margin: auto;
border-radius:20px;
bottom: 0;
margin-bottom:30px;
margin-right:50px;
position:absolute;
background-color:white;
text-align:center;
color:black;
font-size:23px;
}
</style>
</head>
<body>
<div id="main">
<div id="search_box"> </div>
<div id="addres_bar"> </div>
<div id="cover_1">
<header> header </header>
<article> body </article>
<footer> footer </footer>
</div>
</div>
</body>
</html>
<htm>
1