Esiste una gigantesca "pagina degli asset" di tutti gli elementi Bootstrap che posso ri-modellare?

http://twitter.github.com/bootstrap/base-css.html Esiste una gigantesca "pagina degli asset" di tutti gli elementi Bootstrap che posso ri-modellare?

Vedere tutti gli elementi di esempio, come h1, h2, h3, ingressi, ecc.?

Sto cercando una semplice pagina Web che contenga ogni singolo input/forme/elementi/ecc su Bootstrap e nient'altro.

Quindi posso ottenere che il nostro designer modifichi il file CSS di base con i propri stili e possa aggiornare la pagina di asset per vedere tutte le sue modifiche e come si sta formando l'intera guida di stile.

Sarebbe molto utile per il nostro team fare riferimento, e per il nostro cliente, in modo che possa vedere il nostro intero 'aspetto grafico' in un'unica pagina consolidata.

Questa pagina esiste ovunque?

fonte

2013-03-05 user72245

+11

persone non sembrano essere la comprensione della domanda qui. Ciò che l'op sta chiedendo sarebbe incredibilmente utile, una singola pagina che puoi avere sul tuo sito (magari una pagina di amministrazione) che mostra ogni elemento di bootstrap. Stiamo fondamentalmente parlando delle pagine su http://twitter.github.io/bootstrap/ ma con il tuo stile applicato. Pensa a una guida di stile automatica. – opsb

Quello che si potrebbe fare è personalizzare il sito dei documenti di bootstrap per utilizzare il foglio di stile. È incluso nel repository bootstrap in (su github a https://github.com/twitter/bootstrap/blob/master/docs/index.html).

Per utilizzare un foglio di stile diverso è necessario aggiornare https://github.com/twitter/bootstrap/blob/master/docs/templates/layout.mustache per puntare al tuo foglio di stile:

<!-- Le styles --> 
<link href="assets/css/bootstrap.css" rel="stylesheet"> 
<link href="assets/css/bootstrap-responsive.css" rel="stylesheet"> 
<link href="assets/css/docs.css" rel="stylesheet"> 
<link href="assets/js/google-code-prettify/prettify.css" rel="stylesheet"> 
<!-- add your stylesheet here to override -->

e poi costruire utilizzando:

$ node docs/build production

fonte

2013-04-16 16:47:17 opsb

Sono stato alla ricerca di una cosa simile. Il meglio che ho trovato è questo sito, che ti permette anche di editare il css su di esso.

http://pikock.github.io/bootstrap-magic/app/index.html#!/editor

fonte

2013-04-19 20:47:39 alexjj

ho avuto la stessa identica necessità, bootstrap ha questo pronto per voi:

1) Vai http://twitter.github.io/bootstrap/getting-started.html e scarica Bootstrap Fonte

2) decomprimere e passare a "meno \ test "

3) non vi troverete, come bootstrap mette 'one stop shop per rapidi test di debug e alla periferia di casi di CSS'

fonte

2013-04-25 20:38:51 gfilippou

Il tarball Bootstrap corrente non contiene o non contiene più una cartella di test/meno – janv8000

Al momento della scrittura, questo è una buona per BS3 http://bootply.com/render/71500

Aggiornamento Decembre 2013: Bootswatch ha una pagina che viene aggiornato regolarmente http://bootswatch.com/default/

fonte

2013-08-05 07:56:45

Questa una versione usata 3-rc1, ha un aspetto non corretto con la versione 3.0.0 ,. Ecco un documento simile che rende bene con 3.0.0: https://github.com/divshot/bootstrap-theme-white-plum/blob/master/examples/kitchen-sink.html – Tor

Ecco una demo della fonte di cui sopra: http://code.divshot.com/bootstrap-theme-white-plum/examples/kitchen-sink.html – Tor

Questo è basato su 3.0.0 - http://bootply.com/65566 – ZimSystem

Bootstrap TLDR contiene tutti i componenti in una sola pagina: https://anvoz.github.io/bootstrap-tldr/

E 'su Github così: https://github.com/anvoz/bootstrap-tldr

fonte

2015-01-10 14:19:57

dare uno sguardo qui, una lista completa dei CSS e componenti, con qualche spiegazione e codice snipets:

http://codepen.io/letanure/full/WxwaZP/

Alcuni giorni fa ho bisogno la stessa cosa, non trovate nulla come ho bisogno, così ho creato questo.

randon pezzo di codice, perché StackOverflow richiedere se postare un link ad codepen

<html lang="en"> 
 

 
<head> 
 
    <meta charset="utf-8"> 
 
    <title>Bootstrap all elements</title> 
 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
 
    <meta http-equiv="X-UA-Compatible" content="IE=edge" /> 
 
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous"> 
 
    <!-- Optional theme --> 
 
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap-theme.min.css" integrity="sha384-fLW2N01lMqjakBkx3l/M9EahuwpSfeNvV63J5ezn3uZzapT0u7EYsXMjQV+0En5r" crossorigin="anonymous"> 
 

 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/clipboard.js/1.5.10/clipboard.min.js"></script> 
 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> 
 
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script> 
 

 
</head> 
 

 
<body>

fonte

2016-06-14 10:16:55

non riuscivo a trovare uno, così ho creato il mio. Fondamentalmente ho unito tutte le pagine di esempio della documentazione e ho eliminato tutte le descrizioni e i codici. Ho anche rimosso alcuni duplicati.

Sulla base di Bootstrap v4.0.0-alpha.6

https://github.com/gavsiu/bootstrap-demo

fonte

2017-03-01 22:42:43 gavsiu

Esiste una gigantesca "pagina degli asset" di tutti gli elementi Bootstrap che posso ri-modellare?

risposta

Problemi correlati