How to create template for my own page?

Here is an example.

1) Register your page with hook_menu():

function MYMODULE_menu()
{
  $menu['path/to/page'] = array
  (
    'title' => 'My Page',
    'page callback' => 'MYMODULE_my_page',
    'access callback' => TRUE,
  );
  return $menu;
}

2) Create your data for your page in your page callback. Set '#theme' to be the theme for your page. Attach your CSS in the #attached property of the render array you return from the callback:

function MYMODULE_my_page()
{
  // Create some data
  $data = array
  (
    '#markup' => t('This is the data for my page'),
    '#prefix' => '<div id="my_page_data">',
    '#suffix' => '</div>',
  );

  // Create a $page render array that will be returned
  // from your callback. Attach the CSS using the #attached
  // element of this array
  $page = array
  (
    'MYMODULE_my_page' => array
    (
      // Note - we will register theme_my_page in the next step
      '#theme' => 'my_page',
      '#contents' => $data,
    ),
    '#attached' => array
    (
      'css' => array
      (
        array
        (
          'type' => 'file',
          'data' => drupal_get_path('module', 'MYMODULE') . '/css/my_page.css',
        ),
      ),
    ),
  );

  return $page;
}

3) Register your theme function in hook_theme():

function MYMODULE_theme()
{
  return array
  (
    'my_page' => array
    (
      'variables' => array('contents' => array()),
      // Register the template my-page.tpl.php
      'template' => 'my-page', // don't add .tpl.php
    ),
  );
}

4) Create your template (my-page.tpl.php)

<h2><?php print t('My Page'); ?></h2>
<div id="my_page_wrapper">
  <?php print render($contents); ?>
</div>

5) Add any CSS in MODULEFOLDER/css/my_page.css

#my_page_wrapper
{
  width:80%;
  margin:0 auto;
}