Easy HTML Tricks for Blogging: html

#	Make	Model	Year
1	Honda	Accord	2009
2	Toyota	Camry	2012
3	Hyundai	Elantra	2010

Yeah!! Milligram is amazing.

Unordered list item 1
Unordered list item 2

Ordered list item 1
Ordered list item 2

Description list item 1: Description list item 1.1

Name Age Range Comment

Send a copy to yourself

Name	Age	Height	Location
Stephen Curry	27	1,91	Akron, OH
Klay Thompson	25	2,01	Los Angeles, CA

.column

.column column-50 column-offset-25

10%

20%

25%

33%

40%

50%

60%

67%

75%

80%

90%

100%

the code

<link rel="apple-touch-icon" href="images/apple-touch-icon.png" sizes="180x180"><link rel="icon" href="images/favicon-32x32.png" sizes="32x32"><link rel="icon" href="images/favicon-16x16.png" sizes="16x16"><link rel="manifest" href="manifest.json"><link rel="image_src" href="images/thumbnail.png"><link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:300,300italic,700,700italic"><link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/5.0.0/normalize.css"><link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/milligram/1.3.0/milligram.min.css">
<blockquote>
  <p><em>Yeah!! Milligram is amazing.</em></p>
</blockquote>

<a class="button" href="#">Default Button</a>


<button class="button button-outline">Outlined Button</button>


<input class="button button-clear" type="submit" value="Clear Button">

<ul>
  <li>Unordered list item 1</li>
  <li>Unordered list item 2</li>
</ul>


<ol>
  <li>Ordered list item 1</li>
  <li>Ordered list item 2</li>
</ol>


<dl>
  <dt>Description list item 1</dt>
  <dd>Description list item 1.1</dd>
</dl>

<form>
  <fieldset>
    <label for="nameField">Name</label>
    <input type="text" placeholder="CJ Patoilo" id="nameField">
    <label for="ageRangeField">Age Range</label>
    <select id="ageRangeField">
      <option value="0-13">0-13</option>
      <option value="14-17">14-17</option>
      <option value="18-23">18-23</option>
      <option value="24+">24+</option>
    </select>
    <label for="commentField">Comment</label>
    <textarea placeholder="Hi CJ …" id="commentField"></textarea>
    <div class="float-right">
      <input type="checkbox" id="confirmField">
      <label class="label-inline" for="confirmField">Send a copy to yourself</label>
    </div>
    <input class="button-primary" type="submit" value="Send">
<br>

<table>
  <thead>
    <tr>
      <th>Name</th>
      <th>Age</th>
      <th>Height</th>
      <th>Location</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>Stephen Curry</td>
      <td>27</td>
      <td>1,91</td>
      <td>Akron, OH</td>
    </tr>
    <tr>
      <td>Klay Thompson</td>
      <td>25</td>
      <td>2,01</td>
      <td>Los Angeles, CA</td>
    </tr>
  </tbody>
</table>
  </fieldset>
</form>
<br>

<div class="container">

  <div class="row">
    <div class="column">.column</div>
    <div class="column">.column</div>
    <div class="column">.column</div>
    <div class="column">.column</div>
  </div>

  <div class="row">
    <div class="column">.column</div>
    <div class="column column-50 column-offset-25">.column column-50 column-offset-25</div>
  </div>

</div>

<br></br>
<div class="container">

  <div class="row">
    <div class="column column-10">10%</div>
  </div>

  <div class="row">
    <div class="column column-20">20%</div>
  </div>

  <div class="row">
    <div class="column column-25">25%</div>
  </div>

  <div class="row">
    
    <div class="column column-33">33%</div>
  </div>

  <div class="row">
    <div class="column column-40">40%</div>
  </div>

  <div class="row">
    <div class="column column-50">50%</div>
  </div>

  <div class="row">
    <div class="column column-60">60%</div>
  </div>

  <div class="row">
    
    <div class="column column-67">67%</div>
  </div>

  <div class="row">
    <div class="column column-75">75%</div>
  </div>

  <div class="row">
    <div class="column column-80">80%</div>
  </div>

  <div class="row">
    <div class="column column-90">90%</div>
  </div>

  <div class="row">
    <div class="column">100%</div>
  </div>
</div>

How to make blogger post private?
How to encrypt blogger post?
How to create blog post with password?

First, please proceed to http://www.vincentcheung.ca/jsencryption/instructions.html.

Go to Dashboard > Design > Edit HTML.

Then add the JavaScript decryption code after the <head> tag in the HTML code of your blog. Copy and paste the following code:

Then proceed to http://www.vincentcheung.ca/jsencryption/.

You'll see this page.

form empty

Then type for secret key at the "Key" area and the secret message at the "Plain Text" area.

filled form

After doing so, hit the Encrypt button under the "Plain Text" area.

Then scroll down a little and you'll see the "HTML Code" area. Highlight, copy and paste the HTML code into your POST EDITOR.

And that's it!

Here's the result of the example shown. The secret key is "password". Go and click on it.

Show encrypted text

Easy HTML Tricks for Blogging

Using Pure CSS framework to make table

CSS framework Examples Post using to Blogger

Using Javascript Encryption and Decryption to Hide Secret Message

Add Revolvermaps to Your Widget