Jump to content
Sign in to follow this  
Ionuţ Butnaru

Pagină Html - Ie .png

Recommended Posts

De la CSS.

Trebuie sa codezi divul respectiv si pentru IE. Nu iti pot da niste exemple concrete daca nu am sursa ta, in schimb cauta si tu tutoriale de codare pentru IE in CSS.

Share this post


Link to post
Share on other sites

Daca versiunea de IE de care vorbesti este IE 6 (nu "suporta" PNG-uri cu fundal transparent), atunci iti sugerez sa nu iti bati capul. Asa cum am spus si in paranteza, eroarea despre care este vorba in pagina ta provine de la transparenta fundalurilor imaginilor PNG pe care browserul mega-invechit nu le suporta/afiseaza corect. Rezolvarea ar fi ori upgradarea browser-ului, ori transformarea imaginilor PNG in GIF-uri cu fundal transparent (insa se va pierde din claritate).

Share this post


Link to post
Share on other sites

Poate gasesti ceva util despre html aici sau despre css aici.

La codare iti recomand sa folosesti html si un fisier css extern. De ce? Este mult mai clean, ceva mai organizat structurat si poti gasi erorile ceva mai usor si tot odata iti recomand sa folosesti un editor special gen notepad++, notepad-ul din windows este prea prost deoarece nu-ti evidentiaza codul si linile de cod.

Gaby ti-a zis mai devreme raspunsul

eroarea despre care este vorba in pagina ta provine de la transparenta fundalurilor imaginilor PNG pe care browserul mega-invechit nu le suporta/afiseaza corect

Share this post


Link to post
Share on other sites

Aici e o parte din pagină.


</head>

<body bgColor="#F4F4F4">

<div id="container">

<div id="image1" style="position:absolute; overflow:hidden; left:0px; top:0px; width:1024px; height:800px; z-index:0"><img src="images/background.png" alt="" title="" border=0 width=1024 height=800></div>


<div id="image2" style="position:absolute; overflow:hidden; left:0px; top:0px; width:1024px; height:75px; z-index:1"><img src="images/up-bar.png" alt="" title="" border=0 width=1024 height=75></div>


<div id="image3" style="position:absolute; overflow:hidden; left:20px; top:0px; width:58px; height:64px; z-index:2"><img src="images/logo.png" alt="" title="" border=0 width=58 height=64></div>


<div id="text1" style="position:absolute; overflow:hidden; left:80px; top:0px; width:159px; height:38px; z-index:3">

<div class="">

<div><font color="#339966" face="Aller Light" class="em28">EMUS</font><font color="#3366FF" face="Aller Light" class="em28">PTC</font></div>

</div></div>


<div id="text2" style="position:absolute; overflow:hidden; left:80px; top:40px; width:231px; height:20px; z-index:4">

<div class="emus">

<div><font face="Verdana">you can start your business today</font></div>

</div></div>


<div id="image4" style="position:absolute; overflow:hidden; left:38px; top:282px; width:956px; height:351px; z-index:5"><img src="images/midle-conten.png" alt="" title="" border=0 width=956 height=351></div>


<div id="image5" style="position:absolute; overflow:hidden; left:38px; top:633px; width:955px; height:168px; z-index:6"><img src="images/footer-bar.png" alt="" title="" border=0 width=955 height=168></div>


<div id="image6" style="position:absolute; overflow:hidden; left:20px; top:79px; width:127px; height:337px; z-index:7"><img src="images/men.png" alt="" title="" border=0 width=127 height=337></div>


<div id="image7" style="position:absolute; overflow:hidden; left:472px; top:241px; width:522px; height:40px; z-index:8"><img src="images/menu-bar.png" alt="" title="" border=0 width=522 height=40></div>


<div id="image8" style="position:absolute; overflow:hidden; left:680px; top:292px; width:304px; height:178px; z-index:9"><img src="images/domain-check.png" alt="" title="" border=0 width=304 height=178></div>


<div id="image9" style="position:absolute; overflow:hidden; left:682px; top:470px; width:301px; height:86px; z-index:10"><img src="images/domain-available-or-not.png" alt="" title="" border=0 width=301 height=86></div>


<div id="image10" style="position:absolute; overflow:hidden; left:636px; top:159px; width:167px; height:57px; z-index:11"><a href="#"><img src="images/view-demo-pink.png" alt="" title="" border=0 width=167 height=57></a></div>


<div id="image11" style="position:absolute; overflow:hidden; left:826px; top:159px; width:167px; height:57px; z-index:12"><a href="#"><img src="images/view-demo-green.png" alt="" title="" border=0 width=167 height=57></a></div>


<div id="text3" style="position:absolute; overflow:hidden; left:660px; top:142px; width:119px; height:20px; z-index:13">

<div class="emus">

<div><font color="#FFFFFF" face="Aller Light" class="em11">ADMINISTRATION</font></div>

</div></div>


<div id="text4" style="position:absolute; overflow:hidden; left:871px; top:142px; width:80px; height:20px; z-index:14">

<div class="emus">

<div><font color="#FFFFFF" face="Aller Light" class="em11">FRONT SITE</font></div>

</div></div>

@alex008 nu vreau să încep ceva ce nu merită, însă ceea ce mi-ai spus tu, nu are nici un rost cu întrebarea adresată de mine.

@gaby voi încerca să fac un update, să vedem.

Share this post


Link to post
Share on other sites

@alex008 nu vreau să încep ceva ce nu merită, însă ceea ce mi-ai spus tu, nu are nici un rost cu întrebarea adresată de mine.

Asa e,

dar pe linkurile alea facute cu maro sunt 2 tutoriale in care ma gandesc ca poate gasesti solutia dar si daca nu gasesti solutia problemei, ma gandesc ca te vor ajuta pe viitor...

dar ai dreptate

si daca imi mai permiti o mica observatie

folosirea in exces a divurilor duce la incarcarea mai greoaie a paginii daca nu gresesc

Share this post


Link to post
Share on other sites

Pagina nu are css, e codată simplu în HTML fără CSS.

Dupa ce ai postat ceva din continutul paginii, te-as contrazice. De exemplu:

style="position:absolute; overflow:hidden; left:38px; top:282px; width:956px; height:351px; z-index:5"

este CSS.

Share this post


Link to post
Share on other sites

Hai ca incerc sa te lamuresc eu.

In header-ul paginii tale .html trebuie sa introduci urmatorul cod:

<link rel="stylesheet" type="text/css" href="style.css" />
Apoi creezi un fisier style.css, langa fisierul tau .html . Deschizi fisierul style.css cu NOTEPAD++. In acest fisier trebuie sa declari toate formaturile de pe pagina .html. De exemplu aici modifici cati px. sa fie lasati atunci cand scrii: <p>Pc-Troubleshooting</p>. Ca sa-ti faci o idee cum arata un fisier .css uitate aici:

Sper ca te-am mai lamurit... :pct2:

 {

	margin: 0;

	padding: 0;

}


a {

	text-decoration: underline;

	color: #CC7F5C;

}


a:hover {

	text-decoration: none;

}


body {

	background: #0C1114 url(images/img01.jpg) no-repeat top center;

	color: #8EA2AD;

	line-height: 1.75em;

	font-size: 12pt;

}


body,input {

	font-family: "Trebuchet MS", sans-serif;

}


br.clearfix {

	clear: both;

}


strong {

	color: #CEE2ED;

}


h1,h2,h3,h4 {

	font-weight: normal;

	text-transform: lowercase;

}


h2 {

	font-size: 1.5em;

}


h2,h3,h4 {

	color: #FFFFFF;

	margin-bottom: 1em;

	font-family: Oswald, sans-serif;

	text-shadow: 0px 1px 1px #0C1114;

}


h3 {

	font-size: 1.25em;

}


h4 {

	font-size: 1em;

}


img.alignleft {

	margin: 5px 20px 20px 0;

	float: left;

}


img.aligntop {

	margin: 5px 0 20px 0;

}


p {

	margin-bottom: 1.5em;

}


ul {

	margin-bottom: 1.5em;

}


ul h4 {

	margin-bottom: 0.35em;

}


#content {

	float: left;

	padding: 0;

	width: 675px;

}


#footer {

	text-align: center;

	background: #090C0E;

	width: 860px;

	padding: 20px;

	margin: 0 auto 150px auto;

	border-bottom: solid 1px #16232D;

	border-top: solid 1px #000000;

	color: #313C44;

}


#footer a {

	color: #313C44;

}


#header {

	position: relative;

	padding: 40px;

	height: 90px;

}


#logo {

	top: 75px;

	position: absolute;

	left: 40px;

}


#logo a {

	text-decoration: none;

	color: #FFFFFF;

}


#logo h1 {

	font-size: 3.5em;

	font-family: Oswald, sans-serif;

	text-shadow: 0px 2px 2px #0C1114;

	margin: 0 0 0.25em 0;

}


#logo h2 {

	margin: 0;

	padding: 0;

	white-space: nowrap;

	font-size: 1.0em;

	color: #8EA2AD;

}


#menu {

	font-family: Oswald, sans-serif;

	position: absolute;

	background: #BD704D url(images/img02.gif) repeat-x top left;

	right: 40px;

	line-height: 60px;

	border-top: solid 1px #F9AC89;

	top: 77px;

	height: 60px;

	border-bottom: solid 1px #B36643;

}


#menu a {

	color: #FFFFFF;

	text-decoration: none;

	text-transform: lowercase;

	font-size: 1.25em;

	text-shadow: 0px 1px 1px #854022;

}


#menu ul {

	padding: 0 20px 0 20px;

	list-style: none;

}


#menu ul li {

	display: inline;

	padding: 0 15px 0 15px;

}


#page {

	position: relative;

	margin: 0 0 0 0;

	padding: 40px 40px 0 40px;

	width: 900px;

}


#page .section-list {

	list-style: none;

	padding-left: 0;

}


#page .section-list li {

	padding: 25px 0 25px 0;

	clear: both;

}


#page ul {

	list-style: none;

}


#page ul li {

	padding: 15px 0 15px 0;

	border-top: solid 1px #16232D;

	border-bottom: solid 1px #000000;

}


#page ul li.first {

	padding-top: 0;

	border-top: 0;

}


#page ul li.last {

	border-bottom: 0;

}


#post1 {

	margin: 0 0 25px 0;

	overflow: hidden;

	width: 675px;

}


#post2 {

	float: left;

	overflow: hidden;

	width: 325px;

}


#post3 {

	margin: 0 0 0 350px;

	overflow: hidden;

	width: 325px;

}


#search input.form-submit {

	color: #FFFFFF;

	font-family: Oswald, sans-serif;

	padding: 5px;

	margin-left: 1em;

	background: #CC7F5C;

	border: 0;

}


#search input.form-text {

	padding: 10px;

	border: dotted 1px #26333D;

}


#sidebar {

	padding: 0;

	width: 200px;

	margin: 0 0 0 700px;

}


#wrapper {

	width: 980px;

	margin: 80px auto 0 auto;

	position: relative;

}

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
Sign in to follow this  

  • Recently Browsing   0 members

    No registered users viewing this page.

×