abclinuxu.cz AbcLinuxu.cz itbiz.cz ITBiz.cz HDmag.cz HDmag.cz abcprace.cz AbcPráce.cz
Inzerujte na AbcPráce.cz od 950 Kč
Rozšířené hledání
×
    včera 18:55 | Bezpečnostní upozornění

    Byl objeven backdoor v upstream xz/liblzma ve verzích 5.6.0 a 5.6.1 vedoucí ke kompromitaci SSH serverů. Problému bylo přiřazeno CVE-2024-3094 a týká se například Debianu testing a unstable nebo beta verze Fedora Linuxu 40 a Rawhide.

    Ladislav Hagara | Komentářů: 6
    včera 18:33 | Komunita

    Při letecké nehodě zemřel Simon Riggs, jeden z klíčových vývojářů PostgreSQL. Pilotoval jednomotorové americké letadlo Cirrus SR22T. Simon Riggs měl v prosinci keynote PostgreSQL: The Next 20 Years na konferenci PGConf.EU 2023 v Praze.

    Ladislav Hagara | Komentářů: 2
    včera 03:11 | Zajímavý software

    Vývojáři dekompilátoru rev.ng otevřeli jeho backend revng-c. Zdrojové kódy jsou k dispozici na GitHubu.

    Ladislav Hagara | Komentářů: 0
    28.3. 22:44 | Komunita

    Poněvadž Redis už není svobodný, konsorcium Linux Foundation a Amazon Web Services (AWS), Google Cloud, Oracle, Ericsson a Snap Inc. společně představili svobodný fork Redisu s názvem Valkey.

    Ladislav Hagara | Komentářů: 10
    28.3. 18:55 | IT novinky

    Sam Bankman-Fried, zakladatel zkrachovalé kryptoměnové burzy FTX, byl dnes odsouzen k 25 letům vězení [Yahoo Finance].

    Ladislav Hagara | Komentářů: 9
    28.3. 18:33 | IT novinky Ladislav Hagara | Komentářů: 0
    28.3. 13:11 | Nová verze

    Byla vydána nová verze 2.53.18.2 svobodného multiplatformního balíku internetových aplikací SeaMonkey (Wikipedie). Přehled novinek v poznámkách k vydání.

    Ladislav Hagara | Komentářů: 0
    28.3. 00:22 | Zajímavý článek

    Na blogu programovacího jazyka Swift byl publikován příspěvek Psaní aplikací pro GNOME v programovacím jazyce Swift. Používá se Adwaita pro Swift.

    Ladislav Hagara | Komentářů: 7
    27.3. 17:44 | Zajímavý software

    egui je GUI knihovna pro programovací jazyk Rust běžící na webu i nativně. Vydána byla verze 0.27.0.

    Ladislav Hagara | Komentářů: 0
    27.3. 16:22 | Nová verze

    Byla vydána nová verze 6.1 živé linuxové distribuce Tails (The Amnesic Incognito Live System), jež klade důraz na ochranu soukromí uživatelů a anonymitu. Přehled změn v příslušném seznamu. Tor Browser byl povýšen na verzi 13.0.13. Thunderbird na verzi 115.9.0.

    Ladislav Hagara | Komentářů: 0
    Steam
     (30%)
     (26%)
     (12%)
     (8%)
     (23%)
    Celkem 430 hlasů
     Komentářů: 10, poslední 28.3. 17:31
    Rozcestník

    Administrace komentářů

    Jste na stránce určené pro řešení chyb a problémů týkajících se diskusí a komentářů. Můžete zde našim administrátorům reportovat špatně zařazenou či duplicitní diskusi, vulgární či osočující příspěvek a podobně. Děkujeme vám za vaši pomoc, více očí více vidí, společně můžeme udržet vysokou kvalitu AbcLinuxu.cz.

    Příspěvek
    9.6.2011 20:57 Josef Kufner | skóre: 70
    Rozbalit Rozbalit vše Re: Stylování SPANu/H1 v html / CSS
    Existují v zásadě dvě možnosti, jak to udělat.

    Obrázek na pozadí

    Prostě tu křivou plochu nakreslíš tak jak ji chceš a umístíš ji jako obrázek na pozadí. CSS pak bude vypadat takto:
    .křivej_nadpis {
      display: block;
      padding: 0;
      width: šířka obrázku;
      height: výška obrázku;
      background: barva top left no-repeat url(obrázek);
    }

    Vyrobit křivé okraje podobně, jako se dělají rámečky

    Tady je to trošku složitější, ale umožňuje to vytvořit křivý box s proměnlivou velikostí. Podle toho, jak moc to chceš mít proměnné, budeš potřebovat přidat divy. S ohledem na vyhledávače je rozumné divy přidat pomocí javascriptu, ale není to nutné.

    HTML:
    <h2 class="křivej_nadpis">nadpis
      <div class="ramecek levy"></div>
      <div class="ramecek pravy"></div>
      <div class="ramecek horni"></div>
      <div class="ramecek spodni"></div>
    </h2>
    
    CSS:
    .křivej_nadpis {
      display: block;
      padding: A B C D;
      position: relative;
      background: libovolné pozadí nadpisu;
    }
    
    .křivej_nadpis .ramecek {
      position: absolute;
      padding: 0px;
      margin: 0px;
      background; transparent top left;
    }
    
    .křivej_nadpis .ramecek.horni { /* žádná mezera před 3. tečkou */
      top: 0px;
      left: 0px;
      width: 100%;
      height: A;
      background-image: url(horní okraj obrázku);
      z-index: dle potřeby a obrázků;
    }
    
    .křivej_nadpis .ramecek.pravy {
      top: 0px;
      right: 0px;
      width: B;
      height: 100%;
      background-image: url(pravý okraj obrázku);
      z-index: dle potřeby a obrázků;
    }
    
    .křivej_nadpis .ramecek.spodni {
      bottom: 0px;
      left: 0px;
      width: 100%;
      height: C;
      background-image: url(spodní okraj obrázku);
      z-index: dle potřeby a obrázků;
    }
    
    .křivej_nadpis .ramecek.levy {
      top: 0px;
      left: 0px;
      width: D;
      height: 100%;
      background-image: url(levý okraj obrázku);
      z-index: dle potřeby a obrázků;
    }
    
    V podstatě je to velmi jednoduché. Do nadpisu jsou přidané čtyři divy, které jsou prázdné a absolutně pozicované vrámci stylovaného nadpisu. Každý z těch čtyř divů překryje jednu hranu nadpisu a přilehlé rohy. Padding nadpisu se pak postará o to, aby obsah nebyl překrytý.

    Jediné co, tak to potřebuje jednobarevné okolní pozadí.

    Rámečky podruhé – vnořené divy, pozadí a padding

    Podobnou technikou je použití paddingu místo absolutního pozicování. Ozdobné divy jsou vnořené a obsah (text nadpisu) je v tom nejvnitřnějším.
    <h2 class="křivej_nadpis">
      <div class="ramecek levy">
        <div class="ramecek pravy">
          <div class="ramecek horni">
            <div class="ramecek spodni">
              nadpis
            </div>
          </div>
        </div>
      </div>
    </h2>
    
    V CSS je pak jen potřeba nastavit vhodný padding a obrázek na pozadí.
    .křivej_nadpis {
      padding: 0px;
      background: transparent;
      position: relative; /* aby margin sousedů nekecal do umístění obsahu */
    }
    
    .křivej_nadpis .ramecek {
      display: block;
      padding: 0px;
      margin: 0px;
      background: transparent;
    }
    
    .křivej_nadpis .ramecek.horni {
      padding-top: A;
      background: transparent top center no-repeat url(horní okraj);
    }
    
    .křivej_nadpis .ramecek.pravy {
      padding-right: B;
      background: transparent center right no-repeat url(pravý okraj);
    }
    
    .křivej_nadpis .ramecek.spodni {
      padding-bottom: C;
      background: transparent bottom center no-repeat url(spodní okraj);
    }
    
    .křivej_nadpis .ramecek.levy {
      padding-left: D;
      background: transparent center left no-repeat url(levý okraj);
    }
    
    Je to bezproblémová technika a lze vykouzlit i skutečně průhledné okraje. Na druhou stranu je trošku těžší umístit jednotlivá pozadí do jednoho obrázku, aby se ušetřily HTTP requesty.

    Všechny tři techniky fungují v IE6,7,8 a všech ostatních prohlížečích.
    Hello world ! Segmentation fault (core dumped)

    V tomto formuláři můžete formulovat svou stížnost ohledně příspěvku. Nejprve vyberte typ akce, kterou navrhujete provést s diskusí či příspěvkem. Potom do textového pole napište důvody, proč by měli admini provést vaši žádost, problém nemusí být patrný na první pohled. Odkaz na příspěvek bude přidán automaticky.

    Vaše jméno
    Váš email
    Typ požadavku
    Slovní popis
    ISSN 1214-1267   www.czech-server.cz
    © 1999-2015 Nitemedia s. r. o. Všechna práva vyhrazena.