35 Įrankiai, scenarijai ir papildiniai, skirti sukurti gražią HTML lentelę

Duomenų vizualizacija yra raktas siekiant geriau suprasti didelę ar sudėtingą informaciją. Yra daug būdų vizualizuoti savo duomenis t. y. galite sukurti vėsią infografiją arba sukurti interaktyvias diagramas ‐ viskas priklauso nuo jūsų duomenų ir kaip norite jį pateikti.

Tačiau mano šiandieninis pranešimas yra tik lentelių ir kai kurių iš tikrųjų naudingi ištekliai įvairių tipų lentelių kūrimui. Čia pateikiami 35 patarimai, įrankiai, scenarijai ir įskiepiai, kurie gali padėti sukurti įvairias lenteles, kad pateiktumėte savo duomenis. Taigi, išsamiai aptarkime kiekvieną išteklių.

Lentelė jQuery fragmentai

Šie patogūs fragmentai kartu su paprastais paaiškinimais padėti jums sukurti interaktyvias lenteles. Pavyzdžiui, šie fragmentai leidžia jums pridėti dinamines eilutes, gauti ląstelių reikšmes ir pan.

Stilių lentelės

Patarimų ir gudrybių rinkinys, padedantis efektyviai stiliuoti lenteles gerinant jų išdėstymą, spausdinimą, teksto derinimą ir daug daugiau. Be to, tai taip pat pasakoja pridėti spalvų ir grafikos bei tinkinti antraštes kartu su kitais lentelės aspektais.

Ne daugiau lentelių

Fragmentas, kuris padeda jums sukurti mobiliosios reaguojančios lentelės, rodančios kiekvieną eilutę atskirai mažuose ekranuose. Be to, galite pakeisti spalvą, šriftą ir šrifto dydį ir pan. Naudodami CSS.

Lankstus stalas

Šis triukas gali padaryti jūsų stalo kūno slinkimą - tai funkcija, kuri randama daugelyje skaičiuoklės įrankių, pvz., „Google“ lapų. Tai reiškia, kad galite pataisykite lentelės antraštę, o lentelės korpusas arba turinys slinkti, kaip įprasta, kad lentelė būtų labiau matoma nei anksčiau.

Fiksuota lentelės antraštė

Dar vienas aukščiau paminėtas triukas, fiksuotos lentelės antraštė padeda sukurti lentelę su fiksuotu antrašte ir slenkamuoju turiniu. Tu gali pritaikyti lentelę, įskaitant spalvas ir šriftus, tačiau šis triukas nėra toks išsamus ir paaiškintas kaip „Scroll-can“ lentelės korpusas.

Pure CSS lentelė

Paprastas triukas, kuris leidžia jums paryškinkite tam tikrą langelį ant judėjimo - vertikaliai ir horizontaliai. Be to, finalinis stalas yra individualizuojamas su pasirinktomis spalvomis ir šriftais. Manau, kad šis triukas yra naudingiausias, kai jums reikia parodyti numerius ant stalo.

LENTELĖ!

LENTELĖJAS! yra internetinis įrankis, kuris leidžia jums sukurti paprastas lenteles HTML, naudojant „Excel“, „Google“ lapų duomenis, arba bet kuri kita skaičiuoklės priemonė. Galutinį stalą taip pat galite pritaikyti naudodami CSS, kaip ir bet kurią kitą HTML lentelę.

HTML lentelės generatorius

HTML lentelės generatorius yra paprastas stalo generatorius, kuris padeda jums sukurti ir tinkinti beveik kiekvieną lentelės aspektą, naudodami ekrano parinktis. Man patinka, galite sukurti lentelę rankiniu būdu, įkelti CSV failą arba importuoti duomenis iš skaičiuoklės įrankio, pvz., „Excel“. Taip pat galite stiliuoti lentelę pasirinkdami temą iš savo šablonų rinkinio.

„Quackit“ HTML lentelės generatorius

Kitas internetinis stalo generatorius, padedantis sukurti lenteles su pritaikomumo parinkčių rinkiniu. Stilius pasirinktys apima dydį, spalvą, sieną, ir tt Tačiau trūksta galimybės importuoti duomenis, skirtingai nuo pirmiau pateikto lentelės generatoriaus.

„Rapid Tables“ HTML lentelės generatorius

„Rapid Tables“ HTML lentelės generatorius yra dar vienas įrankis, kaip antai pirmiau minėtas įrankis. Tai suteikia daugiau tinkinimo parinkčių nei pirmiau minėta priemonė, pvz., dydis, siena, spalva, lygiavimas ir dar daugiau. Tačiau, kaip ir pirmiau minėta priemonė, ji palaiko tik sukurti lentelę rankiniu būdu ir neleidžiama importuoti failų arba paimkite duomenis iš skaičiuoklės įrankio, pvz., „Google“ dokumentų.

HTML lentelės stilius

Lentelės pritaikymo įrankis, HTML lentelės stilius, leidžia jums stiliuoti lenteles naudodami ekrano parinktys, kurios sukuria CSS jūsų lentelėje HTML. Šis įrankis, stebėtinai, rodo tiesioginį lentelės peržiūrą, leidžiantį išbandyti ir išbandyti stiliaus parinktis. Taip pat ji siūlo Stalo greito dizaino temos, kuriuos taip pat galite pritaikyti.

Konversijos įrankiai

Konversijos įrankiai yra a naudinga svetainė visiems, kurie kasdien dirba su lentelėmis ir skaičiuoklėmis. Jis padeda jums konvertuoti HTML lentelę į CSV failą, Excel failą į HTML lentelę, Excel failą į CSV failą ir padaryti daug daugiau konversijų.

HTML lentelė, skirta keisti konverterį

Interneto konverterio įrankis, HTML lentelė į Div Converter leidžia jums konvertuoti tradicines lenteles į div lenteles, t. Y. Lenteles, sukurtas naudojant „div“ elementus. Viskas, ką jums reikia padaryti nukopijuokite ir įklijuokite lentelę į savo puslapį ir paspauskite konvertuoti mygtuką, kad generuotumėte div lentelę.

Rankinis

Rankinis telefonas yra novatoriškas skaičiuoklės komponentas žiniatinklio programoms tai leidžia greitai kurti ir pasiūlyti skaičiuokles savo programose. Jis siūlo platų funkcijų spektrą, pavyzdžiui, palaikymą daugialypės sistemos, didelis našumas ir didžiulis duomenų kiekis, būtinos galimybės, pavyzdžiui, ieškojimas, filtravimas ir kt., leidžiantis kūrėjams greitai kurti.

Dynatable.js

Interaktyvus lentelės įskiepis, „Dynatable.js“ naudoja HTML, jQuery ir JSON, kad būtų sukurtos lentelės ir kitos lentelės formos struktūros. Lenteles galite sukurti tiesiogiai iš JSON ir įtraukti visas pagrindines funkcijas, pvz., Paiešką, filtrą, įrašų skaičių ir puslapių leidimą.

Bootstrap lentelė

Bootstrap lentelė yra išplėstinė lentelės versija, siūloma su „Bootstrap“. Tai sumažina jūsų laiką ir pastangas kuriant stalus ir sukuriant reagavimą. Jis suteikia tokias funkcijas kaip slinktinos ir fiksuotos antraštės ir funkcijos, pvz., rūšiuoti, lapavimas, ir kt.

List.js

List.js yra paprastas ir galingas „JavaScript“ papildinys, leidžiantis sukurti sąrašus ir lentelės su lankstumu ir funkcinėmis funkcijomis, pvz., filtru, paieška ir rūšiavimu, ir tt Man patiko, kad jis yra pastatytas naudojant vanilės „JavaScript“, taigi jums nereikia jokios trečiosios šalies bibliotekos.

jExcel

jExcel yra lengvas jQuery įskiepis, kuris leidžia jums įterpti bet kurią skaičiuoklę, suderinamą su „Excel“ savo tinklalapyje. Įskiepis padeda sukurti „Excel“ tipo lentelę, leisdamas jums perkelti, keisti dydį, kopijuoti, įklijuoti ir padaryti daug daugiau su lapo duomenimis.

„DataTables“

Super lankstus „jQuery“ papildinys, „Data Tables“ leidžia jums pridėti pažangias sąveikos kontrolės priemones į bet kurią HTML lentelę. Jis padeda jums pridėti puslapių, paieškos funkciją, temas ir tt Be to, jis suteikia daugybę plėtinių, skirtų pridėti daugiau funkcijų.

jQuery Bootgrid

jQuery Bootgrid yra aptakus ir intuityvus papildinys, skirtas kurti ir valdyti tinklus, pvz., lenteles. Ji suteikia funkcijų, tokių kaip paieška, lapavimas ir pan., Taip pat pritaikomi šablonai.

jQuery-Tabledit

jQuery-Tabledit yra „Bootstrap“ suderinamų HTML lentelių internetinis redaktorius, leidžiantis vartotojams redaguoti duomenis lentelėse. Galite pateikti mygtukus, kad perjungtumėte peržiūros ir redagavimo režimą, įtraukti ištrinti ir atkurti mygtukus ir pritaikyti lenteles naudojant CSS.

jsGrid

jsGrid yra lengvas jQuery įskiepis, kuris padeda kurti ir valdyti duomenų tinklus. Jis palaiko įvairias operacijas, susijusias su tinklais, pvz., Filtravimu, ieškojimu, rūšiavimu ir kt. Taip pat galite pritaikyti lentelės išvaizdą ir remia internacionalizaciją taip pat.

Išmanioji lentelė

Tvirta biblioteka, „Smart Table“ padeda jums paversti bet kurią HTML lentelę į protingesnę, naudodami tokias parinktis kaip filtruoti, ieškoti, rūšiuoti, Taip pat yra daugiau funkcijų, padedančių sukurti naudingą ir profesionalų stalą ar duomenų tinklą su jo įskiepiais.

HighchartTable

HighchartTable automatiškai konvertuoja HTML lenteles į diagramas ir diagramas. Tai ideali, jei norite pateikti projektų analizę ir statistiką grafikose kartu su skaitiniais duomenimis lentelėse.

TableExport

TableExport yra paprasta biblioteka eksportuoti HTML lentelę į CSV, TXT arba Excel failus. Naudodami šią biblioteką galite lengvai kurti lenteles su eksporto į failą funkcija.

Lentelė

Tabuliatorius yra „jQuery“ papildinys sukurti interaktyvias lenteles iš HTML lentelės, „JavaScript“ masyvo, „JSON“ ir kt. Jis palaiko beveik visas standartines stalo funkcijas, pvz., paiešką, rūšiuoti, filtruoti ir pan. temos, atšaukimai ir lokalizavimas.

FancyGrid

Tinklo biblioteka, „FancyGrid“ leidžia jums sukurti gražių lentelių kartu su diagramomis ir diagramomis. Jis palaiko daug duomenų šaltinių, įskaitant JSON, apima įvairias funkcijas, pavyzdžiui, rūšiuoti, ieškoti ir tt tematika ir modularizacija, ir suteikia daug daugiau funkcijų.

KingTable

„KingTable“ leidžia jums sukurti administracinės lentelės su minimaliu kodavimu. Jame yra nemažai funkcijų, įskaitant kliento ar serverio paiešką, rūšiavimą, filtravimą ir daugiau bendrų funkcijų. Galite pritaikyti stalo išvaizdą ir išvaizdą, pridėti priskirtus filtrus ir eksportuoti duomenis į įvairius formatus, pvz., CSV, JSON ir Excel.

stacktable.js

JQuery įskiepiai lentelėms, stacktable.js leidžia jums konvertuoti bet kokią plačiai atrodančią lentelę į 2 stulpelių raktą / vertės lentelę. Tai idealus sprendimas dideliems stalams rodyti mažuose ekranuose, pavyzdžiui, mobiliuosiuose įrenginiuose. Taip pat, jei reikia, galite sukrauti eilutes ar stulpelius.

Tabella.js

„Tabella.js“ padeda jums sukurti reaguojančias lenteles su fiksuotomis antraštėmis ir sukamaisiais duomenimis - net ir horizontaliai, kad į jį būtų įtraukta daugybė stulpelių nei paprastai. Be to, galite į tą patį puslapį įtraukti daug lentelių ir sukurti daugiafunkcines lenteles.

TablePress

TablePress yra fantastinis „WordPress“ papildinys, leidžiantis jums kurti ir įdėti lenteles į įrašus, puslapius ir teksto valdiklius naudojant trumpąjį kodą. Lentelės redaguojamos skaičiuoklės tipo sąsajoje ir gali apimti visų tipų duomenis, įskaitant ir formules. Taip pat galite pridėti funkcijų, pavyzdžiui, ieškoti ir rūšiuoti ir eksportuoti duomenis į įvairius formatus.

„Supsystic“ duomenų lentelės generatorius

Duomenų lentelės generatorius padeda kurti ir valdyti lenteles tiesiai iš administratoriaus skydelio naudojant priekinio stalo redaktorių. Keista, galite įtraukti lenteles ir diagramas kartu su antraštėmis, antraštėmis ir poraštėmis. Man įdomiau yra tai, kad lentelės yra visiškai redaguojamos, taip pat gali būti eksportuojamos į CSV, Excel ar PDF formatus.

„Supsystic“ kainodaros lentelė

Kitas „Supsystic“ papildinys, kainodaros lentelė leidžia jums sukurti kainų lenteles be jokių kliūčių. Tu gali pasirinkite šabloną, redaguokite kainodaros turinį ir skelbkite jį savo „WordPress“. Be to, lentelės, sukurtos naudojant šį papildinį, yra jautrios ir elegantiškos visuose įrenginiuose.

„Magic Liquidizer Responsive“ lentelė

Stalinis įskiepis „WordPress“, „Magic Liquidizer Responsive Table“ paverčia bet kurią įprastą lentelę į mobilųjį reaguojančią lentelę. Į lenteles galite įterpti paveikslėlius, tekstus ir pan. Ir parodyti juos kaip ir visuose įrenginiuose - net ir su mažais ekranais.

Copytables

„Copytables“ yra „Google Chrome“ plėtinys, leidžiantis kopijuoti lenteles iš tinklalapių. Tu gali pasirinkite lentelės langelius, eilutes ar stulpelius bet kuriame tinklalapyje ir nukopijuokite juos tiesiogiai .