html+CSS 课程

第一天

工具:Brackets   插件1:Emmet  自动补全    插件2:  Beautify 格式化

Brackets快捷键

插入注释:Ctrl+Shift+/

块注释:Ctrl+Shift+E

当前行注释:Ctrl+/

关闭Brackets:Ctrl+Q

关闭现在文件:Ctrl+W

搜索:Ctrl+F

替换:Ctrl+H

字选择:Ctrl+B

复制行:Ctrl+D

列移动:Ctrl+G

选择 添加:Alt+Shift+(上,下)

锁紧:Ctrl+]

突出:Ctrl+[

格式化:Ctrl+A,Ctrl+Shift+L

 1     <h1>有h1~h6,但是常用的只有 h1~h3</h1>
 2 
 3     <p>换行 有前后行</p>
 4     <br>换行 没有前后行
 5     <b>仅仅是粗体</b>
 6     <strong>强调的粗体</strong>
 7     <i>仅仅是斜体italy</i>
 8     <address>地址斜体</address>
 9     <em>强调的斜体</em>
10     <blockquote>"没法选择</blockquote>
11     <p>"可以选择</p>
12     <sup>科学公式上面小</sup>
13     <sub>科学公式下面小</sub>
14     <hr> 横线
15     <abbr title="提示内容">文字下面有点</abbr>
16     <del>删除线</del>
17     <ins>下划线</ins>
18     <ul>
19         标示无顺序列表
20         <li>列表内容</li>
21     </ul>
22     <ol>
23         有顺序列表 可配type属性和 start属性
24         <li>列表内容</li>
25     </ol>
26 
27     <dl>
28         字典类型列表
29         <dt>标题</dt>
30         <dd>内容</dd>
31     </dl>
32 
33     <img src="/xx.jpg" alt="没有图片时显示内容">
34     <img src="/xx.jpg" alt="没有图片时显示内容" width="300px" title="鼠标在图片上提示内容"> 也可以改成百分比width="50%"
35     <img src="/xx.jpg" alt="没有图片时显示内容" usemap="#buy_link">
36     <map name="buy_link">
37         <area shape="rect" coords="38,27,431,568" href="http://www.naver.com" alt="" target="_blank">
38         矩形 shape="rect" coords="4个坐标"
39         <area shape="circ" coords="129,161,10" href="http://www.daum.net" alt="" target="_blank">
40         圆形 图像左上角的坐标x,y,圆形半径r
41         多边形shape="polygon"
42     </map>
43 
44     <a href="xxx.html">显示内容</a>
45     <a href="mailto:[email protected]">发邮件</a>
46     <a href="tel:02000001111">打电话</a>
47     <a href="sms:010-5555-666">发短信</a>
48 
49     <a href="http://www.naver.com" target="_self">在本页面打开</a>
50     <a href="http://www.naver.com" target="_blank">在新的页面打开</a>
51     <a href="http://www.naver.com" target="_parent">用在框架里上面打开</a>
52     <a href="http://www.naver.com" target="_top">用在框架里在整个窗口内打开</a>
53 
54     <li><a href="#m1">跳转到被页面内id为m1的位置</a></li>
55     <h2 id="m1">id为m1的标题</h2>
56     <p>内容</p>
57 
58     <li><a href="#">刷新,跳转到最上面</a></li>
59 
60 
61     <table border="1" width="300"> 表格
62         <tr>63             <td>1月</td>64             <td>2月</td>
65             <td>3月</td>
66             <td>4月</td>
67         </tr>
68 
69         <tr>70             <td>1月</td>
71             <td>2月</td>
72         </tr>
73     </table>
74 
75     <table width="280" border="1">
76         <tr>
77             <th>标题 粗体</th>
78             <th>周六</th>
79             <th>周日</th>
80         </tr>
81         <tr>
82             <th>数量</th>
83             <td>120</td>
84             <td>135</td>
85         </tr>
86         <tr>
87             <th>销量</th>
88             <td>$600</td>
89             <td>$675</td>
90         </tr>
91     </table>

猜你喜欢

转载自www.cnblogs.com/kingboy100/p/12686904.html