Barion Pixel
Ez itt a lifelong learning

Sosem tudhatsz eleget!

Blog

Mennyire ismered a CSS-t? 30 bemelegítő kérdés sitebuildhez

2018. április 16. | Pócsik Emese

# # #

Ha van 20 perced, próbáld ki magad alapszintű tesztünkön, vajon Te mennyire vagy képben az alábbi CSS kérdésekkel kapcsolatban. A válaszokra kattintva azonnal láthatod, hogy helyesen döntöttél-e, ezért csak akkor nyomj rá, ha biztos vagy a választásban. A kérdéseket figyelmesen olvasd el, és ha van kedved, tudasd velünk az eredményedet hozzászólásban.

Mit jelent CSS-ben a vessző?

#top, #bottom

Nincs ilyen CSS-ben
Csoportosításra használjuk, amikor ugyanaz a szabály több szelektorra is vonatkozik
Egymás után következő elemek tulajdonságainak megadására használjuk
Kiválasztja a testvéreket (azonos szülővel rendelkezőket)

Mit jelent a > kombinátor?

ul > li > a

Közvetlen gyermek elem
Kiválasztja a testvéreket
Csoportosításra használjuk, amikor ugyanaz a szabály több szelektorra is vonatkozik
Nincs ilyen CSS-ben

Mit jelent a + kombinátor?

#menu + div

Csoportosításra használjuk, amikor ugyanaz a szabály több szelektorra is vonatkozik
Nincs ilyen CSS-ben
Azonos szülővel rendelkező, közvetlenül következő szomszédos testvért választja ki
Közvetlen gyermek elem

Mit jelent a ~ kombinátor?

div ~ p

Azonos szülővel rendelkező, közvetlenül következő szomszédos testvért választja ki
Csoportosításra használjuk, amikor ugyanaz a szabály több szelektorra is vonatkozik
Általános testvér, kiválasztja az összes olyan elemet, melyeket az előbbi választó előz meg
Nincs ilyen CSS-ben

Melyik a helyes CSS szintaxis?

body {color: blue;}
body:color=blue;
{body;color:blue;}
{body:color=blue;}

Mit eredményez az alábbi kódsor a DOM-ban?

<span class=”highlight”>Béla</span>
.highlight:before { content: “Helló”; }

<span class=”highlight”>Helló Béla</span>
Helló<span class=”highlight”>Béla</span>
<span class=”Helló-highlight”>Béla</span>
<span class=”highlight”>HellóBéla</span>

Mi a megfelelő HTML elem a legmagasabb szintű címsorhoz?

<heading>
<h6>
<head>
<h1>

Mi a helyes HTML elem dőlt szöveg formázásához?

<i>
<em>
mindkettő
egyiksem

Mi a helyes HTML elem félkövér szöveg formázásához?

<b>
<bold>
mindkettő
egyiksem

Hogyan készíthetsz számozott listát HTML-ben?

<numberlist>
<ol>
<list>
<ul>

Melyik attribútum adja meg a kép helyettesítő szövegét, ha a kép nem jeleníthető meg?

alt
src
longdesc
title

Melyik HTML elem határozza meg a navigációs hivatkozásokat?

<navigation>
<navigate>
<nav>
<menu>

Hogyan adhatsz háttérszínt az összes <h1> elemnek?

all.h1 {background-color:#ff0000;}
h1.all {background-color:#ff0000;}
h1 {background-color:#ff0000;}
h1* {background-color:#ff0000;}

Hogyan jeleníthetőek meg a hiperhivatkozások aláhúzás nélkül?

a {underline:none;}
a {decoration:no-underline;}
a {text-decoration:no-underline;}
a {text-decoration:none;}

Hogyan formázhatsz verzál (csupa nagybetűs) szöveget?

text-transform:capitalize;
text-transform:uppercase;
text-transform:versal;
Ez nem lehet megoldani CSS-el, be kell gépelni nagybetűvel

Hogyan jelenítesz meg egy ilyen keretet?

felül = 10px, alul = 5px, bal oldalon= 20px, jobb oldalon = 1px

border-width:5px 20px 10px 1px;
border-width:10px 5px 20px 1px;
border-width:10px 1px 5px 20px;
border-width:10px 20px 5px 1px;

Hogyan választod ki CSS-ben a footer HTML elemet?

#footer
.footer
footer
*footer

Hogyan választod ki az összes p elemet a div elemen belül?

div.p
div p
div + p
div#p

Mi a position tulajdonság alapértelmezett értéke?

static
absolute
fixed
relative

A padding tulajdonság használatakor lehet-e negatív értékeket használni?

Igen
Nem
Csak Google Chrome-ban
Csak Internet Explorerben

Mi az img HTML elem alapértelmezett display értéke?

block
inline-block
inline
flex

A margin-top és margin-bottom beállítás hatással van az inline elemekre?

Igen
Nem
Csak Google Chrome-ban
Csak Internet Explorerben

A padding-top és a padding-bottom értéke hozzáadódik az inline elemek a méreteihez?

Igen
Nem
Csak ha border-box az elem
Csak Internet Explorerben

Milyen színű a körte?

<ul>
<li><span>Alma</span></li>
<li><span class=”highlight”>Körte</span></li>
</ul>

ul {color: red}
ul li {color: purple}
ul li span {color: yellow}
.highlight {color: blue}

piros
kék
sárga
lila

Mi történik a bekezdéssel?

<p class=”bekezdes”>Ez itt egy bekezdés</p>

#bekezdes {
margin-bottom: -5px;
}

5px lefelé mozog
5px felfelé mozog
-5px felfelé mozog
Semmi

Letöltődik-e a háttérkép, ha az nincs használatban?

#box {
background-image: url(‘mypic.jpg’);
}

Igen
Nem
Csak Google Chrome-ban
Csak Internet Explorerben

Letöltődik-e a háttérkép, ha az használatban van, de nem látható?

#box {
background-image: url(‘mypic.jpg’);
display: none;
}

Igen
Nem
Csak Google Chrome-ban
Csak Internet Explorerben

Hogyan adhatsz meg töréspontot 600px – 900px között?

@media only screen and (width: 600px – 900px){…}
@media only screen and (min-width: 600) and (max-width: 900){…}
@media only screen and (min-width-start: 600) and (max-width-end: 900){…}
@media only screen and (min-width: 600px) and (max-width: 900px){…}

Melyik előtagot kell használnod, hogy a CSS3 tulajdonságok a régebbi Mozilla Firefox böngészőkben is lefussanak?

-moz
-mozzila
-mo
-webkit

Az alábbiak közül melyik mértékegység határozza meg a viewport szélességének 1% -át?

vh
vw
vp
vmin
Iratkozz fel YouTube csatornákra!

blog

Tanulás Designer Karrier Kérdezz-Felelek

Designer Karrier Kérdezz-Felelek

2022. január 25.

A múlt hét végén megtartott Kreatív Karriernavigátor nap után nagyon sok kérdés jött hozzánk, ezekre tegnap egy rögtönzött FB Live-ban válaszoltam, illetve fel tudtatok tenni egyéb kapcsolódó kérdéseket is. Kiből lehet designer? Én azt gondolom, hogy nem kell hozzá extra képesség. Nyilván aki tudja magáról, hogy általában nincs szépérzéke, nehezebben fog boldogulni, de már sok […]

Tovább a cikkre
Secured By miniOrange