Plug -in de bootstrap
1. Plug-in de transição de bootstrap
O plug -in de transição fornece efeitos de transição simples. Se você deseja fazer referência à funcionalidade do plug -in individualmente, também precisará fazer referência ao transition.js, além de outros arquivos JS. Ou, como mencionado no capítulo Visão geral do plug -in Bootstrap, você pode consultar o bootstrap.js ou versões compactadas do bootstrap.min.js.
Transition.js é a classe auxiliar básica para eventos de transição e simulador de efeito de transição CSS. É usado por outros plug-ins para verificar o suporte ao efeito de transição CSS e obter efeito de transição.
Casos de uso
Casos de uso de plug-in de transição:
(1) Caixa de diálogo modal com slide ou efeito de desbotamento. Para exemplos específicos, consulte o plug-in (modal) da caixa de bootstrap (modal).
(2) Página de tags com efeito de desbotamento. Para exemplos específicos, consulte o plug-in da guia Bootstrap (TAB).
(3) Caixa de aviso com efeito de desbotamento. Para exemplos específicos, consulte o plug-in da caixa de aviso de Bootstrap (Alert).
(4) Placa de carrossel com efeito deslizante. Para exemplos específicos, consulte o plug-in do Bootstrap Carousel.
2. Bootstrap Modal Box (modal) plug-in
Uma caixa modal (modal) é um formulário infantil que é sobreposto no formulário pai. Normalmente, o objetivo é exibir o conteúdo de uma fonte separada, que pode ter alguma interação sem deixar o formulário pai. O subformato pode fornecer informações, interação, etc.
Se você deseja fazer referência à funcionalidade do plug -in separadamente, é necessário fazer referência ao modal.js. Ou, como mencionado no capítulo Visão geral do plug -in Bootstrap, você pode consultar o bootstrap.js ou versões compactadas do bootstrap.min.js.
(1) Uso
Você pode alternar o conteúdo oculto do plug -in modal da caixa (modal):
A. Através do atributo de dados: defina o atributo data-toggle = "modal" no elemento do controlador (como um botão ou link) e defina o Data-Target = "#Identifier" ou href = "#identificador" para especificar a caixa modal específica para alternar (com id = "identificador").
B. Através do JavaScript: Usando esta técnica, você pode chamar uma caixa modal com id = "identificador" através de uma linha simples de javascript:
$ ('#identificador'). Modal (opções)
<H2> Crie uma caixa modal (modal) </h2> <!-Button desencadeia uma caixa modal-> <botão data-toggle = "modal" data-target = "#mymodal"> comece a demonstrar uma caixa modal </button> <!-caixa modal (modal)-> <Div Id = "mymodal" Tabindx = 1! aria-hidden = "true"> <div> <div> <div> <button type = "button" data-dismiss = "modal" aria-hidden = "true"> × </button> <h4 id = "mymodallabel"> modal (modal) title (Modal) </h4> </div> type = "Button"> Enviar alterações </botão> </div> </div> </div> <!-/.modal-content-> </div> <!-/.modal-> </div>
Explicação de código:
A. Usando janelas modais, você precisa ter algum tipo de gatilho. Você pode usar botões ou links. Aqui estamos usando botões.
B. Se você observar o código acima com cuidado, encontrará que na tag <button>, data-target = "#mymodal" é o alvo da caixa modal que você deseja carregar na página. Você pode criar várias caixas modais na página e criar gatilhos diferentes para cada caixa modal. Agora, é óbvio que você não pode carregar vários módulos ao mesmo tempo, mas pode criar vários na página para carregar em momentos diferentes.
C. Dois pontos a serem observados na caixa modal:
O primeiro é .Modal, que é usado para reconhecer o conteúdo de <div> como uma caixa modal.
A segunda é a classe .Fade. Quando a caixa modal é alterada, ela faz com que o conteúdo desapareça.
D. ARIA-LABELLEDBY = "MyModallabel", esta propriedade se refere ao título da caixa modal.
E. A propriedade Aria-Hidden = "True" é usada para manter a janela modal invisível até que o gatilho seja acionado (como clicar no botão relevante).
F, <div>, o cabeçalho modal é uma classe que define estilos para a cabeça de uma janela modal.
G, Class = "Close", Close é uma classe CSS usada para estilizar o botão Fechar de uma janela modal.
H, Data-Dismiss = "Modal", é um atributo de dados HTML5 personalizado. Aqui é usado para fechar a janela modal.
I, class = "Modal-Body", é uma classe CSS de CSS de bootstrap, usada para estilizar o corpo de uma janela modal.
J, Class = "Modal-Footer", é uma classe CSS de CSS de bootstrap, usada para estilizar a parte inferior da janela modal.
K, Data-Toggle = "Modal", o atributo de dados personalizado HTML5 é usado para abrir uma janela modal.
(2) opções
Existem opções para personalizar a aparência e a sensação de uma janela modal, que são passadas pelas propriedades de dados ou JavaScript. A tabela a seguir lista estas opções:
(3) Método
Aqui estão alguns métodos úteis que podem ser usados com modal ().
(4) Evento
A tabela a seguir lista os eventos a serem usados na caixa modal. Esses eventos podem ser usados como ganchos nas funções.
3. Menu suspenso de bootstrap (suspensão) plug-in
O capítulo do menu suspenso Bootstrap explica o menu suspenso, mas não envolve a parte da interação. Este capítulo explicará a interação do menu suspenso em detalhes. Usando o plug -in suspenso, você pode adicionar menus suspensos a qualquer componente (como barras de navegação, guias, menus de navegação de cápsulas, botões, etc.).
Se você deseja fazer referência à funcionalidade do plug -in separadamente, é necessário fazer referência ao DropDown.js. Ou, como mencionado no capítulo Visão geral do plug -in Bootstrap, você pode consultar o bootstrap.js ou versões compactadas do bootstrap.min.js.
(1) Uso
Você pode alternar o conteúdo oculto do menu suspenso (suspensão) do plug -in:
Alterne o menu suspenso através do atributo de dados: adicione data-toggle = "suspenso" ao link ou botão.
A. Use o atributo de dados: adicione data-toggle = "suspenso" ao link ou botão para alternar o menu suspenso, como mostrado abaixo:
<div> <a data-toggle = "suspenso" href = "#"> gatilho suspenso </a> <ul role = "menu" aria-labelledby = "dlabel"> </ul> </div>
B. Se você precisar manter o link intacto (útil quando o navegador não habilitar o JavaScript), use a propriedade-alvo de dados em vez de href = "#":
<div> <a id = "dlabel" role = "button" data-toggle = "suspenso" data-target = "#" href = "/page.html"> menu suspenso (suspensão) </span> </a> <l Role = "menu" aria-labelledby = "dlabel> </ul>
C. Através do JavaScript: Ligue para o menu suspenso por JavaScript, use o seguinte método: $ ('. Dropados-toggle'). Dropados ()
(2) Método
Existe uma maneira fácil de mostrar ou ocultar o menu suspenso. $ (). Dropdown ('Alterne')
4. Bootstrap Scrollspy Plug-in
O plug-in Scroll Monitoring (ScrollSpy), ou seja, a atualização automática do plug-in de navegação, atualizará automaticamente o alvo de navegação correspondente de acordo com a posição da barra de rolagem. Sua implementação básica é adicionar a classe .Active à barra de navegação com base na posição da barra de rolagem enquanto você rola.
(1) Uso
Você pode adicionar o comportamento de escuta de rolagem à navegação superior:
A. Através do atributo de dados: adicione data-spy = "roll" ao elemento que você deseja ouvir (geralmente corpo). Em seguida, adicione o atributo Data-Target com o ID do elemento pai do componente .nav ou a propriedade da classe. Para que funcione corretamente, você deve garantir que haja elementos no corpo da página que correspondam ao ID do link que você deseja ouvir.
<corpo data-spy = "roll" data-target = ". Navbar-expler"> ... <div> <ul> ... </ul> </div> ... </body>
B. Através do JavaScript: Você pode chamar o monitoramento de rolagem através do JavaScript, selecione o elemento a ser ouvido e depois chamar a função .scrollspy ():
$ ('corpo'). scrollspy ({target: '.navbar-expler'})
(2) opções
Passou por atributos de dados ou javascript. A tabela a seguir lista estas opções:
(3) Método
.ScrollSpy ('Refresh'): Ao chamar o método ScrollSpy através do JavaScript, você precisa chamar o método .refresh para atualizar o DOM. Isso é útil quando qualquer elemento do DOM é alterado (ou seja, você adiciona ou remove alguns elementos). Aqui está a sintaxe para usar este método.
$ ('[data-spy = "scroll"]'). cada (function () {var $ spy = $ (this) .ScrollSpy ('refresh')})(4) Evento
A tabela a seguir lista os eventos a serem usados na escuta de rolagem. Esses eventos podem ser usados como ganchos nas funções.
5. TAB de bootstrap (guia) plug -in
As guias (guia) são introduzidas no capítulo de elementos de navegação Bootstrap. Ao combinar algumas propriedades de dados, você pode criar facilmente uma interface de guia. Com este plug-in, você pode colocar o conteúdo em uma página de guia ou uma página da guia Capsule ou até uma página de menu suspenso.
(1) Uso
Você pode ativar as páginas da guia de duas maneiras:
A. Através do atributo de dados: você precisa adicionar data-toggle = "tab" ou data-toggle = "pill" ao link de texto da âncora. A adição de classes NAV e NAV-TABS à UL aplicará o estilo de tag de bootstrap, adicionar classes de navegação e pílula de navegação à UL aplicará o estilo da cápsula de bootstrap.
<ul>
<li> <a href = "#identificador" data-toggle = "tab"> home </a> </li>
...
</ul>
B. Através do JavaScript: Você pode usar o JavaScript para ativar as páginas da guia, como mostrado abaixo:
$ ('#mytab a'). clique (function (e) {e.preventDefault () $ (this) .tab ('show')})O exemplo a seguir demonstra a ativação de guias individuais de diferentes maneiras:
// Selecione a página da guia $ ('#mytab a [href = "#perfil"]'). TAB ('show') // Selecione a primeira guia página $ ('#mytab a: primeiro'). Tab ('tabe') // Selecione a última guia Page $ ('#mytab a: last'). A '). TAB (' SHOW ')(2) Efeito desbotado
Se você precisar definir um efeito de desbotamento para a guia, adicione .Fade a cada pane .tab. A primeira guia deve ser adicionada com uma classe .in para desaparecer para exibir o conteúdo inicial, conforme mostrado no exemplo a seguir:
<div> <div id = "home"> ... </div> <div id = "svn"> ... </div> </div>
(3) Método
. $ (). Guia: Este método ativa elementos de guia e contêineres de conteúdo. A página da guia precisa usar um alvo de dados ou um href apontando para o nó do contêiner no DOM.
<l ul id = "mytab"> <li> <a href = "#identificador" data-toggle = "tab"> home </a> </li> ...../ul> <div> <div id = "home"> ... </div> .... </div> <cript> $ (function) {$ ('#mytab a: last).(4) Evento
A tabela a seguir lista os eventos a serem usados no plug -in do Tab (Tab). Esses eventos podem ser usados como ganchos nas funções.
6. Plug -in de ferramenta de ferramenta (ToolTip) de Bootstrap (ToolTip)
A dica de ferramenta é muito útil quando você deseja descrever um link. O plug -in Tooltip é inspirado no jQuery.tipsy escrito por Jason Frame. O plug-in da tampa de ferramentas fez muitas melhorias, como não confiar nas imagens, mas usar o CSS para obter efeitos de animação e usar atributos de dados para armazenar informações de título.
(1) Uso
O plug-in da tampa de ferramentas gera conteúdo e tags com base nas necessidades. Por padrão, a dica de ferramenta é colocada atrás de seus elementos de gatilho. Existem duas maneiras pelas quais você pode adicionar uma ferramenta rápida (ToolTip):
A. Através do atributo de dados: se você precisar adicionar uma ferramenta prompt (dica de ferramenta), basta adicionar data-toggle = "Tooltip" a uma tag de âncora. O título da âncora é o texto da ferramenta prompt (dica de ferramenta). Por padrão, o plug-in define a dica de ferramenta na parte superior.
<a href = "#" data-toggle = "Tooltip" title = "Exemplo de ferramenta"> Passe o mouse sobre o meu </a>
A. Através do JavaScript: Trigger the Prompt Tool (ToolTip) através do JavaScript: $ ('#Identifier'). ToolTip (Opções)
O plug-in da dica de ferramenta não é como os menus suspensos e outros plug-ins discutidos anteriormente, não é um plug-in puro do CSS. Para usar o plug -in, você deve ativá -lo usando o jQuery (leia JavaScript). Use o script a seguir para habilitar todas as ferramentas promissoras (dicas de ferramentas) na página:
$ (function () {$ ("[data-toggle = 'Tooltip']"). Tooltip ();});
<a href = "#" data-toggle = "Tooltip" Data-posting = "Left"> ToolTip à esquerda </a>. <a href = "#" data-toggle = "Tooltip" data-posting = "top"> Tooltip na parte superior </a>.
(2) opções
Existem algumas opções adicionadas através da API de dados do Bootstrap (API de dados do Bootstrap) ou chamado por JavaScript. A tabela a seguir lista estas opções:
(3) Método
Aqui estão alguns métodos úteis em plug-ins de dica de ferramentas:
(4) Evento
A tabela a seguir lista os eventos a serem usados no plug-in da dica de ferramenta. Esses eventos podem ser usados como ganchos nas funções.
7. Bootstrap Popover plug-in
Uma popover é semelhante a uma dica de ferramenta, fornecendo uma visualização estendida. Para ativar a caixa pop-up, o usuário só precisa pairar sobre o elemento. O conteúdo da caixa pop-up pode ser totalmente preenchido usando a API de dados de bootstrap (Bootstrap Data API). Este método depende de dicas de ferramentas. Se você deseja fazer referência à funcionalidade do plug -in separadamente, é necessário fazer referência a Popover.js, que depende do plug -in da dica de ferramenta.
(1) Uso
O plug -in do Popover gera conteúdo e tags com base nas necessidades. Por padrão, as popovers são colocadas atrás de seus elementos de gatilho. Você pode adicionar popovers de duas maneiras:
A. Através do atributo de dados: se você deseja adicionar um popover, basta adicionar data-toggle = "popover" a uma etiqueta âncora/botão. O título da âncora é o texto do popover. Por padrão, o plug -in define o popover na parte superior.
<a href = "#" data-toggle = "popover" title = "exemplo popover">
Por favor, passa o mouse acima de mim
</a>
B. Através do JavaScript: Ativar Popover (Popover) através do JavaScript: $ ('#Identifier'). Popover (Opções)
O plug-in Popover não é como os menus suspensos e outros plug-ins discutidos anteriormente, não é um plug-in puro do CSS. Para usar o plug -in, você deve ativá -lo usando o jQuery (leia JavaScript). Use o script a seguir para ativar todos os popovers da página:
$ (function () {$ ("[Data-toggle = 'Popover']"). Popover ();});
<button type = "Button"
data-container = "body" data-toggle = "popover" data-posting = "esquerda" dados-content = "algum conteúdo em popover à esquerda" > povover à esquerda
</button>
(2) opções
Existem algumas opções adicionadas através da API de dados do Bootstrap (API de dados do Bootstrap) ou chamado por JavaScript. A tabela a seguir lista estas opções:
(3) Método
Aqui estão alguns métodos úteis em plugins de popover:
(4) Evento
A tabela a seguir lista os eventos a serem usados no plug-in pop-up (Popover). Esses eventos podem ser usados como ganchos nas funções.
8. Caixa de aviso de bootstrap (alerta) plug-in
As mensagens de alerta são usadas principalmente para querer que o usuário final exiba informações como mensagens de aviso ou confirmação. Usando o plug -in de alerta, você pode adicionar um recurso cancelável a todas as mensagens da caixa de aviso.
(1) Uso
Você pode permitir a função de demissão da caixa de aviso nas duas maneiras a seguir:
A. Através dos atributos de dados: adicione uma função cancelável através da API de dados (API de dados). Basta adicionar data-Dismiss = "Alert" ao botão Fechar, e a função de fechamento será adicionada automaticamente à caixa de aviso.
<a data-dismiss = "alert" href = "#" aria-hidden = "true">>
×
</a>
B. Através do JavaScript: Adicione funções canceladas através do JavaScript: $ (". Alert"). Alert ()
<div> <a href = "#" data-dismiss = "alert"> × </a> <strong> aviso! </strong> Sua conexão de rede tem um problema. </div>
(2) Método
Aqui estão alguns métodos úteis no plugin de alerta:
(3) Evento
A tabela a seguir lista os eventos a serem usados no plug-in de alerta. Esses eventos podem ser usados como ganchos nas funções.
9. Plugin de botão de bootstrap
Com o plug -in de botão, você pode adicionar algumas interações, como controlar o status do botão ou criar grupos de botões para outros componentes, como barras de ferramentas.
(1) status de carregamento
Para adicionar status de carregamento ao botão, basta adicionar dados de carregamento de dados = "Carregando ..." ao elemento do botão como atributo.
<botão id = "Fat-btn" Data-carregamento-text = "carregamento ..." type = "button"> status de carregamento </button> <cript> $ (function () {$ (". </script>(2) interruptor único
Para ativar a troca de um único botão (ou seja, alterar o estado normal do botão para o estado da imprensa e vice-versa), basta adicionar data-toggle = "botão" ao elemento do botão como atributo.
<button type = "button" data-toggle = "button"> switch único </botão>
(3) Caixa de seleção
Você pode criar um grupo de caixa de seleção e adicionar uma alternância ao grupo de caixa de seleção adicionando o atributo de dados data-toggle = "botões" ao grupo BTN.
<Divdata-toggle = "Buttons"> <Beatch> <input type = "Caixa de seleção"> Opção 1 </Label> <belt> <input type = "Caixa de seleção"> Opção 3 </Label> </div>
(4) botão de rádio (rádio)
Da mesma forma, você pode criar um grupo de botões de rádio e adicionar uma alternância para o grupo de botões de rádio adicionando o Data Attribute Data-Toggle = "Botões" ao grupo BTN.
(5) Método
Aqui estão alguns métodos úteis nos plugins de botão:
10. Bootstrap Collapse Plug-in
O plug -in de colapso facilita a dobra da área da página. Se você o usa para criar uma navegação em colapso ou um painel de conteúdo, ele permite muitas opções de conteúdo.
(1) Crie um painel dobrável ou dobrável dobrável, como mostrado abaixo:
<div id = "acordeão"> <div> <div> <h4> <a data-toggle = "colapso" data-parent = "#acordeion" href = "#colapsone"> clique em mim para expandir, clique em mim para entrar em colapso novamente. Parte 1 </a> </h4> </div> <div id = "colapsone"> <div> nihil anim keffiyeh helvetica, cerveja artesanal wes anderson credit nesciunt sapientte ea proident. AD VEGAN, exceto o vice -vice -lomo. </div> </div> </div> </div>
A. data-toggle = "colapso" adicionar ao link do componente que você deseja expandir ou colapso.
A propriedade B, HREF ou alvo de dados é adicionada ao componente pai e seu valor é o ID do componente filho.
C. A propriedade dos pais de dados adiciona o ID do painel dobrado ao link do componente a ser expandido ou colapsado.
(2) Crie um componente dobrável simples sem a etiqueta de acordeão, como mostrado abaixo:
<button type = "button" data-toggle = "colapso" data-alget = "#demonstração"> componente dobrável simples </butut> <div id = "Demo"> nihil anim keffiyeh helvetica, cerveja artesanal wes anderson cred nesciunt saestee ea proident. Ad vegan, exceto o vice -lomo de açougueiro. </div>
(3) Uso
A tabela a seguir lista o plug-in de colapso para lidar com a escala pesada:
Você pode usar o plug -in de colapso de duas maneiras:
A. Através do atributo de dados: adicione data-toggle = "colapso" e alvo de dados ao elemento para atribuir automaticamente controles aos elementos dobráveis. A propriedade-alvo de dados aceita um seletor CSS e aplica um efeito de colapso. Certifique -se de adicionar classe .collapse ao elemento dobrável. Se você deseja que seja por padrão, adicione uma classe extra .in.
Para adicionar um gerenciamento dobrado de agrupamento semelhante ao painel ao controle dobrável, adicione o Data Property Data-Parent = "#Selector".
B. Através do JavaScript: O método de colapso pode ser ativado por meio de JavaScript, como mostrado abaixo: $ ('. Colapso'). COLLAPSE ()
11. Bootstrap Carousel Plugin
O plug-in de bootstrap carousel é uma maneira flexível e responsiva de adicionar controles deslizantes a um site. Além disso, o conteúdo é flexível o suficiente para ser uma imagem, um quadro incorporado, um vídeo ou qualquer outro tipo de conteúdo que você queira colocar.
<div id = "mycarousel"> <!-Indicador de carrossel-> <Ol> <li data-target = "#mycarousel" data-slide-to = "0"> </li> <li data-target = "#myCarousel" Data-slide-to = "1"> <cli> <li> Data-target = "# <!-Projeto de carrossel-> <div> <img src = "/wp-content/uploads/2014/07/slide1.png"> <div> título 1 </div> </div> <div> <img src = "/wp-content/uploads/2014/07/slide src = "/wp-content/uploads/2014/07/slide3.png"> <div> Título 3 </div> </div> </div> <!-navegação carrossel-> <a href = "#myCarousel" mycarous "mycarous" mycarous "#mycarous"#mycarous "#mycarous"#mycarous "#mycarous"#mycarous "#mycarousel"#"
(1) Uso
A. Através do atributo de dados: Usando atributos de dados, é fácil controlar a posição do carrossel.
O deslizamento de dados da propriedade aceita a palavra-chave Anterior ou a próxima para alterar a posição do slide em relação à posição atual.
Use o slide de dados para um índice de deslizamento bruto na parte inferior do leito do carrossel. Data-slide-to = "2" moverá o controle deslizante para um índice específico, e o índice conta de 0.
A propriedade Data-ride = "carousel" é usada para marcar o carrossel que inicia a reprodução de animação quando a página é carregada.
B. Através do JavaScript: O carrossel pode ser chamado manualmente através do JavaScript, como mostrado abaixo: $ ('. Carrossel'). Carousel ()
(2) opções
Existem algumas opções que são passadas pelas propriedades de dados ou JavaScript. A tabela a seguir lista estas opções:
(3) Método
Aqui estão alguns métodos úteis em plug-ins de carrossel:
(4) Evento
A tabela a seguir lista os eventos a serem usados no plug-in do carrossel. Esses eventos podem ser usados como ganchos nas funções.
12. Plug-in adicional de navegação de bootstrap (Affix)
O plug -in adicional de navegação (afix) permite que um <div> seja fixado em algum lugar da página. Você também pode alternar entre ativar ou desligar o plug -in. Um exemplo comum são os ícones sociais. Eles começarão em algum lugar, mas quando a página clicar em uma marca, o <div> travará em algum lugar e não rolará junto com o restante da página.
(1) Uso
Você pode usar o plug-in de navegação (afix) anexado por meio de propriedades de dados ou via JavaScript.
Através dos atributos de dados: se você precisar adicionar um comportamento adicional de navegação (afixo) ao elemento, você só precisará adicionar dados-spy = "afixar" ao elemento que você precisa ouvir. Use desvios para definir ao alternar o bloqueio e o movimento dos elementos.
(2) Através do JavaScript: Você pode adicionar manualmente a navegação adicional (afixo) a um elemento através do JavaScript, como mostrado abaixo:
$ ('#myAffix'). Afix ({offset: {top: 100, inferior: function () {return (this.bottom = $ ('. bs-footer').(3) posicionamento através de CSS
Nas duas maneiras acima para usar o plug-in de afix, você deve localizar o conteúdo via CSS. A navegação adicional (afix) troca entre três classes, cada uma das quais apresenta um estado específico: .fafix, .fafix-top e .affix-bottom. Siga as etapas abaixo para configurar seu próprio CSS para esses três estados (não confiando neste plug -in).
A. No início, o plug-in adiciona .fafix-top para indicar o elemento na posição superior. Nenhum posicionamento CSS é necessário no momento.
B. Ao percorrer o elemento que adiciona navegação adicional (afixo) deve ser acionado. Neste momento, o .Affix substituirá .fafix-top e definirá a posição: corrigido; (fornecido pelo código CSS da Bootstrap).
C. Se o deslocamento inferior for definido, quando o pergaminho atingir essa posição, substitua .fixo pelo .ffix-Bottom. Como o deslocamento é opcional, se o deslocamento estiver definido, é necessário que um CSS apropriado seja definido ao mesmo tempo. Nesse caso, adicione posição: absoluto; se necessário.
(4) opções
Existem algumas opções que são passadas pelas propriedades de dados ou JavaScript. A tabela a seguir lista estas opções:
Este artigo foi compilado no "Tutorial de uso de plug -in de Bootstrap", e todos são convidados a aprender e ler.
O exposto acima é todo o conteúdo deste artigo. Espero que seja útil para o aprendizado de todos e espero que todos apoiem mais o wulin.com.