Úprava CSS - zmizení výseků původního backgroundu z hlavičky webu – CSS – Fórum – Programujte.com
 x   TIP: Přetáhni ikonu na hlavní panel pro připnutí webu

Úprava CSS - zmizení výseků původního backgroundu z hlavičky webu – CSS – Fórum – Programujte.comÚprava CSS - zmizení výseků původního backgroundu z hlavičky webu – CSS – Fórum – Programujte.com

 

lindushyk
~ Anonymní uživatel
2 příspěvky
4. 10. 2016   #1
-
0
-

Dobrý den,
chtěla bych se zeptat, co mám v CSS šablony "vymazat", aby mi zmizely výseče původního pozadí z rohů obrázku v hlaviččce? Přikládám print screen ... Původní soubor s pozadím jsem již vymazala, ale stále se mi v obrázku výseče pozadí zobrazují ... Pokud pomůže "zarovnání" obrázku zobrazením do hranatého obyč obdélníku (bez zaoblených rohů), nemám s tím problém. Web běží na Websnadno, kde je zvolena daná šablona a zobrazení obrázku v hlavičce součástí šablony - lze tvar zobrazení obrázku v hlavičce nějak obejít?

Vkládám kompletní CSS šablony:

html, body {margin: 0; padding: 0;} 
body {font-family: <%css_font%>;color: #<%css_colortext%>;text-align: center;
 font-size: 14px;
 background: #151515 url(<%css_dir%>/bg.jpg);
         background-attachment: fixed;
}
.ie6 body {color: #000;}
h1 {
 font-size: 30px;  
 font-weight: 400;
}
h2 {
 font-size: 24px;
 color: #000;
 font-weight: 400;
 text-shadow: 1px 1px 0px #888;
}
h3, h4, h5, h6 {
 color: #000;
 font-weight: 400;
 text-shadow: 1px 1px 0px #888;
}
h3 {font-size: 20px;}
h4 {font-size: 18px;}
h5 {font-size: 16px;}
h6 {font-size: 14px;}
a {
 color: #fff;
 text-decoration: underline;
}
.ie6 a {
 color: #000;
}
a:hover {text-decoration: none;}
hr {display: block;position: relative;padding: 0;margin: 6px auto; height: 2px;max-height: 0;border: none;width: 100%;clear: both;font-size: 1px;line-height: 0; /*NEMENIT*/
 border-top: 1px solid #444;
}
input[type="text"], textarea {
 background-color: #fff;
 color: #222;
 border: 1px solid #444;
}
input[type="submit"], input[type="button"], .diskuzeram {
 background-color: #444;
 color: #fff;
 border: 1px solid #000;
 font-weight: 700;
 font-size: 13px;
}
input[type="submit"]:hover, input[type="button"]:hover {
 background-color: #000;
 color: #fff;
}
fieldset {
 border: 1px solid #444;
}
legend {color: #<%css_colortext%>;}
p, div, span, img, ul, li, strong, em, form, select {}
/*
=============================================
-----------------  CSS START  ---------------
=============================================                                                                                           
*/
.wrap {margin: 0 auto; text-align: left; width: 960px; padding: 0;}
.clear {clear: both !important; height: 0px !important; line-height: 0px !important; font-size: 0px !important; overflow: hidden !important; display: block !important; margin: 0 !important; float: none !important; padding: 0 !important; background: none !important; border:0 !important;}               
#contenttitle h2 {line-height: 30px; padding: 0; margin: 0;}
.bg_content {overflow:hidden;}
/* =====  JUSTIFICATION  ===== */
.floatLeft {float:left;}
.floatRight {float:right;}
.floatNone {float:none;}
.alignLeft {text-align:left;}
.alignRight {text-align:right;}
.alignCenter {text-align:center;}
/*
=============================================
------------------  HEADER  -----------------
=============================================
*/
#header {position: relative; padding: 20px 0 0; z-index: 1;} 
#header .wrap {background: transparent url('<%css_dir%>') 0 0 repeat;} 
/* =====  Image  ===== */
#header #image {padding: 20px 0px 20px 22px; position: relative; min-height: 220px;}
#header #image img {display: block;}
/* =====  Title  ===== */   
#header #top {position: absolute; top: 70px; left: 23px; max-width: 915px;}
#header #top h1 {line-height: 1.4; padding: 8px 8px; margin: 0; color: #<%css_logotextcolor%>; font-size: 30px; font-weight: 400; background: transparent url('<%css_dir%>/bl70.png') 0 0 repeat;}
/* =====  MENI  ===== */ 
#menu {padding: 0; margin: 0;} 
#menu .wrap {padding: 4px 0 10px; background: transparent url('<%css_dir%>/bg20.png') 0 0 repeat;} 
#menu ul {list-style-type: none; padding: 5px; margin: 0; font-size: 15px;position: relative; z-index: 3;} 
#menu ul li {float:left; display: block; width: 148px; padding: 6px 5px 6px; margin: 0; position: relative;}
#menu ul li a {color: #fff; text-shadow: 1px 1px 1px #535353; line-height: 1.4; text-decoration: none; display: block; text-align: center; padding: 1px; background: #404040; border: 1px solid #252525;}
#menu ul li a span {display: block; background: #252525;  padding: 4px 4px;}
#menu ul li a:hover, #menu ul li a#menu_main_selected {background: #b9b9b9; color: #fff; text-shadow: none;}
#menu ul li a:hover span, #menu ul li a#menu_main_selected span {background: #8f8f8f;}
#menu ul ul {display: none; position: absolute; overflow: hidden; background: #1f1f1f; width: 148px; z-index: 3; top: 38px; left: 5px; padding: 0;}
#menu ul ul li {width:100%; display: block; float: none; border-bottom: 1px solid #979797;  padding: 0; background: none;}
#menu ul ul li:first-child{padding:0;}
#menu ul ul li a {display: block; padding: 6px 8px; color: #fff; text-shadow: none; text-align: left; background: none;}
#menu ul ul li a span, #menu ul ul li a:hover span, #menu ul ul li a#menu_sub_selected span {padding: 0; background: none;}
#menu ul ul li a:hover, #menu ul ul li a#menu_sub_selected {background: #444; color: #fff;}
/*
=============================================
-----------------  CONTENT  -----------------
=============================================
*/
#contenttitle {margin: 15px 0;}
#content {position: relative; z-index: 1;line-height: <%css_lineheight%>; font-size: 14px; padding: 0;}
#content .wrap {background: transparent url('<%css_dir%>/bg40.png') 0 0 repeat;} 
#content .bg_content {padding: 5px 25px;} 
#content .contentDown {color: #fbfbfb; font-style: italic;font-size: 12px; line-height: 1.6; padding: 40px 25px 10px;}
/*
=============================================
-----------------  WIDGETS  -----------------
=============================================
*/
#widgets {}
#widgets .wrap {padding: 16px 0; background: transparent url('<%css_dir%>/bg20.png') 0 0 repeat;} 
#widgets .widget_area {display: inline-block; vertical-align: top;*display:inline;zoom:1; margin: 10px 10px; padding: 10px 10px 15px; width: 200px; color: #fbfbfb;}
.ie6 #widgets .widget_area {color: #000;}
#widgets .widget_title {font-size: 18px; line-height: 20px; color: #fff; text-shadow: 1px 1px 0px #888; padding: 0 0 8px 4px; text-align: left;} 
.ie6 #widgets .widget_title {color: #000;}
#widgets .widget_area a {color: #fff; text-decoration: underline;}
.ie6 #widgets .widget_area a {color: #000;}
#widgets .widget_area a:hover {text-decoration: none;}

.widget ul.widget_sekce {padding: 0; margin: 0; width: 200px;}
.widget ul.widget_sekce li {list-style-type: none; margin: 0;}
.widget ul.widget_sekce li a {display: block; line-height: 18px; padding: 5px 0px 5px 15px; text-decoration: none;}
.widget div.widget_nadpis {color: #fff; display: block; line-height: 20px; text-shadow: 1px 1px 0px #888; padding: 0 0 8px 4px; margin: 0; font-size: 18px; font-weight: 500; text-decoration: none;}
.ie6 .widget div.widget_nadpis {color: #000;}
/*
=============================================
-----------------  FOOTER  -----------------
=============================================
*/
#footer {padding: 0; line-height: 30px; color: #fbfbfb;}
#footer .wrap {padding: 8px 0 7px; background: transparent url('<%css_dir%>/footer.png') 0 0 repeat; position: static;} 
#footer a {color: #fbfbfb; text-decoration: underline;} 
#footer a:hover {text-decoration: none;}   
#footer .floatLeft {padding: 0 0 0 16px;}
#footer .floatRight {font-size: 13px; padding: 6px 16px 0 0;}
#footer .floatRight a {color: #fbfbfb; text-decoration: none;}
#footer .floatRight a:hover {text-decoration: none;}
#footer .floatRight a:hover span {text-decoration: underline;}
#footer .floatRight div {float:left; padding-left: 12px;}
#footer .floatRight a span {padding-left: 4px;}
#footer .floatRight a img {border: none !important;}

Připojen obrázek.

Nahlásit jako SPAM
IP: 193.23.124.–
4. 10. 2016   #2
-
0
-

#1 lindushyk
Budu moc ráda za radu ...

Nahlásit jako SPAM
IP: 193.23.124.–
peter
~ Anonymní uživatel
4014 příspěvků
5. 10. 2016   #3
-
0
-

Mne osobne se vic libil jiny blog. Tam slo menit js, css a mam pocit i html sablony. Nevim uz link. Tes to bylo neco jako snadny web nebo jednoduchy nebo uplne jinak :)

Tezko rici, bez konkretniho html kodu. Ve FF pouzivam Web-developer toolbar, s tim se da vybrat konkretni prvek a jeho detaily. Nemusi se pak vetsinou studovat tuny css.

background: transparent url('<%css_dir%>/bl70.png') 0 0 repeat;
- barva je transparent, takze tady je to nejspis spravne

#header .wrap {background: transparent url('<%css_dir%>') 0 0 repeat;} - kdo vi, co dela tohle, ale je tam tez obrazek

Podle rohu v tom screenshoot je tam ale nejake obrazkove pozadi. Mohlo by to byt z jineho css? Jakoze, nekdy se delaji 2 css, kdy jedno dela layout a druhe obarveni. Pak je treba to bud tam opravit nebo prebit. Zkusil bych se zbavit nejdriv vsechno obrazku a barev 

#header,
#header .wrap,
#header #image,
#header #image img,
#header #top,
#header #top h1 {
background-color: transparent !important;
background-image: none !important;
/* nebo */
background-color: #f00;
background-image: url('https://www.jakpsatweb.cz/images/jakpw.png') !important;
}

/*nebo*/
#header, #header div, #header img, #header h1
{...}
Nahlásit jako SPAM
IP: 2001:718:2601:26c:d0b1:ef...–
Zjistit počet nových příspěvků

Přidej příspěvek

Toto téma je starší jak čtvrt roku – přidej svůj příspěvek jen tehdy, máš-li k tématu opravdu co říct!

Ano, opravdu chci reagovat → zobrazí formulář pro přidání příspěvku

×Vložení zdrojáku

×Vložení obrázku

Vložit URL obrázku Vybrat obrázek na disku
Vlož URL adresu obrázku:
Klikni a vyber obrázek z počítače:

×Vložení videa

Aktuálně jsou podporována videa ze serverů YouTube, Vimeo a Dailymotion.
×
 
Podporujeme Gravatara.
Zadej URL adresu Avatara (40 x 40 px) nebo emailovou adresu pro použití Gravatara.
Email nikam neukládáme, po získání Gravatara je zahozen.
-
Pravidla pro psaní příspěvků, používej diakritiku. ENTER pro nový odstavec, SHIFT + ENTER pro nový řádek.
Sledovat nové příspěvky (pouze pro přihlášené)
Sleduj vlákno a v případě přidání nového příspěvku o tom budeš vědět mezi prvními.
Reaguješ na příspěvek:

Uživatelé prohlížející si toto vlákno

Uživatelé on-line: 0 registrovaných, 4 hosté

Podobná vlákna

Ůprava webu z 5,3 na 5,6 — založil Grecky

Úprava webu z 5,3 na 5,6 — založil Grecky

 

Hostujeme u Českého hostingu       ISSN 1801-1586       ⇡ Nahoru Webtea.cz logo © 20032024 Programujte.com
Zasadilo a pěstuje Webtea.cz, šéfredaktor Lukáš Churý