CSS, JS Text Editor


.t-text-editor {
	*{
		max-width: 100%;
	}

	h1 {
		@include font_72;
	}
	h2 {
		@include font_64;
	}
	h3 {
		@include font_48;
	}
	h4 {
		@include font_36;
	}
	h5 {
		@include font_24;
	}
	h6 {
		@include font_18;
	}

	blockquote {
		margin: 0 0 1.25em;
		padding: 0 1.25em 0 1.875em;
		border-left: 2px solid #111;
		font-style: italic;
	}
	
	p {
		margin-bottom: 10px;
	}
	img {
		max-width: 100%;
		height: auto !important;
	}
	iframe{
		max-width: 100%;
	}

	.box-iframe {
		position: relative;
		height: 0;
		overflow: hidden;
		padding-bottom: 26.2%;
		padding-top: 30%;

		iframe {
			position: absolute;
			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
		}
	}
	
	table{
		width: 100%;
	}

	i{
		font-style: italic;
	}

	u{
		text-decoration: underline;
	}

	a{
		text-decoration: underline;
	}

	b,
	strong{
		font-weight: bold;
	}
	ul{
		padding-left: 30px;
		list-style-type: disc;
		
		li{
			display: list-item;
			list-style-type: disc;
		}
	}
	
	ol{
		padding-left: 30px;
		list-style-type: decimal;

		li{
			display: list-item;
			list-style-type: decimal;
		}
	}

	blockquote {
		border-left: 5px solid #000;
	}
}

JS add div has class "table-responsive"

	
$(document).ready(function() {
	if($(".t-text-editor").length > 0) {
		$(".t-text-editor table").wrap(" <div class='table-responsive'> Add Code here </div>");
		$(".t-text-editor iframe").wrap("Add Code here");
	}
});

Tiêu đề H1

Tiêu đề H2

Tiêu đề H3

Tiêu đề H4

Tiêu đề H5
Tiêu đề H6

Test tag strong

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Architecto quae eveniet consequuntur minima ad incidunt, delectus fuga explicabo saepe similique odit voluptates maxime repudiandae porro quis impedit vitae neque. Atque?


Test tag image

Test tag iframe youtube

Test color inline

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Enim, sunt ipsum perspiciatis quae veritatis quidem qui. Cupiditate libero dicta rem nam voluptatum nesciunt, delectus distinctio similique obcaecati explicabo expedita fugit.


Test tag ul

  • Lorem ipsum dolor sit amet, consectetur adipisicing elit.
  • Lorem ipsum dolor sit amet, consectetur adipisicing elit.
  • Lorem ipsum dolor sit amet, consectetur adipisicing elit.

Test tag ol

  1. Lorem ipsum dolor sit amet, consectetur adipisicing elit.
  2. Lorem ipsum dolor sit amet, consectetur adipisicing elit.
  3. Lorem ipsum dolor sit amet, consectetur adipisicing elit.

Test tag u i b
  • Thẻ u
  • Thẻ i
  • Thẻ b

Test nội dung có thẻ a

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusamus incidunt quidem sed asperiores ipsam, culpa, distinctio eligendi! Deleniti numquam aliquam beatae, culpa in itaque facilis, asperiores tempore amet enim repellendus? Xem thêm


Test tag table responsive

TÊN DỊCH VỤ GIÁ GỐC
Trẻ hóa da với công nghệ Oxy Jet 700.000 vnđ
Trẻ hóa da với công nghệ New E-Light 800.000 vnđ
title 1 title 2 title 3 title 4 title 5 title 6
content 1 content 2 content 3 content 4 content 5 content 6
content 1 content 2 content 3 content 4 content 5 content 6


Tag blockquote
Lorem ipsum dolor sit amet consectetur adipisicing elit. Aut excepturi eveniet dolorum nulla incidunt quis fugiat, dicta fugit. Quisquam nihil ut debitis consectetur natus ab quam, eaque atque iure quibusdam?