Alineación ​

Alinea el párrafo actual, o los párrafos del rango seleccionado, a la izquierda, al centro o a la derecha. Los objetos que viven dentro de un párrafo, como imágenes, vídeos y tablas, se alinean mediante el párrafo que los envuelve.

La alineación se guarda como atributo de párrafo, no como formato de texto. Los bloques de código se excluyen de la alineación porque la indentación tiene significado propio.

Dentro de una celda, se alinea el párrafo interno o la imagen donde está el cursor. Al arrastrar para seleccionar varias celdas, se aplica a todos los párrafos e imágenes que admitan alineación en ellas. Si la selección combina alineaciones distintas, ningún botón de alineación aparece seleccionado.

Para alinear la propia tabla, pulsa Seleccionar tabla en sus herramientas contextuales o coloca el cursor antes o después de la tabla dentro del párrafo que la contiene, y usa los botones de alineación de la barra principal. La posición izquierda o derecha de un área flotante se cambia desde sus herramientas contextuales, no con los botones de alineación.

Alas
Tipografía baseAltura
HTMLCargando el editor…
JSONnabi-treeCargando el editor…
Instalación
npm install nabi-note
Código
import {
  createLocale, createNabiWith, mountSurface, mountToolbar,
  mountContextToolbar, mountHints, watchSettle, alignWing, dropCapWing,
  mountViewTools,
} from 'nabi-note'

const selected = [
  alignWing,
  dropCapWing,
]
const locale = createLocale('es')
const { nabi, registry } = createNabiWith(selected, { locale })

const root = document.querySelector('.nabi')!
const content = document.querySelector('.nabi-content')!

// The locale also sets the direction — Arabic and Urdu run right to left
mountSurface({ nabi, registry, root: content, locale })

const settle = watchSettle(document, { surface: content })
const shared = { nabi, registry, surface: content, settle, locale }
const toolbar = mountToolbar({ ...shared, root: document.querySelector('#toolbar')! })
const context = mountContextToolbar({ ...shared, root: document.querySelector('#context')! })
mountHints({ toolbar, context, root, surface: content })
// The preview and fullscreen buttons — they stand their own box at the end of the row
mountViewTools({ ...shared, root, container: document.querySelector('#toolbar')! })

// on every change — hook up your own code here
// nabi.onChange(() => user_callback(nabi.getHtml()))

// Call from your language selector. Content and editing history stay intact.
// locale.setLocale('ko')
ts
const selected = wings().use('align').build()

Para aplicar un comando a la selección actual, usa l para izquierda, c para centro y r para derecha.

ts
nabi.applyCommand('setAlign', { value: 'c' })