HTML基础

先把我今天学的东西总结一下吧

一今天下午学了的标签有：

1标签对的有

    Div   span  P  a  ul li  ul-ol  dl-dt

 Div：块标签，块标签可以设置宽度高度且可以独占一行。默认属性display block

 Span：行标签，行标签不能独占一行且不能设置高度。默认属性 display inline

 P：段落标签可以存放文字等

 a：超链接标签

 ul li 无序列表标签

 ul ol 有序列表标签

 dl td 自定义标签

 

2单标签：

    Br  hr  img

 br 换行标签

 Hr创建一条水平线标签

 Img 添加图片标签

 

 

二Emment  HTML的快捷写法

（父子关系嵌套，子标签会继承父标签 宽度高度是由 内容撑起来的）

1父子标签： div>div>p>div>a  +tab键

效果：

<div>

     <div>

         <p>

          <div>

             <a href="">

             </a>

            </div>

        </p>

    </div>

</div>

 

2兄弟标签  div+p+a

效果：

<div></div>

<p></p>

<a href=""></a>

 

3ID名标签  div#lanou

效果：<div id="lanou"></div>

 

4类名标签  div.类名

效果：<div class="lanou"></div>

 

5div{内容}

效果：<div>123</div>

 

6 同一个的多个兄弟标签  div*2

效果：<div></div>

           <div></div>

 

7顺序标签  div.div$*3

效果：<div class="div1"></div>

           <div class="div2"></div>

           <div class="div3"></div>

 

三超链接标签

<a href="http://www.baidu.com" target="_blank"></a>

<a href="http://www.baidu.com" target="_self"></a>

 

http 访问外网链接  需要加上协议http/https

target 访问的方式_blank  打开新的网页

                               _self   本页进行跳转

 

四图片标签

Img

<img src=”相对路路径” slt=”显示一张图片”/>

 

alt 当图片加载失败的时候显示描述

绝对路径：带有盘符的根目录

相对路径：相对于某个位置的路径

 

五 三种style样式

行间样式：把样式写在标签里面。优点：代码少比较清晰。缺点：总代码多了就会不容易看

内部样式：把样式写在heard里面

外部样式：把样式单独写在css里面，链接方式：<link rel="stylesheet" href="css/文件名"/>

 

三种样式的优先级：

行间样式>行外样式>行内样式