Obsah fóra
PravidláRegistrovaťPrihlásenie




Odpovedať na tému [ Príspevkov: 5 ] 
AutorSpráva
Offline

Užívateľ
Užívateľ
pouzitie viacerych css suborov naraz

Registrovaný: 27.09.07
Prihlásený: 31.12.15
Príspevky: 646
Témy: 233
Bydlisko: Dubnica nad...
Príspevok NapísalOffline : 11.09.2012 11:28

Chcem sa spytat ci mate niekdo skusenosti s pouzitim viacerych css suborov naraz... Na akom principe to funguje?

napriklad: v hornej casti stranky chcem pouzivat css pre obrazok s ramcek a v spodnej chcem pouzivat css pre obrazok bez ramceka....







_________________
Notebook: ASUS N750JV: Windows 8.1 64bit, Intel(R) Core(TM) i7-4700HQ CPU 2.40 GHz, 12GB RAM (DDR3 1600 MHz), NVIDIA GeForce GT 750M 4GB VRAM + HD Graphics 4600, 750 GB HDD (7200 rpm), Blu-ray Reader.
Smartphone: Samsung Galaxy S5 mini
Offline

Užívateľ
Užívateľ
pouzitie viacerych css suborov naraz

Registrovaný: 26.12.06
Prihlásený: 16.11.19
Príspevky: 3971
Témy: 181
Bydlisko: Nitra / Bra...
Príspevok NapísalOffline : 11.09.2012 11:29

na to nepotrebujes dva subory, staci obrazkom pridelit class resp. id







_________________
Sorry za prelkepy
Offline

Užívateľ
Užívateľ
pouzitie viacerych css suborov naraz

Registrovaný: 27.09.07
Prihlásený: 31.12.15
Príspevky: 646
Témy: 233
Bydlisko: Dubnica nad...
Príspevok Napísal autor témyOffline : 11.09.2012 11:34

no ja som to uviedol len ako priklad... ale budem konktetny teda:

style.css
Kód:
@CHARSET "UTF-8";

html, body, div, h1, h2, h3, h4, h5, h6, ul, ol, p, form, fieldset, table, th, td, input, textarea, a {
   margin: 0;
   padding: 0;
   font: 14px/1.2em Arial, serif;
   color: #000; /*6a6a6a*/
}

body {
}

a {
   text-decoration: none;
   color: blue;
}
a img {
   border: none;
}
hr {
   display: block;
   width: 570px; /*880*/
   margin: 0 auto;
   height: 1px;
   border: none;
   border-top: 1px dotted #cacaca;
}

#page {
   width: 980px;
   margin: 0 auto;
}

/* Easy JQ Slider */

#slider {
   position: relative;
   width: 570px; /*880*/
   height: 262px;
   overflow: hidden;
   margin: 60px 50px 40px 50px;
}
#slider #controls a {
   margin: 0 5px;
   display: block;
   width: 19px;
   height: 16px;
   float: left;
   background: url(../images/slider-control.png);
}
#slider #controls a.active {
   background-position: 0 -16px;
}
#slider #controls {
   position: absolute;
   z-index: 9998;
   bottom: 0;
   display: block;
   margin-left: -40px;
}
#slider h2 {  /* nadpis */
   text-decoration: none;
   color: #336699;
   font: 22px/2em Georgia, serif;
   margin-bottom: 10px;
}
#slider li {
   list-style: none;
   display: block;
   height: 262px;
   overflow: hidden;
}
#slider li > a {
   display: block;
   float: left;
   width: 50%;
}
#slider li > img.left-image-slider {
   height: 220px;  /*vyska*/  /*220 po vyrieseni medzery upravit velkost....*/
   width: 330px;   /*dlzka*/ /*pridane mnou*/
}
#slider li > div {
   float: right;
   width: 40%; /*48 percentualna velkost textu voci celemu rozmeru*/
   margin-right: 1%; /*lavy okraj textu*/
}
#slider li > div p { /* text, obsah clanku */
   font: 12px/1.5em Arial, serif;
   line-height: 1.8em;
}

/* CSS3 Button - tlacitko citaj dalej....*/

.coolbtn {
    background: #336699; /*FF9E01 - zakladny podklad */
   padding: 6px 10px 6px 10px;
   color: #fff;
   border: none;
   margin: 15px 10px 15px 0;
   font-size: 14px;
}
.coolbtn:hover {
    background: #cccccc; /*FFBB4D - podklad po nabehnuti mysi */
   color: #000;
}
.coolbtn:active  {
    background: #cccccc;
}

/* Common CSS styles */

.clear {
   display: block;
   height: 0;
   line-height: 0;
   font-size: 0;
   clear: both;
}

/* Extra Styles */

.createdby {
    text-align: center;
   margin-top: 50px;
   font-weight: bold;
}
.createdby a{
   font-weight: bold;
   text-decoration: underline;
}


index.css
Kód:
body {
   margin: 0 auto;
   padding: 0;
   font: 76% Verdana, Tahoma, Arial, sans-serif;
   background: #f4f4f4 url(images/bg.gif) top center repeat-y;
}
#googlereklama {
   position: absolute;
   top: 15px;
   left: 880px;
}

#paypal {
   font-size: 12px;
   line-height: 1.6em;   
}
#anketatabulka {
   font-size: 12px;   
}

#logopozadie {
   top: 0px;
   left: 0px;
  background: #336699;
  width: 860px;
  height: 120px;
}


#logopozadiemedzera {
  top: 120px;
   left: 0px;
  background: #fff;
  width: 860px;
  height: 2px;
}

#nadpis {
   position: absolute;
  top: 77px;
   left: 233px;

  width: 626px;
  height: 42px; 
  display: inline;
  font-family: times new roman, times;
  font-size: 35px;
  font-weight: bold;
  color: #FFF;
  float: left;
}

#google {
   position: absolute;
  top: 70px;
   right: 37px;
}

#facebook {
   position: absolute;
  top: 95px;
   right: 5px;
}

#vedlaloga {
  position: absolute;
   top: 0px;
   right: 0px;
}

#googlebanner {
  position: absolute;
   top: 0px;
   right: 3px;
}

#social {
  position: absolute;
   top: 10px;
   right: 10px;
}

#bloger {
   position: absolute;
   top:  0px;
   left: 0px;
}




ul#odkazy {
  margin: 0;
  padding: 0;
  list-style: none;
  background: #FFF;
  width: 859px;
  height: 26px; 
}
ul#odkazy li {
  display: inline;
  font-family: "Arial", Helvetica, sans-serif;
  font-size: 13px;
  font-weight: bold;
  float: left;
  padding: 5px 10px; 
  margin-right: 2px;
}
ul#odkazy li a{
  color: #FFF;
  text-decoration: none;
}
ul#odkazy li a img{
  border: 0;
}
ul#odkazy li a:hover {
  text-decoration: underline;
}
ul#odkazy li.forum {
  background-color: #336699;
}
ul#odkazy li.foto {
  background-color: #336699;
}
ul#odkazy li.rozhovory {
  background-color: #336699;
}
ul#odkazy li.horskyvodcovia {
  background-color: #336699;
}
ul#odkazy li.vysokohorskechaty {
  background-color: #336699;
}
ul#odkazy li.info {
  background-color: #336699;
}
ul#odkazy li.print {
  padding:0;
  float: right;
}
ul#odkazy li.search {
  padding:0;
  float: right;
}

#wrap {
   position: relative;
  background: #ffffff;
   color: #303030;
   margin: 0 auto;
   width: 860px;
}
#header {
   clear: both;
   margin: 20px 0 0 0;
   padding: 0;
   height: 45px;
}
#header h1 {
   width: 400px;
   margin: 0 0 10px 0;
   float: left;
}
#header p {
   width: 500px;
   float: right;
   text-align: center;
   color: #a0a0a0;
   margin: 0 0 10px 0;
   font-size: 0.8em;
   line-height: 1.2em;
}
#frontphoto {
   margin: 0 0 10px 0;
   border: 0;
}
#avmenu {
   clear: left;
   float: left;
   width: 250px;
   margin: 0 0 10px 0;
   padding: 0;
   font-size: 0.9em;
}
#avmenu ul {
   list-style: none;
   width: 250px;
   margin: 0 0 20px 0;
   padding: 0;
   font-size: 1.1em;
}
#avmenu li {
   margin-bottom: 4px;
}
#avmenu li a {
   font-weight: bold;
   height: 20px;
   text-decoration: none;
   color: #505050;
   display: block;
   padding: 6px 0 0 10px;
   background: #f4f4f4;
   border-left: 4px solid #cccccc;
}
#avmenu li a:hover {
   background: #eaeaea;
   color: #286ea0;
   border-left: 4px solid #286ea0;
}
.announce {
   margin: 10px 0 10px 0;
   padding: 10px;
   width: 130px;
   color: #505050;
   background-color: #f4f4f4;
   line-height: 1.3em;
}
#extras {
   float: right;
   width: 100px;
   margin: 0 0 10px 0;
   padding: 0;
   font-size: 0.9em;
   line-height: 1.5em;
}
#extras p {
   margin: 0 0 1.5em 0;
}
#content {
   margin: 0 10px 20px 260px;
   border-left: 1px solid #f0f0f0;
   border-right: 1px solid #f0f0f0;
   padding: 0 10px 0 10px;
   line-height: 1.6em;
   text-align: left;
   min-height: 600px;
}
#content h2 {
   font-size: 1.5em;
   margin: 0 0 0.5em 0;
}

#content img {
   /*padding: 1px;*/
   display: inline;
   background: #cccccc;
   /*border: 4px solid #f0f0f0;*/
}
h3 {
   font-size: 1.3em;
   margin: 0 0 10px 0;
}
a {
   text-decoration: none;
   color: #286ea0;
}
a:hover {
   text-decoration: underline;
   color: #286ea0;
}
a img {
   border: 0;
}
#footer {
   clear: both;
   margin: 0 auto;
   padding: 1px 0 5px 0;
   /*padding: 10px 0 20px 0;*/
   /*border-top: 4px solid #f0f0f0;*/
   width: 860px;
   text-align: center;
   color: #808080;
   font-size: 0.9em;
}
#footer a {
   color: #808080;
   text-decoration: none;
}
#footer a:hover {
  color: #336699;
   text-decoration: none;
}
.left {
   margin: 10px 10px 5px 0;
   float: left;
}
.right {
   margin: 10px 0 5px 10px;
   float: right;
}
.textright {
   text-align: right;
}
.center {
   text-align: center;
}
.small {
   font-size: 0.8em;
}
.bold {
   font-weight: bold;
}
.hide {
   display: none;
}

/* Prezentacia
---------------------------------- */



/* Akcie a podujatia
---------------------------------- */

#vrchna-lista { font-family: Verdana; padding:2px 0;  width:570px; /*610*/ background:#cccccc/*336699*/; }
#jFlowSlide{ background:#f2f2f2; font-family: Verdana; }
#myController { font-family: Verdana; padding:2px 0;  width:570px; /*610*/ background:#cccccc; }
#myController span.jFlowSelected { background:#f2f2f2; margin-right:0px; color:#000000; } /*43A0D5*/

.slide-wrapper { padding: 5px; }
.slide-thumbnail { width:300px; float:left; }
.slide-thumbnail img {max-width:300px; }
.slide-details { width:250px; float:right; margin-left:10px;}
.slide-details h2 { font-size:1.5em; font-style: italic; font-weight:normal; line-height: 1; margin:0; }
.slide-details .description { margin-top:10px; }

.jFlowControl, .jFlowPrev, .jFlowNext { color:#000000; cursor:pointer; padding-left:5px; padding-right:5px; padding-top:2px; padding-bottom:2px; }
.jFlowControl:hover, .jFlowPrev:hover, .jFlowNext:hover { background: #f2f2f2; color:#000000; }


toto ked chcem zlucit do jedneho tak sa mi to zosype...







_________________
Notebook: ASUS N750JV: Windows 8.1 64bit, Intel(R) Core(TM) i7-4700HQ CPU 2.40 GHz, 12GB RAM (DDR3 1600 MHz), NVIDIA GeForce GT 750M 4GB VRAM + HD Graphics 4600, 750 GB HDD (7200 rpm), Blu-ray Reader.
Smartphone: Samsung Galaxy S5 mini
Offline

Užívateľ
Užívateľ
pouzitie viacerych css suborov naraz

Registrovaný: 26.12.06
Prihlásený: 16.11.19
Príspevky: 3971
Témy: 181
Bydlisko: Nitra / Bra...
Príspevok NapísalOffline : 11.09.2012 11:43

zalezi v akom poradi ich do stranky vkladas/importujes

ak mas subor styl1.css
Kód:
#stranka{color: red;}
p {color: green}

a dalsi subor styl2.css
Kód:
p{color: blue}

a vlozis ich zasebou
Kód:
<link rel="stylesheet" href="styl1.css" type="text/css" />
<link rel="stylesheet" href="styl2.css" type="text/css" />


je to ako keby si vlozil jeden subor styl.css s obsahom
Kód:
#stranka{color: red;}
p {color: green}
p {color: blue}


takze druhy subor ti prepise prvy subor, ak tam definujes rozlicne vlastnosti pre rovnake elementy.. tj, teraz bude farba textu v odstavci modra a nie zelena. ked ich vlozis v opacnom poradi, tak to bude opacne







_________________
Sorry za prelkepy
Offline

Užívateľ
Užívateľ
pouzitie viacerych css suborov naraz

Registrovaný: 27.09.07
Prihlásený: 31.12.15
Príspevky: 646
Témy: 233
Bydlisko: Dubnica nad...
Príspevok Napísal autor témyOffline : 11.09.2012 11:51

jj uz chapem ja som myslel ze to funguje takto:

pouzitie viacerych css suborov naraz

len neviem ako to vsetko poriesim teraz skusim...







_________________
Notebook: ASUS N750JV: Windows 8.1 64bit, Intel(R) Core(TM) i7-4700HQ CPU 2.40 GHz, 12GB RAM (DDR3 1600 MHz), NVIDIA GeForce GT 750M 4GB VRAM + HD Graphics 4600, 750 GB HDD (7200 rpm), Blu-ray Reader.
Smartphone: Samsung Galaxy S5 mini
Odpovedať na tému [ Príspevkov: 5 ] 


Podobné témy

 Témy  Odpovede  Zobrazenia  Posledný príspevok 
V tomto fóre nie sú ďalšie neprečítané témy. Odosielanie viacerych suborov naraz

v PHP, ASP

3

522

23.04.2008 17:33

Tominator Zobrazenie posledných príspevkov

V tomto fóre nie sú ďalšie neprečítané témy. Kopirovanie textu z viacerych suborov naraz

v Ostatné programy

0

536

12.03.2011 9:46

SMOKEYoriginal Zobrazenie posledných príspevkov

V tomto fóre nie sú ďalšie neprečítané témy. Update viacerých záznamov naraz.

v PHP, ASP

24

1365

05.04.2012 13:23

xxx9955 Zobrazenie posledných príspevkov

Táto téma je zamknutá, nemôžete posielať nové príspevky alebo odpovedať na staršie. rychlejsie nacitanie viacerych obrazkov naraz

v HTML, XHTML, XML, CSS

21

1204

03.08.2010 17:32

shaggy Zobrazenie posledných príspevkov

V tomto fóre nie sú ďalšie neprečítané témy. vyhladavanie vo viacerych tabulkach naraz

v Databázy

1

639

09.11.2010 16:53

camo Zobrazenie posledných príspevkov

V tomto fóre nie sú ďalšie neprečítané témy. Vkladanie udajov do viacerych tabuliek naraz

v Databázy

4

886

14.05.2008 18:10

asken Zobrazenie posledných príspevkov

V tomto fóre nie sú ďalšie neprečítané témy. Problém s IPTV na viacerých zariadeniach naraz

v Siete

11

774

18.12.2016 20:20

tatko Tom Zobrazenie posledných príspevkov

V tomto fóre nie sú ďalšie neprečítané témy. Spomali pouzitie viacerych require nacitanie stranky?

v PHP, ASP

5

502

20.07.2011 23:14

jablko05 Zobrazenie posledných príspevkov

V tomto fóre nie sú ďalšie neprečítané témy. Nacitanie viacerych suborov

v PHP, ASP

2

406

04.06.2007 14:07

geoge046 Zobrazenie posledných príspevkov

V tomto fóre nie sú ďalšie neprečítané témy. stiahnutie mnohých súborov naraz

v Sieťové a internetové programy

2

409

03.03.2013 15:32

davider137 Zobrazenie posledných príspevkov

V tomto fóre nie sú ďalšie neprečítané témy. vkladanie viacerých súborov cez include (ZOSTUPNE)

v PHP, ASP

7

532

10.05.2007 20:24

zero0x Zobrazenie posledných príspevkov

V tomto fóre nie sú ďalšie neprečítané témy. nefunguje uploadoavanie 3 suborov naraz

v PHP, ASP

12

549

14.02.2011 11:27

1daemon1 Zobrazenie posledných príspevkov

V tomto fóre nie sú ďalšie neprečítané témy. Zakryptovanie .css súborov

v HTML, XHTML, XML, CSS

14

547

01.11.2007 14:31

pitrik1 Zobrazenie posledných príspevkov

V tomto fóre nie sú ďalšie neprečítané témy. C++ linkovanie viacerých .o súborov do jedného .o súboru

v Assembler, C, C++, Pascal, Java

9

857

07.11.2010 12:46

johny3212 Zobrazenie posledných príspevkov

V tomto fóre nie sú ďalšie neprečítané témy. Citanie s dvoch CSS suborov

v HTML, XHTML, XML, CSS

14

559

15.01.2011 22:55

walther Zobrazenie posledných príspevkov

V tomto fóre nie sú ďalšie neprečítané témy. wordpress plugin - nacitanie php suboru +include css suborov

v Redakčné systémy

9

1484

20.03.2014 7:23

don jebot Zobrazenie posledných príspevkov


Nemôžete zakladať nové témy v tomto fóre
Nemôžete odpovedať na témy v tomto fóre
Nemôžete upravovať svoje príspevky v tomto fóre
Nemôžete mazať svoje príspevky v tomto fóre

Skočiť na:  

Powered by phpBB Jarvis © 2005 - 2024 PCforum, webhosting by WebSupport, secured by GeoTrust, edited by JanoF
Ako väčšina webových stránok aj my používame cookies. Zotrvaním na webovej stránke súhlasíte, že ich môžeme používať.
Všeobecné podmienky, spracovanie osobných údajov a pravidlá fóra