Visiskai pradedancio frontenderio klausimai

Sausio 11, 2016

Nutariau pramokti html, css, js bei kt. frontendui reikalingu dalyku. Pradzia yra su codecademy. Lyg ir viskas labai aisku, bet iskyla tokiu ne i tema klausimu :) Tai sioje temoje juos ir skelbsiu, gal bus galinciu atsakyti.

Pirmas klausimas apie html, kai rasau teste koda pvz. lenteles, kokios dalys turi buti naujoje pastraipoje, o kokios vienoje eiluteje? Aisku galutinis rezultatas tas pats, bet turi buti kazkokia tvarka, bet apie ja codecademy neuzsimena. Zemiau du pvz.:

<tr>
   <td><a href="http://linkas.lt"><img src="http:linkas.lt/logo.png"></a></td>
</tr>

ar

<tr>
   <td>
       <a href="http://linkas.lt"><img src="http:linkas.lt/logo.png"></a>
   </td>
</tr>

Sausio 11, 2016

Viskas remiasi į tavo paties patogumą. Šiaip dažniausiai naudojama tvarka yra kaip tavo pirmajame pvz.

O išplėstinis variantas būtų:

<table width="200" border="1" cellpadding="1" cellspacing="1">
   <tbody>
       <tr>
           <td><a href="http://linkas.lt"><img src="http:linkas.lt/logo.png"></a></td>
           <td><a href="http://linkas.lt"><img src="http:linkas.lt/logo.png"></a></td>
       </tr>
   </tbody>
</table>

Redagavo Sausio 11, 2016 Amerikonas

Sausio 11, 2016

Viskas remiasi į tavo paties patogumą. Šiaip dažniausiai naudojama tvarka yra kaip tavo pirmajame pvz.

O išplėstinis variantas būtų:
<table width="200" border="1" cellpadding="1" cellspacing="1">
   <tbody>
       <tr>
           <td><a href="http://linkas.lt"><img src="http:linkas.lt/logo.png"></a></td>
           <td><a href="http://linkas.lt"><img src="http:linkas.lt/logo.png"></a></td>
       </tr>
   </tbody>
</table>

Dekui.

Sausio 12, 2016

Vel turiu klausima :)

Man idomu, kada, kodel reikia deti kazka i <div></div>. Ar tuomet kai nori sugrupuoti kazkokia dali duomenu ir juos aprasyti css?

<body>
	<p>Introduction: Cascading with CSS</p>
	<div>
		<p>Synopsis: When you set a property of a selector like 'p' to a certain value, that value applies to <em>all</em> p tags.
		If, however, you change that same property to a different value for a more specific instance of p,
		that change will <em>override</em> the 'general rule'.
		</p>
		<ul>
			<li><p>If you say p { font-family: Garamond}, all 'p's will have the font Garamond.</p></li>
			<li><p>BUT if you say li p {font-family: Verdana}, 'p's outside of 'li's will be
				   in Garamond, and 'p's INSIDE 'li's will be in Verdana.
			</p></li>
			<li><p>The more specific your selectors are, the higher importance CSS gives to the styling you apply!</p></li>
		</ul>
	</div>
	<p>Summary: Greater specificity makes CSS prioritize that particular styling.</p>
</body>

Sausio 15, 2016

Ar populiaru kode naudoti <article>, <section>, <footer> reiksmes, ar viskas darome tik su <div>.

Sausio 15, 2016

Rekomenduotina naudoti tavo minėtus <article>, <section>, <footer> vietoje <div>

Sausio 15, 2016

Ar populiaru kode naudoti <article>, <section>, <footer> reiksmes, ar viskas darome tik su <div>.

Ne viskas daroma su div. Bet kurio atvėju tau vistiek reikės naudoti div'us, kai pradėsi daugiau visko skirstyt. Pradėsi div class ir id naudot. Visi tie yra vartotini, kurios išvardinai.

Sausio 16, 2016

Bet kiek supratau is teorijos, tai naudojant article, section yra labiau semantinis kodas, bet jei visur naudosiu div su id bei class, tai principe situacijos ir rezultato nekeicia.

Sausio 16, 2016

Yra ir kitas būdas suteikti daugiau semantinės prasmės, nenaudojant <article>, <section> ir kitų – HTML5 Microdata API.

Bet šiaip ta semantika padeda programinei įrangai, kuri bandys suvokti, kas tavo puslapyje pateikta – paieškos varikliams ar, pavyzdžiui, tam mygtukui naršyklėje, kuris pašalina iš puslapio visą nereikalingą turinį ir palieka tik lengvai skaitomą straipsnio tekstą ekrane. Žmogus, atsidaręs puslapį, ir taip suvoks, kur čia straipsnis, kur footer'is, o kur navigacija.

Redagavo Sausio 16, 2016 wi_lius

Sausio 17, 2016

Uzmaciau mokymuose, kad responsive dizainui naudojamos "media queries". Ar tai populiariausias siuo metu budas pritaikyti svetaines ivairiems ekranams?

Sausio 17, 2016

Taip

Sausio 19, 2016

Dabar iskilo toks klausimas. Kadangi dabar visos svetaines pagal nutylejima iskart daromos responsive, kaip jus pradedate bet kokios svetaines html kodo rasyma? Ta prasme jus iskart jau dirbate su bootstrap, foundation ar pan.? Mane domina pats pradinis procesas susijes su html ir css rasymu. Nes manau vistiek kiekvienam atvejui yra labai daug esminiu ir tu paciu startiniu dalyku, kad pradeti dirbti.

Sausio 19, 2016

Dabar iskilo toks klausimas. Kadangi dabar visos svetaines pagal nutylejima iskart daromos responsive, kaip jus pradedate bet kokios svetaines html kodo rasyma? Ta prasme jus iskart jau dirbate su bootstrap, foundation ar pan.? Mane domina pats pradinis procesas susijes su html ir css rasymu. Nes manau vistiek kiekvienam atvejui yra labai daug esminiu ir tu paciu startiniu dalyku, kad pradeti dirbti.

Žiūrint ką reikia. ankščiau kaip karpiau dizainus ,tai boostrap įsimesdavau į head dali ir rašiau savo CSS, bootrapą panaudodavau gaminant menu, kad būtų mygtukas su išlendančiu menu ir pnš, kad pačiam neišradinėti dviračio.

Redagavo Sausio 19, 2016 Arvis

Sausio 19, 2016

Žiūrint ką reikia. ankščiau kaip karpiau dizainus ,tai boostrap įsimesdavau į head dali ir rašiau savo CSS, bootrapą panaudodavau gaminant menu, kad būtų mygtukas su išlendančiu menu ir pnš, kad pačiam neišradinėti dviračio.

Man domina tiesiog pati pradzia. Esme, kad matai dizaina. Ir kada kaip sprendi ka naudoti, kai zinai, kad dizaina adaptuosi ne tik desktopui bet ir mobile. Nes kiek teko ziureti keleta medziagos kursu, tai vis kazka skirtingai daro. Bet kiek suprantu, tai kiekvienas turi kazkoki savo nusistatyta metoda, kaip kiekvienai svetainei raso html ar css. Ir kaip suprantu naudoja visa laika arba tik bootstrap, arba jei kazkam patinka foundation ar pn.?

Sausio 19, 2016

Gal kas gali pakomentuoti ar teisingai as suprantu. "inline-block" "li" turini isrikiuoja visus meniu vienoje linijoje lygiuodamas juos i kaire puse. Ka daro "a"reiksmeje esantis "display": block"? Ir kodel negalima "display: block" pritaikyti "li" kuriame ir yra tas pas "a" elementas?


header nav ul li {
float: left;
display: inline-block;
margin-top: 50px;
}

header nav ul li a {
color: #444;
text-transform: uppercase;
font-weight: bold;
display: block;
margin-right: 20px;
}

Redagavo Sausio 19, 2016 newindesign

Sausio 19, 2016

Gal kas gali pakomentuoti ar teisingai as suprantu. "inline-block" "li" turini isrikiuoja visus meniu vienoje linijoje lygiuodamas juos i kaire puse. Ka daro "a"reiksmeje esantis "display": block"? Ir kodel negalima "display: block" pritaikyti "li" kuriame ir yra tas pas "a" elementas?
header nav ul li {
float: left;
display: inline-block;
margin-top: 50px;
}

header nav ul li a {
color: #444;
text-transform: uppercase;
font-weight: bold;
display: block;
margin-right: 20px;
}

Viska su css gali padaryt. Tiesiog defaultu kai kurie html elementai yra "block" pvz.: div. span elementas "inline", img elementas "inline-block". Su css gali keitaliot kaip tau patinka juos.

tu a elementui su css priskirdamas block, jis tampa kaip divas, t.y. gali auksti, ploti reguliuoti ir pan.

Geriausia googlint ir dar karta googlint anglu kalba jeigu mokinies.

P.S. mokindamasis naudok inspect element funkcija, pvz chrome narsykle tokia turi, realiu laiku pasirinkes atitinkama HTML elementa galesi taikyt stilius.

Redagavo Sausio 19, 2016 kaunomanas

Sausio 19, 2016

Viska su css gali padaryt. Tiesiog defaultu kai kurie html elementai yra "block" pvz.: div. span elementas "inline", img elementas "inline-block". Su css gali keitaliot kaip tau patinka juos.

tu a elementui su css priskirdamas block, jis tampa kaip divas, t.y. gali auksti, ploti reguliuoti ir pan.

Geriausia googlint ir dar karta googlint anglu kalba jeigu mokinies.

P.S. mokindamasis naudok inspect element funkcija, pvz chrome narsykle tokia turi, realiu laiku pasirinkes atitinkama HTML elementa galesi taikyt stilius.

Apie default block elementus as zinau. Man iskilo klausimai kodel ir kaip naudojamas block mano pateiktame pvz. Vienintele mintis, kad tokiu butu galima suteiktu margin reiksme visiems a linkams, jei jie bus kaip block. NEs kiek teko skaityti ir ziureti video, visur bendrai pasneka, bet kai matai konkreciam pavizdyje tai ir iskyla klausimu.

Sausio 19, 2016

Apie default block elementus as zinau. Man iskilo klausimai kodel ir kaip naudojamas block mano pateiktame pvz. Vienintele mintis, kad tokiu butu galima suteiktu margin reiksme visiems a linkams, jei jie bus kaip block. NEs kiek teko skaityti ir ziureti video, visur bendrai pasneka, bet kai matai konkreciam pavizdyje tai ir iskyla klausimu.

Blockiniams elementams, galima uzdeti marginus, padingus, height, width ir t.t.. block-inline elementams isdalies. inline elementams isvis neveiks koks width ar height. Tai del to ir uzdeda block, kad galetu kaip reikia pastailinti, nes a elementas po defaultu yra inline.

Palygink:

a - inline

https://jsfiddle.net/d5yxbLcu/2/

a - block

https://jsfiddle.net/d5yxbLcu/3/

Redagavo Sausio 19, 2016 kaunomanas

Sausio 19, 2016

Blockiniams elementams, galima uzdeti marginus, padingus, height, width ir t.t.. block-inline elementams isdalies. inline elementams isvis neveiks koks width ar height. Tai del to ir uzdeda block, kad galetu kaip reikia pastailinti, nes a elementas po defaultu yra inline.

Palygink:
a - inline
https://jsfiddle.net/d5yxbLcu/2/
a - block
https://jsfiddle.net/d5yxbLcu/3/

Reiskia teisngai masciau, dekui.

Sausio 20, 2016

ar populiaru, ar daznai/visada naudojamas reset.css Nes kiek pasidomejau, tai labai geras dalykas, nes nesukdamas galvos gali delioti viska, neziuredamas kokius pgal defaulta nustatymus taiko kiekvienas browseris atskirai. Ar labiau populiaru naudoti normalize.css?

Redagavo Sausio 20, 2016 newindesign

Prisijungti

Visiskai pradedancio frontenderio klausimai

Rekomenduojami pranešimai

Nuoroda į pranešimą

Dalintis kituose puslapiuose

Nuoroda į pranešimą

Dalintis kituose puslapiuose

Nuoroda į pranešimą

Dalintis kituose puslapiuose

Nuoroda į pranešimą

Dalintis kituose puslapiuose

Nuoroda į pranešimą

Dalintis kituose puslapiuose

Nuoroda į pranešimą

Dalintis kituose puslapiuose

Nuoroda į pranešimą

Dalintis kituose puslapiuose

Nuoroda į pranešimą

Dalintis kituose puslapiuose

Nuoroda į pranešimą

Dalintis kituose puslapiuose

Nuoroda į pranešimą

Dalintis kituose puslapiuose

Nuoroda į pranešimą

Dalintis kituose puslapiuose

Nuoroda į pranešimą

Dalintis kituose puslapiuose

Nuoroda į pranešimą

Dalintis kituose puslapiuose

Nuoroda į pranešimą

Dalintis kituose puslapiuose

Nuoroda į pranešimą

Dalintis kituose puslapiuose

Nuoroda į pranešimą

Dalintis kituose puslapiuose

Nuoroda į pranešimą

Dalintis kituose puslapiuose

Nuoroda į pranešimą

Dalintis kituose puslapiuose

Nuoroda į pranešimą

Dalintis kituose puslapiuose

Nuoroda į pranešimą

Dalintis kituose puslapiuose

Prisijunkite prie diskusijos

Dabar naršo 0 narių

Prisijunk prie bendruomenės dabar!

Naujausios temos

Karštos temos