I can't seem to understand how states work and named

I have started an ionic projects based on tabs template.
in the app.js file, an abstract state is created called tab. I understand the abstract state.
So we have a state called tabs, that has a template from which all the states named tabs.something inherit.

I want to create a new abstract state I called posts.
so I did this :

 .state('posts', {
    url: '/posts',
    abstract: true,
    templateUrl: 'templates/posts.html'
  .state('posts.list', {
      url: '/category/:CategoryId',
      templateUrl: 'templates/posts-list.html',
      controller: 'postListCtrl'

The app beaks.
Many questions raised :

Is it even possible to have multiple abstract states?
Are there any specifications to add in my templates to make it work?

Thanks a lot

Do your posts.html have some markups similar to the tabs.html so you can make the nav based on it ?

Edit: Visit that link --> https://github.com/angular-ui/ui-router/wiki/Nested-States-%26-Nested-Views#abstract-states

What is the general structure of a template ? I want post.html to only list some posts, no tabs.