Selo sa boraditaba
Ditokomane le mehlala ya selo sa boraditaba sa Bootstrap go aga dikarolo tše di ipoeletšago kudu go swana le ditshwayotshwayo tša blog, di-tweet, le tše dingwe tše bjalo.
Mohlala
Selo sa boraditaba se thuša go aga dikarolo tše di raraganego le tše di ipoeletšago moo methopo ye mengwe ya ditaba e beilwego go bapa le diteng tšeo di sa phuthelego go dikologa boraditaba bjo bo boletšwego. Plus, e dira se ka diklase tše pedi fela tše di nyakegago ka lebaka la flexbox.
Ka tlase ke mohlala wa selo se tee sa boraditaba. Go nyakega diklase tše pedi feela—go phuthela .mediale go .media-bodydikologa diteng tša gago. Padding ya boikgethelo le margin di ka laolwa ka didirišwa tša go arola sekgoba .
Hlogo ya boraditaba
Na o tla ntirela se se swanago? Ke nako ya go lebana le mmino ga ke sa le muse wa gago. Heard it's beautiful, eba moahlodi le banenyana baka gonna take a vote. Ke kgona go kwa phoenix ka gare ga ka. Legodimo le hufegela lerato la rena, barongwa ba lla go tšwa godimo. Yeah, o nkiša go utopia.
<div class="media">
<img src="..." class="mr-3" alt="...">
<div class="media-body">
<h5 class="mt-0">Media heading</h5>
<p>Will you do the same for me? It's time to face the music I'm no longer your muse. Heard it's beautiful, be the judge and my girls gonna take a vote. I can feel a phoenix inside of me. Heaven is jealous of our love, angels are crying from up above. Yeah, you take me to utopia.</p>
</div>
</div>Flexbug #12: Dielemente tša ka gare ga mothaladi ga di swarwe bjalo ka dilo tša go kobega
Internet Explorer 10-11 ga e tšweletše dielemente tša ka gare ga mothaladi go swana le dikgokagano goba diswantšho (goba ::beforele ::afterdielemente tša maaka) bjalo ka dilo tša go kobega. Tharollo e nnoši ke go beakanya displayboleng bjo e sego bja ka gare ga mothaladi (mohlala, block, inline-block, goba flex). Re šišinya go diriša .d-flex, e nngwe ya didirišwa tša rena tša pontšho , e le tokiso e bonolo.
Mohloli: Flexbugs ka GitHub
Go dira dihlaga
Dilo tša boraditaba di ka tsenywa ka gare ga sehlaga ka mo go sa felego, le ge re šišinya gore o eme ka nako ye nngwe. Bea e tsentšwego .mediaka gare ga .media-bodyya selo sa methopo ya ditaba ya motswadi.
Hlogo ya boraditaba
Go ema mothalong wa pele ge dipomo di thoma go wa. Legodimo le hufegela lerato la rena, barongwa ba lla go tšwa godimo. A ka se go tšeele legato ka dipalamonwana tše milione. Mošemane, ge o na le nna ke tla go fa tatso. Ga go na go boela morago. Pele o kopana le nna ke be ke lokile eupša dilo di be di le kinda boima. Boima ke hlogo yeo e aparago mphapahlogo.
Hlogo ya boraditaba
Dumelang baratiwa a re tseeng leeto. Ee, re dira gore barongwa ba lle, ba neša pula lefaseng go tšwa godimo. Go fe selo se sebotse seo o ka se ketekago. Ke be ke tlwaetše go loma leleme le go swara moya. Ke ma hwetša pelo ya gago e kitima ka dijesi tša ka tšeo di tiilego letlalo. Ge ke dutše ke gwantela ke nnoši go ya go betha e fapanego. Selemo ka morago ga sekolo se se phagamego ge re be re kopana la mathomo. O hypnotizing kudu, na o ka ba diabolo? Na o ka ba morongwa? Ke nako ya go ntšha dibalune tše kgolo. O be a nagana gore ke nna mokgekolo. Di-bikini, di-zucchini, Di- Martini, ga go na di- weenies.
<div class="media">
<img src="..." class="mr-3" alt="...">
<div class="media-body">
<h5 class="mt-0">Media heading</h5>
<p>Standing on the frontline when the bombs start to fall. Heaven is jealous of our love, angels are crying from up above. Can't replace you with a million rings. Boy, when you're with me I'll give you a taste. There’s no going back. Before you met me I was alright but things were kinda heavy. Heavy is the head that wears the crown.</p>
<div class="media mt-3">
<a class="mr-3" href="#">
<img src="..." alt="...">
</a>
<div class="media-body">
<h5 class="mt-0">Media heading</h5>
<p>Greetings loved ones let's take a journey. Yes, we make angels cry, raining down on earth from up above. Give you something good to celebrate. I used to bite my tongue and hold my breath. I'm ma get your heart racing in my skin-tight jeans. As I march alone to a different beat. Summer after high school when we first met. You're so hypnotizing, could you be the devil? Could you be an angel? It's time to bring out the big balloons. Thought that I was the exception. Bikinis, zucchinis, Martinis, no weenies.</p>
</div>
</div>
</div>
</div>Go logaganya
Media ka gare ga selo sa media e ka logaganywa le didirišwa tša flexbox go ya godimo (ya tlwaelo), bogareng, goba mafelelong a .media-bodyditeng tša gago.
Methopo ya ditaba yeo e logaganywago godimo
Ke ya go mo tsenya ka gare ga coma. O fa mabaka a lekgolo ka lebaka la eng, gomme o re o tloga o tlo leka. Ka gona ke ile ka dula ka setu, ka dumela ka tlhompho. Go lokela ntwa ya ka ya go rweša mphapahlogo. Gomme ka Letšatši la ka la Matswalo la bo 18 re ile ra hwetša di-tattoo tšeo di swanago. So très chic, ee, ke classic. Ke loketše tsela yeo e sa sepelwego kudu.
Ke sepela moyeng (bošegong bjo). Eupša go theogela lefaseng. O original, o ka se tšeelwe legato. Eupša bophelong bjo bongwe nkabe ke le ngwanenyana wa gago. Re ile ra otlela go ya Cali gomme ra tagwa lebopong. Re kgona go bina, go fihlela re ehwa, nna le wena, re tla ba bafsa go ya go ile. Ke go bone downtown o opela Blues.
<div class="media">
<img src="..." class="align-self-start mr-3" alt="...">
<div class="media-body">
<h5 class="mt-0">Top-aligned media</h5>
<p>I’m gon’ put her in a coma. You give a hundred reasons why, and you say you're really gonna try. So I sat quietly, agreed politely. Suiting up for my crowning battle. And on my 18th Birthday we got matching tattoos. So très chic, yeah, she's a classic. I am ready for the road less traveled.</p>
<p>I'm walking on air (tonight). But down to earth. You're original, cannot be replaced. But in another life I would be your girl. We drove to Cali and got drunk on the beach. We can dance, until we die, you and I, will be young forever. Saw you downtown singing the Blues.</p>
</div>
</div>Methopo ya ditaba yeo e lebanego le bogareng
O tla tonya bjalo ka sehatsetsing. Mafelelong a eh-mafelelong a tšohle. Ka go hlaba bjalo ka nose ke ile ka hwetša methalo ya ka. Di-bikini, di-zucchini, Di- Martini, ga go na di- weenies. Ke tshepa gore o hweditše kganyogo ya dijo ye e phetšego gabotse. Re kgona go bina, go fihlela re ehwa, nna le wena, re tla ba bafsa go ya go ile. Re phela bophelo. Re e dira gabotse. Lentšu mo mmileng, o na le somethin 'go mpontšha, nna.
Wanna bona pontšo ka 3D, filimi. Ba re, tshaba ga o swane le ba bangwe, morati wa bokamoso. Bula pelo ya gago. Ka gona ke ile ka dula ka setu, ka dumela ka tlhompho. Labohlano le fetileng bosiu. Yeah, o na le mahlatse ge o le ka sefofaneng sa gagwe. Ke tla ba mpho ya gago, ke go fe selo se sebotse sa go keteka.
<div class="media">
<img src="..." class="align-self-center mr-3" alt="...">
<div class="media-body">
<h5 class="mt-0">Center-aligned media</h5>
<p>She'll turn cold as a freezer. At the eh-end of it all. Stinging like a bee I earned my stripes. Bikinis, zucchinis, Martinis, no weenies. I hope you got a healthy appetite. We can dance, until we die, you and I, will be young forever. We're living the life. We're doing it right. Word on the street, you got somethin' to show me, me.</p>
<p class="mb-0">Wanna see the show in 3D, a movie. They say, be afraid you're not like the others, futuristic lover. Open up your heart. So I sat quietly, agreed politely. Last Friday night. Yeah, you're lucky if you're on her plane. I'll be your gift, give you something good to celebrate.</p>
</div>
</div>Methopo ya ditaba yeo e logaganywago ka fase
Etla, e re mebala ya gago e thuthupe. Ke kgona go kwa seetša se seo se lego ka gare ga ka. Bošego ka moka ba a bapala, koša ya gago. Go tloga Tokyo go ya Mexico, go ya Rio. Ga go na go boela morago. Eupša go theogela lefaseng. Boselamose, mebala-bala, Mr. Sephiri, ee. DNA ya go fapana, ga ba go kwešiše.
Eupša go theogela lefaseng. O na le seo, je ne sais quoi, o a e tseba. Ke kgona go bona mongwalo lebotong. Bašemane ba roba melala try'na go gagabela sneak peek ye nnyane. Ntšee, ta-ta-ntšee. Bula pelo ya gago. O be a nagana gore ke nna mokgekolo. Boom, boom, bomo. Venice beach le Palm Springs, nako ea lehlabula ke tsohle. Tliša beat morago. (Ke ka fao re dirago ka gona)
<div class="media">
<img src="..." class="align-self-end mr-3" alt="...">
<div class="media-body">
<h5 class="mt-0">Bottom-aligned media</h5>
<p>Come on, let your colours burst. I can feel this light that's inside of me. All night they're playing, your song. From Tokyo to Mexico, to Rio. There’s no going back. But down to earth. Magical, colorful, Mr. Mystery, ee. Different DNA, they don't understand you.</p>
<p class="mb-0">But down to earth. She's got that, je ne sais quoi, you know it. I can see the writing on the wall. The boys break their necks try'na to creep a little sneak peek. Take me, ta-ta-take me. Open up your heart. Thought that I was the exception. Boom, boom, boom. Venice beach and Palm Springs, summertime is everything. Bring the beat back. (This is how we do)</p>
</div>
</div>Tatelano
Fetoša tatelano ya diteng ka go dilo tša boraditaba ka go fetoša HTML ka boyona, goba ka go oketša CSS ye nngwe ya tlwaelo ya flexbox go beakanya orderthepa (go palomoka yeo o e kgethago).
Selo sa boraditaba
Ke a tseba gore go tla ba le boikgafo eupša yeo ke theko. Naa o na le sebete sa go ntumelela go bona pikoko ya gago? Eba toro ya gago ya mahlalagading bošegong bjo. Uh-huh, ke a go bona. Ga go na go boela morago. Yeah, re maxed dikarata tša rena tša mokitlana gomme ra rakwa ka ntle ga bareng. Ka fao e re ke go tsenye ka sutu ya gago ya letšatši la matswalo. O ka ratana ge o kopana le yena. O be a na le lefase ka seatleng sa gago. O se ke wa dumelela bogolo bo go theoša, oo, oh yeah. Bjale re bolela bolepi bja dinaledi, go hwetša manala a rena a dirile, ka moka ga Majapane-y. Ndirele Aphrodite ya gago.
<div class="media">
<div class="media-body">
<h5 class="mt-0 mb-1">Media object</h5>
<p>I know there will be sacrifice but that's the price. Are you brave enough to let me see your peacock? Be your teenage dream tonight. Uh-huh, I see you. There’s no going back. Yeah, we maxed our credit cards and got kicked out of the bar. So let me get you in your birthday suit. You may fall in love when you meet her. Had the world in the palm of your hands. Don't let the greatness get you down, oh, oh yeah. Now we talking astrology, getting our nails did, all Japanese-y. Make me your Aphrodite.</p>
</div>
<img src="..." class="ml-3" alt="...">
</div>Lenaneo la boraditaba
Ka lebaka la gore selo sa boraditaba se na le dinyakwa te mmalwa kudu ta sebopego, o ka omia gape diklase te go dielemente ta HTML ta lenaneo. Go ya gago <ul>goba <ol>, oketša .list-unstyledgo tloša mekgwa efe goba efe ya lenaneo la maitirelo la sephephediši, gomme o diriše go s .mediaya gago . <li>Bjalo ka mehleng, diriša didirišwa tša go arola sekgoba kae le kae moo go nyakegago go lokiša gabotse.
-
Selo sa methopo ya ditaba ye e theilwego godimo ga lenaneo
Banenyana ba ka ka moka ba vintage Chanel baby. Ka fao o ka ba le kuku ya gago. Bošegong bjo, bošegong bjo, bošegong bjo, ke sepela moyeng. Ka go nanya go metša poifo ya ka, yeah yeah. Go gola ka lebelo go ba legadima. Ka fao go fiša le go ba boima, 'Til dawn.' Pale yeo ya dinaane yeo e felelago ka knight ka ditlhamo tše di phadimago. Boima ke hlogo yeo e aparago mphapahlogo.
-
Selo sa methopo ya ditaba ye e theilwego godimo ga lenaneo
Mohlomongwe lebaka leo ka lona mejako ka moka e tswaletšwego. Cause once o le wa ka, once o le wa ka. Eba toro ya gago ya mahlalagading bošegong bjo. Boima ke hlogo yeo e aparago mphapahlogo. Ga se le letšatši la maikhutšo, ga se selo sa go keteka. Ledimo le le phethagetšego, ledimo le le phethagetšego.
-
Selo sa methopo ya ditaba ye e theilwego godimo ga lenaneo
Naa o na le sebete sa go ntumelela go bona pikoko ya gago? Ga go na go boela morago. Le ke la mafelelo ge o re, ka morago ga mola wa mafelelo o roba. Mafelelong a eh-mafelelong a tšohle.
<ul class="list-unstyled">
<li class="media">
<img src="..." class="mr-3" alt="...">
<div class="media-body">
<h5 class="mt-0 mb-1">List-based media object</h5>
<p>All my girls vintage Chanel baby. So you can have your cake. Tonight, tonight, tonight, I'm walking on air. Slowly swallowing down my fear, yeah yeah. Growing fast into a bolt of lightning. So hot and heavy, 'Til dawn. That fairy tale ending with a knight in shining armor. Heavy is the head that wears the crown.</p>
</div>
</li>
<li class="media my-4">
<img src="..." class="mr-3" alt="...">
<div class="media-body">
<h5 class="mt-0 mb-1">List-based media object</h5>
<p>Maybe a reason why all the doors are closed. Cause once you’re mine, once you’re mine. Be your teenage dream tonight. Heavy is the head that wears the crown. It's not even a holiday, nothing to celebrate. A perfect storm, perfect storm.</p>
</div>
</li>
<li class="media">
<img src="..." class="mr-3" alt="...">
<div class="media-body">
<h5 class="mt-0 mb-1">List-based media object</h5>
<p>Are you brave enough to let me see your peacock? There’s no going back. This is the last time you say, after the last line you break. At the eh-end of it all.</p>
</div>
</li>
</ul>