html+css学习
---恢复内容开始---
在一段html里面
<!DOCTYPE html>
<html>
<meta charset="UTF-8">
<body>
<h1>我的第一个标题</h1>
<p>我的第一个段落。</p>
</body>
</html>
DOCTYPE声明文档类型,和<html></html>一样,是不区分大小写的,同样html标签都是对大小写不敏感的,但是推荐使用小写
<body></body>为了可视化网页的内容,只有这里才会在浏览器中显示
<meta charset="utf-8">为了中文不在浏览器中乱码
- 标签,属性推荐用小写
- 属性应该始终在引号内,通常是双引号
- 在href里写链接,一定要在最后加上/,不然它会向服务器产生两次请求
- 在href里写上class,可以实现跳转
- 空标签是只包含属性没有闭合标签的
- 自定义列表:以<dl>开始,每个自定义列表项以<dt>开始,每个自定义列表形的定义以<dd>
- 区块元素和内联元素:块级元素以新行开始(结束),内联元素不会以新行结束,不可以定义高度和宽度
- html颜色是由红色,绿色,蓝色混合而成的,是一个十六进制,前两个是红色(#FF0000,rgb(255,0,0)),中间两个是绿色(#00FF00,(rgb(0,255,0)),后面两个是蓝色(#0000FF,rgb(0,0,255)),#000000是黑色,所以html一共拥有的颜色是256*256*256=16千万种
- 关于html字符实体,因为html不能使用<>,浏览器会误认为它们属于标签的,所以需要把它们转义为字符实体(character entities),他们通常是以&entity_name或者是&#entity_number,实体名称对大小写过敏
- 在url里面,只能使用ASCII字符集,如果遇到了ASCII字符集以外的字符,见url编码
div+css:
relative:正常定位(嵌套div的父div需要relative)
absolute:根据父元素进行定位
fixed:根据浏览器窗口进行定位(就算浏览器下滚也是固定位置的)
static:没有定位
z-index:层覆盖
display:block变成块元素
display:inline变成内联元素
关于float的两个问题
一个是浮动移位,当一个大div,下面有三个div,一个左浮动,一个右浮动,两个有间隙,底下的div(bottom)就会塞到中间的间隙,这时候需要用clear:both,或者在上面和bottom中间加多一个div,用clear:both,这时候bottom用margin-top是没有用的,需要left或者right用margin-bottom.
第二个是溢出问题,当div里面的内容需要的大于所给的高度的时候,也就是div装不下的时候,就会溢出,这时候可以用overflow:hidden(隐藏内容),scroll(无论内容超不超过都添加滚动条),auto(超出时添加滚动条)