CSS šrifto kraštinė
CSS šrifto siena yra technika, naudojama kuriant a į kraštą panašus kontūras aplink HTML teksto simbolius. Ši technika naudojama norint pagerinti matomumą arba suteikti tekstui dekoratyvumo. Tai galima pasiekti naudojant teksto brūkšnio savybę, kuri leidžia tinkinti teksto išvaizdą, aplink jį pridedant kraštinę.
Kaip taikyti šrifto kraštinę CSS
Yra du būdai, kaip taikyti šrifto kraštines teksto elementams HTML:
Turinys
Išsamiai išnagrinėkime šias CSS ypatybes ir supraskime, kaip jos naudojamos teksto kraštinėms įterpti HTML.
Naudojant teksto šešėlio ypatybę
The Teksto šešėlio ypatybė CSS suteikia tekstui šešėlio efektą, suteikdamas gylio ir pabrėžimo. Tam reikalingi horizontalių ir vertikalių poslinkių, suliejimo spindulio ir spalvų parametrai, todėl dizaineriai gali sukurti įvairius teksto šešėlių efektus, kad pagerintų vizualinį patrauklumą.
Sintaksė:
text-shadow: h-shadow v-shadow blur-radius color;
Turto vertės :
text-shadow ypatybė priima daug reikšmių, kai kurios iš jų nurodytos toliau esančioje lentelėje.
| Turto vertė | apibūdinimas |
|---|---|
h-shadow> | Nustato horizontalų šešėlį aplink tekstą. |
v-shadow> | Nustato vertikalų šešėlį aplink tekstą. |
blur-radius> | Nustato suliejimo spindulį aplink teksto šešėlį. |
color> | Nustato teksto šešėlio spalvą. |
none> | Nieko nenustato aplink tekstą (be šešėlio). |
initial> | Nustato teksto šešėlį į numatytąją pradinę reikšmę. |
inherit> | Paveldi nuosavybės vertes iš pirminio elemento. |
Grąžinimo vertė:
Tai grąžina šrifto kraštinę / šešėlį aplink tekstą.
Šrifto kraštinių pavyzdžiai
1 pavyzdys: Šiame pavyzdyje teksto šešėliui sukurti naudojama teksto šešėlio savybė.
html CSS teksto šešėlio nuosavybės pavadinimas> <style>h1 { text-shadow: 0 0 3px #FF0000, 0 0 5px #0000FF; } style> head> <body> <h1>techcodeview.comh1> body> html>>> </tag> <p dir='ltr'> <b> <strong>Išvestis: </strong> </b> <span> </span> </p> <img src='//techcodeview.com/img/picked/01/css-font-border.webp' alt='teksto šešėlis CSS'> <p dir='ltr'> <b> <strong>2 pavyzdys: </strong> </b> <span>Šiame pavyzdyje naudojama teksto šešėlio savybė, kad būtų sukurtas tekstas su apvadu. </span> </p>html <tag data-text-1=' <!DOCTYPE html> <html> <head> <title>CSS teksto šešėlio nuosavybės pavadinimas> <!-- Style to use text-shadow property --> <style>.GFG { spalva: balta; šrifto dydis: 50 pikselių; teksto šešėlis: -1px 1px 0 #000, 1px 1px 0 #000, 1px -1px 0 #000, -1px -1px 0 #000; } style> head> <body> <p>techcodeview.comp> body> html>>> </tag> <p dir='ltr'> <b> <strong>Išvestis: </strong> </b> </p> <img src='//techcodeview.com/img/picked/01/css-font-border-2.webp' alt='CSS parašytas tekstas'> <h2 id='using-textstroke-property'> <b> <strong>Naudojant teksto potėpio ypatybę </strong> </b> </h2> <p dir='ltr'> <span>The </span> <span>Teksto potėpio ypatybė </span> <span>naudojamas potėpiui į tekstą pridėti. Ši savybė gali būti naudojama norint pakeisti teksto plotį ir spalvą. Ši savybė palaikoma naudojant -webkit- priešdėlį. </span> </p> <p dir='ltr'> <b> <strong>Sintaksė: </strong> </b> </p> <tag data-text-3='-webkit-text-stroke: width color; </pre> </code> <h3> <b> <strong>Pavyzdys </strong> </b> </h3> <p dir='ltr'> <span>Šiame pavyzdyje teksto apvado kūrimui naudojama teksto brūkšnio savybė. </span> </p>html <tag data-text-1=' <!DOCTYPE html> <html> <head> <title>CSS teksto potėpio ypatybės pavadinimas> <!-- Style to use text-stroke property --> <style>.GFG { spalva: balta; šrifto dydis: 50 pikselių; -Webkit-text-stroke-width: 1px; -Webkit-text-stroke-color: juoda; } style> head> <body> <p>techcodeview.comp> body> html>>> </tag> <p dir='ltr'> <b> <strong>Išvestis: </strong> </b> <span> </span> </p> <img src='//techcodeview.com/img/picked/01/css-font-border-3.webp' alt=''> <p dir='ltr'> <b> <strong>Palaikoma naršyklė: </strong> </b> </p> <ul> <li value='1'> <span>Google Chrome </span> <span>1 </span> </li> <li value='2'> <span>Kraštas </span> <span> </span> <span>12 </span> </li> <li value='3'> <span>Firefox </span> <span>1 </span> </li> <li value='4'> <span>Opera </span> <span>3.5 </span> </li> <li value='5'> <span>Safari </span> <span>1 </span> </li> </ul> <p dir='ltr'> <span>CSS yra tinklalapių pagrindas. Jis naudojamas kuriant tinklalapius, formuojant svetaines ir žiniatinklio programas. CSS galite išmokti nuo pat pradžių vadovaudamiesi šiuo nurodymu. </span> <span>CSS pamoka </span> <span>ir </span> <span>CSS pavyzdžiai </span> <span>. </span> </p> <br> <br>
</div>
<!-- Article Footer with Prominent Share Buttons -->
<div class="px-6 md:px-8 py-8 bg-slate-50 dark:bg-slate-900/50 border-t border-slate-200 dark:border-slate-700/50">
<div class="flex flex-col sm:flex-row items-center justify-between gap-6">
<h4 class="text-base font-bold text-slate-700 dark:text-slate-300 uppercase tracking-wide flex items-center gap-2">
<i class="fa fa-share-alt text-tech-500"> </i>
Bendrinti </h4>
<div class="flex flex-wrap justify-center gap-3">
<!-- Twitter -->
<a href="https://twitter.com/intent/tweet?text=CSS šrifto kraštinė&url=https://www.techcodeview.com/lt/css-font-border"
target="_blank" rel="noopener noreferrer"
class="flex items-center gap-2 px-6 py-3 rounded-xl bg-[#1DA1F2]/10 text-[#1DA1F2] hover:bg-[#1DA1F2] hover:text-white transition-all duration-300 font-bold text-sm">
<i class="fa fa-twitter text-lg"> </i>
<span class="hidden sm:inline">Twitter </span>
</a>
<!-- Facebook -->
<a href="https://www.facebook.com/sharer/sharer.php?u=https://www.techcodeview.com/lt/css-font-border"
target="_blank" rel="noopener noreferrer"
class="flex items-center gap-2 px-6 py-3 rounded-xl bg-[#4267B2]/10 text-[#4267B2] hover:bg-[#4267B2] hover:text-white transition-all duration-300 font-bold text-sm">
<i class="fa fa-facebook text-lg"> </i>
<span class="hidden sm:inline">Facebook </span>
</a>
<!-- LinkedIn -->
<a href="https://www.linkedin.com/shareArticle?mini=true&url=https://www.techcodeview.com/lt/css-font-border&title=CSS šrifto kraštinė"
target="_blank" rel="noopener noreferrer"
class="flex items-center gap-2 px-6 py-3 rounded-xl bg-[#0077b5]/10 text-[#0077b5] hover:bg-[#0077b5] hover:text-white transition-all duration-300 font-bold text-sm">
<i class="fa fa-linkedin text-lg"> </i>
<span class="hidden sm:inline">LinkedIn </span>
</a>
</div>
</div>
</div>
</article>
<!-- Comments Placeholder / Random Articles -->
<div class="mt-8 bg-white dark:bg-slate-800 border border-slate-200 dark:border-slate-700 rounded-xl p-6 md:p-8 shadow-sm">
<h3 class="text-xl font-bold text-slate-900 dark:text-white mb-6 uppercase tracking-wide border-b border-slate-200 dark:border-slate-700 pb-2">
Jums Gali Patikti </h3>
<div class="grid grid-cols-1 md:grid-cols-2 gap-6">
<div class="group">
<a href="/lt/uri-vs-url-difference-between-uri" class="block aspect-video rounded-lg overflow-hidden bg-slate-200 dark:bg-slate-700 mb-3">
<img loading="lazy" src="https://techcodeview.com/img/computer-network/31/uri-vs-url-difference-between-uri.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="URI ir URL | Skirtumas tarp URI ir URL" class="w-full h-full object-cover group-hover:scale-105 transition-transform duration-500">
</a>
<h4 class="font-bold text-slate-900 dark:text-white leading-tight group-hover:text-tech-500 transition-colors">
<a href="/lt/uri-vs-url-difference-between-uri">URI ir URL | Skirtumas tarp URI ir URL </a>
</h4>
</div> <div class="group">
<a href="/lt/how-write-pseudo-code" class="block aspect-video rounded-lg overflow-hidden bg-slate-200 dark:bg-slate-700 mb-3">
<img loading="lazy" src="https://techcodeview.com/img/algorithms-misc/76/how-write-pseudo-code.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Kaip parašyti pseudo kodą?" class="w-full h-full object-cover group-hover:scale-105 transition-transform duration-500">
</a>
<h4 class="font-bold text-slate-900 dark:text-white leading-tight group-hover:text-tech-500 transition-colors">
<a href="/lt/how-write-pseudo-code">Kaip parašyti pseudo kodą? </a>
</h4>
</div>
</div>
</div>
</div>
<!-- SECONDARY COLUMN (SIDEBAR) -->
<!-- Aside Column -->
<div class="lg:col-span-4 space-y-8">
<!-- Best Articles Widget -->
<div class="rounded-xl bg-white dark:bg-slate-800 border border-slate-200 dark:border-slate-700 p-6 shadow-sm">
<div class="mb-4 border-b border-slate-100 dark:border-slate-700 pb-2">
<h2 class="text-lg font-bold text-slate-900 dark:text-white uppercase tracking-wide flex items-center">
<span class="mr-2 h-2 w-2 rounded-full bg-tech-500"> </span>
Top Straipsniai </h2>
</div>
<!-- Owl Carousel Preserved Container -->
<div id="owl-carousel-3" class="owl-carousel owl-theme center-owl-nav">
<!-- ARTICLE -->
<article class="flex items-start gap-4 p-2 hover:bg-slate-50 dark:hover:bg-slate-700/50 rounded-lg transition-colors">
<div class="w-20 h-20 shrink-0 overflow-hidden rounded-md bg-slate-200 dark:bg-slate-700">
<a href="/lt/early-decision-schools-131580">
<img src="https://techcodeview.com/img/blog/51/early-decision-schools.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Ankstyvojo sprendimo mokyklos: visas ED kolegijų sąrašas" class="w-full h-full object-cover">
</a>
</div>
<div class="flex-1 min-w-0">
<h4 class="text-sm font-semibold text-slate-800 dark:text-slate-200 leading-snug">
<a href="/lt/early-decision-schools-131580" class="hover:text-tech-500 transition-colors line-clamp-3">Ankstyvojo sprendimo mokyklos: visas ED kolegijų sąrašas </a>
</h4>
</div>
</article>
<!-- /ARTICLE --> <!-- ARTICLE -->
<article class="flex items-start gap-4 p-2 hover:bg-slate-50 dark:hover:bg-slate-700/50 rounded-lg transition-colors">
<div class="w-20 h-20 shrink-0 overflow-hidden rounded-md bg-slate-200 dark:bg-slate-700">
<a href="/lt/how-many-seconds-are-there-day-13122">
<img src="https://techcodeview.com/img/blog/81/how-many-seconds-are-there-day.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Kiek sekundžių yra per dieną? Savaitė? Metai?" class="w-full h-full object-cover">
</a>
</div>
<div class="flex-1 min-w-0">
<h4 class="text-sm font-semibold text-slate-800 dark:text-slate-200 leading-snug">
<a href="/lt/how-many-seconds-are-there-day-13122" class="hover:text-tech-500 transition-colors line-clamp-3">Kiek sekundžių yra per dieną? Savaitė? Metai? </a>
</h4>
</div>
</article>
<!-- /ARTICLE --> <!-- ARTICLE -->
<article class="flex items-start gap-4 p-2 hover:bg-slate-50 dark:hover:bg-slate-700/50 rounded-lg transition-colors">
<div class="w-20 h-20 shrink-0 overflow-hidden rounded-md bg-slate-200 dark:bg-slate-700">
<a href="/lt/difference-between-intellij-idea">
<img src="https://techcodeview.com/img/intellij-idea-tutorial/88/difference-between-intellij-idea.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Skirtumas tarp „IntelliJ Idea“ ir „Eclipse“." class="w-full h-full object-cover">
</a>
</div>
<div class="flex-1 min-w-0">
<h4 class="text-sm font-semibold text-slate-800 dark:text-slate-200 leading-snug">
<a href="/lt/difference-between-intellij-idea" class="hover:text-tech-500 transition-colors line-clamp-3">Skirtumas tarp „IntelliJ Idea“ ir „Eclipse“. </a>
</h4>
</div>
</article>
<!-- /ARTICLE --> <!-- ARTICLE -->
<article class="flex items-start gap-4 p-2 hover:bg-slate-50 dark:hover:bg-slate-700/50 rounded-lg transition-colors">
<div class="w-20 h-20 shrink-0 overflow-hidden rounded-md bg-slate-200 dark:bg-slate-700">
<a href="/lt/2d-transformation-rotation-of-objects">
<img src="https://techcodeview.com/img/mathematical/31/2d-transformation-rotation-of-objects.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="2D transformacija | Objektų sukimas" class="w-full h-full object-cover">
</a>
</div>
<div class="flex-1 min-w-0">
<h4 class="text-sm font-semibold text-slate-800 dark:text-slate-200 leading-snug">
<a href="/lt/2d-transformation-rotation-of-objects" class="hover:text-tech-500 transition-colors line-clamp-3">2D transformacija | Objektų sukimas </a>
</h4>
</div>
</article>
<!-- /ARTICLE --> <!-- ARTICLE -->
<article class="flex items-start gap-4 p-2 hover:bg-slate-50 dark:hover:bg-slate-700/50 rounded-lg transition-colors">
<div class="w-20 h-20 shrink-0 overflow-hidden rounded-md bg-slate-200 dark:bg-slate-700">
<a href="/lt/create-linked-list-c">
<img src="https://techcodeview.com/img/c-tutorial/94/create-linked-list-c.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Sukurkite susietą sąrašą C++" class="w-full h-full object-cover">
</a>
</div>
<div class="flex-1 min-w-0">
<h4 class="text-sm font-semibold text-slate-800 dark:text-slate-200 leading-snug">
<a href="/lt/create-linked-list-c" class="hover:text-tech-500 transition-colors line-clamp-3">Sukurkite susietą sąrašą C++ </a>
</h4>
</div>
</article>
<!-- /ARTICLE --> <!-- ARTICLE -->
<article class="flex items-start gap-4 p-2 hover:bg-slate-50 dark:hover:bg-slate-700/50 rounded-lg transition-colors">
<div class="w-20 h-20 shrink-0 overflow-hidden rounded-md bg-slate-200 dark:bg-slate-700">
<a href="/lt/ternary-operator-java">
<img src="https://techcodeview.com/img/java-tutorial/37/ternary-operator-java.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Trečias operatorius Java" class="w-full h-full object-cover">
</a>
</div>
<div class="flex-1 min-w-0">
<h4 class="text-sm font-semibold text-slate-800 dark:text-slate-200 leading-snug">
<a href="/lt/ternary-operator-java" class="hover:text-tech-500 transition-colors line-clamp-3">Trečias operatorius Java </a>
</h4>
</div>
</article>
<!-- /ARTICLE --> <!-- ARTICLE -->
<article class="flex items-start gap-4 p-2 hover:bg-slate-50 dark:hover:bg-slate-700/50 rounded-lg transition-colors">
<div class="w-20 h-20 shrink-0 overflow-hidden rounded-md bg-slate-200 dark:bg-slate-700">
<a href="/lt/what-is-trie-data-structure">
<img src="https://techcodeview.com/img/ds-tutorial/74/what-is-trie-data-structure.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Kas yra „Trie“ duomenų struktūra?" class="w-full h-full object-cover">
</a>
</div>
<div class="flex-1 min-w-0">
<h4 class="text-sm font-semibold text-slate-800 dark:text-slate-200 leading-snug">
<a href="/lt/what-is-trie-data-structure" class="hover:text-tech-500 transition-colors line-clamp-3">Kas yra „Trie“ duomenų struktūra? </a>
</h4>
</div>
</article>
<!-- /ARTICLE --> <!-- ARTICLE -->
<article class="flex items-start gap-4 p-2 hover:bg-slate-50 dark:hover:bg-slate-700/50 rounded-lg transition-colors">
<div class="w-20 h-20 shrink-0 overflow-hidden rounded-md bg-slate-200 dark:bg-slate-700">
<a href="/lt/binary-decimal-number-c">
<img src="https://techcodeview.com/img/c-tutorial/82/binary-decimal-number-c.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Dvejetainis skaičius C" class="w-full h-full object-cover">
</a>
</div>
<div class="flex-1 min-w-0">
<h4 class="text-sm font-semibold text-slate-800 dark:text-slate-200 leading-snug">
<a href="/lt/binary-decimal-number-c" class="hover:text-tech-500 transition-colors line-clamp-3">Dvejetainis skaičius C </a>
</h4>
</div>
</article>
<!-- /ARTICLE --> <!-- ARTICLE -->
<article class="flex items-start gap-4 p-2 hover:bg-slate-50 dark:hover:bg-slate-700/50 rounded-lg transition-colors">
<div class="w-20 h-20 shrink-0 overflow-hidden rounded-md bg-slate-200 dark:bg-slate-700">
<a href="/lt/surface-area-cone">
<img src="https://techcodeview.com/img/maths-class-9/76/surface-area-cone.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Kūgio paviršiaus plotas" class="w-full h-full object-cover">
</a>
</div>
<div class="flex-1 min-w-0">
<h4 class="text-sm font-semibold text-slate-800 dark:text-slate-200 leading-snug">
<a href="/lt/surface-area-cone" class="hover:text-tech-500 transition-colors line-clamp-3">Kūgio paviršiaus plotas </a>
</h4>
</div>
</article>
<!-- /ARTICLE --> <!-- ARTICLE -->
<article class="flex items-start gap-4 p-2 hover:bg-slate-50 dark:hover:bg-slate-700/50 rounded-lg transition-colors">
<div class="w-20 h-20 shrink-0 overflow-hidden rounded-md bg-slate-200 dark:bg-slate-700">
<a href="/lt/colleges-with-late-application-deadlines-1311024">
<img src="https://techcodeview.com/img/blog/63/colleges-with-late-application-deadlines.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Kolegijos, kurių paraiškų teikimo terminai pavėluoti: visas sąrašas" class="w-full h-full object-cover">
</a>
</div>
<div class="flex-1 min-w-0">
<h4 class="text-sm font-semibold text-slate-800 dark:text-slate-200 leading-snug">
<a href="/lt/colleges-with-late-application-deadlines-1311024" class="hover:text-tech-500 transition-colors line-clamp-3">Kolegijos, kurių paraiškų teikimo terminai pavėluoti: visas sąrašas </a>
</h4>
</div>
</article>
<!-- /ARTICLE -->
</div>
<!-- Categories -->
<div class="mt-8 mb-4 border-b border-slate-100 dark:border-slate-700 pb-2">
<h2 class="text-lg font-bold text-slate-900 dark:text-white uppercase tracking-wide">Kategorija </h2>
</div>
<div class="flex flex-wrap gap-2">
<a href="/lt/blog/" class="inline-block px-3 py-1 bg-slate-100 dark:bg-slate-700 text-xs font-medium text-slate-600 dark:text-slate-300 rounded-full hover:bg-tech-500 hover:text-white transition-colors">
Dienoraštis
</a> <a href="/lt/java-conversion/" class="inline-block px-3 py-1 bg-slate-100 dark:bg-slate-700 text-xs font-medium text-slate-600 dark:text-slate-300 rounded-full hover:bg-tech-500 hover:text-white transition-colors">
Java Konvertavimas
</a> <a href="/lt/maths/" class="inline-block px-3 py-1 bg-slate-100 dark:bg-slate-700 text-xs font-medium text-slate-600 dark:text-slate-300 rounded-full hover:bg-tech-500 hover:text-white transition-colors">
Matematika
</a> <a href="/lt/java-collections/" class="inline-block px-3 py-1 bg-slate-100 dark:bg-slate-700 text-xs font-medium text-slate-600 dark:text-slate-300 rounded-full hover:bg-tech-500 hover:text-white transition-colors">
Java Kolekcijos
</a> <a href="/lt/differences/" class="inline-block px-3 py-1 bg-slate-100 dark:bg-slate-700 text-xs font-medium text-slate-600 dark:text-slate-300 rounded-full hover:bg-tech-500 hover:text-white transition-colors">
Skirtumai
</a> <a href="/lt/java-string/" class="inline-block px-3 py-1 bg-slate-100 dark:bg-slate-700 text-xs font-medium text-slate-600 dark:text-slate-300 rounded-full hover:bg-tech-500 hover:text-white transition-colors">
Java Eilutė
</a>
</div>
<!-- Interesting Articles Widget -->
<div class="mt-8">
<div class="mb-4 border-b border-slate-100 dark:border-slate-700 pb-2">
<h2 class="text-lg font-bold text-slate-900 dark:text-white uppercase tracking-wide">Įdomios Straipsniai </h2>
</div>
<div id="owl-carousel-4" class="owl-carousel owl-theme">
<!-- ARTICLE -->
<article class="relative aspect-video rounded-lg overflow-hidden group mb-2">
<div class="absolute inset-0">
<img src="https://techcodeview.com/img/python-tutorial/61/how-open-url-python.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Kaip atidaryti URL Python" class="w-full h-full object-cover group-hover:scale-105 transition-transform duration-500">
<div class="absolute inset-0 bg-gradient-to-t from-black/80 to-transparent"> </div>
</div>
<div class="absolute bottom-0 left-0 p-4">
<div class="text-xs text-tech-400 font-bold mb-1"> <a href="/lt/python-tutorial/">Python Pamoka </a> </div>
<h4 class="text-sm font-bold text-white leading-tight"> <a href="/lt/how-open-url-python">Kaip atidaryti URL Python </a> </h4>
</div>
</article>
<!-- /ARTICLE --> <!-- ARTICLE -->
<article class="relative aspect-video rounded-lg overflow-hidden group mb-2">
<div class="absolute inset-0">
<img src="https://techcodeview.com/img/category/60/what-is-full-form-fifa.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Kokia yra visa FIFA forma" class="w-full h-full object-cover group-hover:scale-105 transition-transform duration-500">
<div class="absolute inset-0 bg-gradient-to-t from-black/80 to-transparent"> </div>
</div>
<div class="absolute bottom-0 left-0 p-4">
<div class="text-xs text-tech-400 font-bold mb-1"> <a href="/lt/category/">Kategorija </a> </div>
<h4 class="text-sm font-bold text-white leading-tight"> <a href="/lt/what-is-full-form-fifa">Kokia yra visa FIFA forma </a> </h4>
</div>
</article>
<!-- /ARTICLE --> <!-- ARTICLE -->
<article class="relative aspect-video rounded-lg overflow-hidden group mb-2">
<div class="absolute inset-0">
<img src="https://techcodeview.com/img/blog/92/complete-list-free-sat-math-practice-problems.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Visas NEMOKAMŲ SAT matematikos praktikos problemų sąrašas" class="w-full h-full object-cover group-hover:scale-105 transition-transform duration-500">
<div class="absolute inset-0 bg-gradient-to-t from-black/80 to-transparent"> </div>
</div>
<div class="absolute bottom-0 left-0 p-4">
<div class="text-xs text-tech-400 font-bold mb-1"> <a href="/lt/blog/">Dienoraštis </a> </div>
<h4 class="text-sm font-bold text-white leading-tight"> <a href="/lt/complete-list-free-sat-math-practice-problems-131160">Visas NEMOKAMŲ SAT matematikos praktikos problemų sąrašas </a> </h4>
</div>
</article>
<!-- /ARTICLE --> <!-- ARTICLE -->
<article class="relative aspect-video rounded-lg overflow-hidden group mb-2">
<div class="absolute inset-0">
<img src="https://techcodeview.com/img/css-tutorial/10/css-text-align.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="CSS teksto lygiavimas" class="w-full h-full object-cover group-hover:scale-105 transition-transform duration-500">
<div class="absolute inset-0 bg-gradient-to-t from-black/80 to-transparent"> </div>
</div>
<div class="absolute bottom-0 left-0 p-4">
<div class="text-xs text-tech-400 font-bold mb-1"> <a href="/lt/css-tutorial/">Css Pamoka </a> </div>
<h4 class="text-sm font-bold text-white leading-tight"> <a href="/lt/css-text-align">CSS teksto lygiavimas </a> </h4>
</div>
</article>
<!-- /ARTICLE --> <!-- ARTICLE -->
<article class="relative aspect-video rounded-lg overflow-hidden group mb-2">
<div class="absolute inset-0">
<img src="https://techcodeview.com/img/html-tutorial/13/html-table.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="HTML lentelė" class="w-full h-full object-cover group-hover:scale-105 transition-transform duration-500">
<div class="absolute inset-0 bg-gradient-to-t from-black/80 to-transparent"> </div>
</div>
<div class="absolute bottom-0 left-0 p-4">
<div class="text-xs text-tech-400 font-bold mb-1"> <a href="/lt/html-tutorial/">Html Pamoka </a> </div>
<h4 class="text-sm font-bold text-white leading-tight"> <a href="/lt/html-table">HTML lentelė </a> </h4>
</div>
</article>
<!-- /ARTICLE --> <!-- ARTICLE -->
<article class="relative aspect-video rounded-lg overflow-hidden group mb-2">
<div class="absolute inset-0">
<img src="https://techcodeview.com/img/picked/03/saving-pandas-dataframe.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Pandas duomenų rėmelio išsaugojimas kaip CSV" class="w-full h-full object-cover group-hover:scale-105 transition-transform duration-500">
<div class="absolute inset-0 bg-gradient-to-t from-black/80 to-transparent"> </div>
</div>
<div class="absolute bottom-0 left-0 p-4">
<div class="text-xs text-tech-400 font-bold mb-1"> <a href="/lt/picked/">Išrinktas </a> </div>
<h4 class="text-sm font-bold text-white leading-tight"> <a href="/lt/saving-pandas-dataframe">Pandas duomenų rėmelio išsaugojimas kaip CSV </a> </h4>
</div>
</article>
<!-- /ARTICLE -->
</div>
</div>
</div>
</div>
<!-- /Aside Column --> </div>
</div>
</div>
<footer class="site-footer">
<div class="container">
<span class="footer-links">
Copyright ©2026 Visos Teisės Saugomos |
<a href="//www.techcodeview.com/it/">techcodeview.com </a> |
<a href="/disclaimer" rel="nofollow noopener noreferrer" target="_blank">Atsisakymas </a> |
<a href="/about-us" rel="nofollow noopener noreferrer" target="_blank">Apie Mus </a> |
<a href="/privacy-policy" rel="nofollow noopener noreferrer" target="_blank">Privatumo Politika </a>
</span>
</div>
</footer>
<script type="text/javascript" src="https://techcodeview.com/template/assets/plugins/jquery-1.11.3.min.js"> </script>
<script type="text/javascript" src="https://techcodeview.com/template/assets/plugins/bootstrap/js/bootstrap.min.js"> </script>
<script type="text/javascript" src="https://techcodeview.com/template/assets/js/main.js"> </script>
<script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/11.5.1/highlight.min.js"> </script>
<script>
!function(){"use strict";let t=document.createElement("button");t.id="toTopBtn",t.innerHTML="↑";let e=`
#toTopBtn {
position: fixed; bottom: 25px; right: 25px; z-index: 9999; opacity: 0; visibility: hidden; background-color: #0ea5e9; color: white; border: none; border-radius: 8px; width: 50px; height: 50px; font-size: 24px; cursor: pointer; transition: opacity 0.3s ease-in-out, visibility 0.3s ease-in-out;
}
#toTopBtn:hover { background-color: #0284c7; }
`,i=document.createElement("style");i.type="text/css",i.innerText=e,document.head.appendChild(i),document.body.appendChild(t),window.addEventListener("scroll",()=>{let e=window.scrollY||document.documentElement.scrollTop;e>300?(t.style.opacity="1",t.style.visibility="visible"):(t.style.opacity="0",t.style.visibility="hidden")}),t.addEventListener("click",()=>{window.scrollTo({top:0,behavior:"smooth"})})}();
</script>
</body>
</html>