HTML5

一、

单标签 <hr /><br /><img src=""/>

标题标签 <h1/>-----<h6/>

语义化标签  header,  footer,  a ,  ul ol dl自定义列表   img

 

 1 <header></header>
 2         <footer></footer>
 3         
 4         <a href="#">#</a> #自动跳转到页面顶部
 5         <a href="javascript:void(0)">js</a>
 6         
 7         <img src="指定图片地址" alt="alt" title="title鼠标放上去显示"/>
 8         
 9         <!-- ul ol dl自定义列表-->
10         <!--ul>li{列表$}*3 点击tap键-->
11         <ul type="square">
12             <li></li>
13             <li></li>
14             <li></li>
15         </ul>
16         
17         <ol type="I">
18             <li>列表1</li>
19             <li>列表2</li>
20             <li>列表3</li>
21         </ol>
22         
23         <dl>
24             <dt>项目1</dt>
25             <dd>内容1</dd>
26         </dl>

table标签

 tr元素定义单元格行 

 th元素定义表头  

td元素定义表格单元

1 <table>
2             <thead>标题</thead>
3             <tbody>
4                 <tr>
5                     <td>数据</td>
6                 </tr>
7             </tbody>
8             <tfoot>注释</tfoot>
9         </table>

from标签

1 <form action="#" method="post">
2 <!--
3             method:
4             get post:
5             post传递性更安全、大小不一样
6             name
7 -->

二、选择器

1.基础选择 tag  #id   .class ,  *
2.层次选择器
           空格   所有子代
           >        第一代
           +        第一个兄弟节点
           ~       后面的所有兄弟节点

3.表单选择器:type属性

4.属性过滤器[]
         [attr] 包含这个属性
         [attr=val] 属性值=val
         [attr~=val] 属性值包含指定词汇的元素
         [attr|=val] 用于选取带有以指定值开通的属性值的元素，该值必须是整个单词
         [attr*=val] 属性值包含指定值的每元素
         [attr^=val] 属性值以val开始
         [attr$=val] 属性值以val结尾
优先级 正常情况下 选择范围越大 优先级越低  ，，否则 !important 特别重要

 

1     a[href*='void']{
2                 color: lightblue;
3             }
4     a[href='#']{
5                 color: lightcoral;
6             }

a标签不跳转死链接

1 <a href="#">A</a>
2 <a href="javacript:void(0)">A</a>

“#”有一个缺点，如果页面很长的话，会跳到本页面的顶部，有点像是跳到了一个新页面的感觉，体验不是很好！

 

posted @ 2021-10-25 19:55  .Nice  阅读(59)  评论(0)    收藏  举报