Zen Coding در Visual Studio 2012
نویسنده: مهدی سعیدی فر
تاریخ: ۱۳۹۲/۰۵/۲۲ ۱۸:۵
آدرس: www.dntips.ir
| مطالب | ۳۶۹۴ |
| نویسندگان | ۲۷۶ |
| گروههای مطالب | ۱۰۲۴ |
| نقشههای راه | ۱۱۹ |
| دورهها | ۱۴ |
| اشتراکها | ۱۷۹۱۴ |
table#tblUsers.table.table-striped.table-bordered.table-hover>thead>tr>th{row}+th{Name}+th{Last Name}+th{Operations}^^tbody>tr*6>(td{row}+td{FirstName}+td{LastName}+td>button.btn.btn-primary{Edit}+button.btn.btn-danger{Delete})<table id="tblUsers" class="table table-striped table-bordered table-hover">
<thead>
<tr>
<th>row</th>
<th>Name</th>
<th>Last Name</th>
<th>Operations</th>
</tr>
</thead>
<tbody>
<tr>
<td>row</td>
<td>FirstName</td>
<td>LastName</td>
<td>
<button>Edit</button>
<button>Delete</button></td>
</tr>
<tr>
<td>row</td>
<td>FirstName</td>
<td>LastName</td>
<td>
<button class="btn btn-primary">Edit</button>
<button class="btn btn-danger">Delete</button></td>
</tr>
<tr>
<td>row</td>
<td>FirstName</td>
<td>LastName</td>
<td>
<button class="btn btn-primary">Edit</button>
<button class="btn btn-danger">Delete</button></td>
</tr>
<tr>
<td>row</td>
<td>FirstName</td>
<td>LastName</td>
<td>
<button class="btn btn-primary">Edit</button>
<button class="btn btn-danger">Delete</button></td>
</tr>
<tr>
<td>row</td>
<td>FirstName</td>
<td>LastName</td>
<td>
<button class="btn btn-primary">Edit</button>
<button class="btn btn-danger">Delete</button></td>
</tr>
<tr>
<td>row</td>
<td>FirstName</td>
<td>LastName</td>
<td>
<button class="btn btn-primary">Edit</button>
<button class="btn btn-danger">Delete</button></td>
</tr>
</tbody>
</table>ul>li[ng-repeat="user in Users"]>p[ng-bind="{{user.UserName}}"]+a{Details}<ul>
<li ng-repeat="user in Users">
<p ng-bind="{{user.UserName}}"></p>
<a href="">Details</a>
</li>
</ul><!-- Type this --> div.container <!-- Creates this --> <div class="container"></div>
<!-- Type this --> ul#userList <!-- Creates this --> <ul id="userList"></ul>
<!-- Type this --> div.container#wrapper <!-- Creates this --> <div class="container" id="wrapper"></div>
<!-- Type this --> button.btn.btn-primary <!-- Creates this --> <button class="btn btn-primary"></button>
<!-- Type this --> .container <!-- Creates this --> <div class="container"></div>
<!-- Type this -->
div.container>div#header
<!-- Creates this -->
<div class="container">
<div id="header"></div>
</div><!-- Type this -->
div.navbar>div.navbar-inner>ul.navbar
<!-- Creates this -->
<div class="navbar">
<div class="navbar-inner">
<ul class="navbar"></ul>
</div>
</div><!-- Type this --> div[title] <!-- Creates this --> <div title=""></div>
<!-- Type this --> input[type="text" placeholder="First Name"] <!-- Creates this --> <input type="text" value="" placeholder="First Name" />
<!-- Type this -->
ul[ng-repeat="user in Users"]>li[ng-model="user.FirstName"]
<!-- Creates this -->
<ul ng-repeat="user in Users">
<li ng-model="user.FirstName"></li>
</ul>{} متن (Text)
این عملگر، متن مورد نظر شما را داخل عنصر قرار میدهد.
<!-- Type this -->
div>h1{My Title}
<!-- Creates this -->
<div>
<h1>My Title</h1>
</div><!-- Type this -->
form>input[type="text"]+input[type="checkbox"]
<!-- Creates this -->
<form>
<input type="text" value="" />
<input type="checkbox" value="" />
</form><!-- Type this -->
div#header>img+h1{Title}
<!-- Creates this -->
<div id="header">
<img src="" alt="" />
<h1>Title</h1>
</div><!-- Type this -->
table>thead>tr>th{row}^^tbody>tr>td{row1}
<!-- Creates this -->
<table>
<thead>
<tr>
<th>row</th>
</tr>
</thead>
<tbody>
<tr>
<td>row1</td>
</tr>
</tbody>
</table><!-- Type this -->
ul>li*3>p{Hello}
<!-- Creates this -->
<ul>
<li>
<p>
Hello
</p>
</li>
<li>
<p>
Hello
</p>
</li>
<li>
<p>
Hello
</p>
</li>
</ul><!-- Type this -->
(div.container>h1{title}+div.content{Some Text Here})*2
<!-- Creates this -->
<div class="container">
<h1>title</h1>
<div class="content">
Some Text Here
</div>
</div>
<div class="container">
<h1>title</h1>
<div class="content">
Some Text Here
</div>
</div><!-- Type this -->
ul>li*2>p{item $}
<!-- Creates this -->
<ul>
<li>
<p>
item 1
</p>
</li>
<li>
<p>
item 2
</p>
</li>
</ul><!-- Type this -->
ul>li*2>p{item $$$}
<!-- Creates this -->
<ul>
<li>
<p>
item 001
</p>
</li>
<li>
<p>
item 002
</p>
</li>
</ul><!-- Type this -->
div>(header>div)+section>(ul>li*2>a)+footer>(div>span)
<!-- Creates this -->
<div>
<header>
<div></div>
</header>
<section>
<ul>
<li><a href=""></a></li>
<li><a href=""></a></li>
</ul>
<footer>
<div>
<span></span>
</div>
</footer>
</section>
</div><!-- Type this -->
div>(h1>lorem5)+(h3>lorem3)
<!-- Creates this -->
<div>
<h1>Lorem ipsum dolor sit amet.</h1>
<h3>Lorem ipsum dolor.</h3>
</div>