html,css的笔记

HTML

超链接 标签 可用于发邮件 例子：

target="_blank" 在新窗口打开

<a href="mailto:收件人@cnblogs.com?cc=抄送@cnblogs.com&bcc=加密抄送@cnblogs.com&subject=主题&body=内容>联系我</a>

<q></q>标签，短文本引用

<blockquote></blockquote>,长文本引用

使用<span></span>标签为文字设置单独样式

<code></code> 在网页中加入一段代码

<pre></pre> 在网页中加入一段代码 会保留其格式

strong ,em,i ,b 都是用于强调，但建议使用strong 和em 因为便于SEO的爬虫理解

hx h(1-6) 一般使用1 和2 便于SEO

<table summary="表格简介文本">

CSS

内联式 > 嵌入式 > 外部式

但是嵌入式>外部式有一个前提：嵌入式css样式的位置一定在外部式的后面

其实总结来说，就是--就近原则（离被设置元素越近优先级别越高）。

选择器：

标签选择器：

p{font-size:12px;line-height:1.6em;}

类选择器： 

.类选器名称{css样式代码;}

ID选择器

ID选择符的前面是井号（#）号，而不是英文圆点（.）。

<p">类和ID选择器的区别

相同点：可以应用于任何元素
不同点：

1、ID选择器只能在文档中使用一次

2、可以使用类选择器词列表方法为一个元素同时设置多个样式。

子选择器

包含(后代)选择器

.food li{border:1px solid red;}

通用选择器

*{border:1px solid red;}

伪类选择符:为什么叫做伪类选择符，它允许给html不存在的标签（标签的某种状态）设置样式 例如：

a:hover{color:red;}

分组选择符 当你想为html中多个标签元素设置同一个样式时，可以使用分组选择符（，），如下代码为右侧代码编辑器中的h1、span标签同时设置字体颜色为红色：

h1,span{color:red;}

权值

标签的权值为1，类选择符的权值为10，ID选择符的权值最高为100

字体：font-family:“Microsoft Yahei"

字体颜色： color:red;

粗体： font-weight:bold;

斜体：font-style:italic

下划线：text-decoration:underline;

删除线：text-decoration:line-through

段落排版--缩进:

p{text-indent:2em;}

行间距:line-height:2em;

字间距:word-spacing:10px;

字母间距:letter-spacing:20px;

段落排版--对齐:

text-align:center/left/right;

行内元素a转换为块状元素，从页使用a元素具有块状元素特点

a{display:block;}

border-style（边框样式）常见样式有：

dashed（虚线）| dotted（点线）| solid（实线）

border-color（边框颜色）中的颜色可设置为十六进制颜色，如:

border-color:#888;//前面的井号不要忘掉。


border-width（边框宽度）中的宽度也可以设置为： thin | medium | thick（但不是很常用），最常还是用象素（px）。

css布局模型

在网页中，元素有三种布局模型： 1、流动模型（Flow） 2、浮动模型 (Float) 3、层模型（Layer）

浮动模型:

float:right/left

层模型有三种形式：
1、绝对定位(position: absolute)
2、相对定位(position: relative)
3、固定定位(position: fixed)