总结HTML+CSS 2019/9/5

HTML简介

        HTML（Hyper Text Markup Language的缩写）主要是通过HTML标记对网页中的文本、图片、声音等内容进行描述。HTML提供了许多标记，如段落标记、标题标记、超链接标记、图片标记等，网页中需要定义什么内容，就可用相应的HTML标记描述。

## HTML常用标签

<h1></h1>
<!-- 段落 -->
<p></p>
<!-- 图片 -->
<img src="imgs/news.jpg"/>
<!-- 超链接 anchor-->
<a target="_blank" href="http://www.baidu.com">百度一下，你就知道</a>
<!-- 列表 -->
<!-- unordered list -->
<ul>
    <!-- list item -->
    <li></li>
</ul>
<!-- ordered list-->
<ol>
    <li></li>
</ol>
<!-- 布局 division-->
<div></div>
<!-- 表单 -->
<form action="" method="get">
 **列表** 

<ul>
    <li></li>
</ul>
<ol>
    <li></li>
</ol>
 **布局**
<div></div>

## 表格
border:设置表格的边框
bordercolor:设置表格边框颜色
cellspacing:设置单元格和单元格之间的距离
cellpadding:设置单元格和内容之间的距离
width/height:设置表格的宽度/高度
align:设置表格对齐方式
bgcolor:设置表格背景色

CSS简介

    CSS通常称为CSS样式或样式 表，主要用于设置HTML页面中的文本内容（字体、大小、对齐方式等）、图片的外形（宽高、边框样式、边距等）以及版面的布局等外观显示样式。
    CSS以HTML为基础，提供了丰富的功能，如字体、颜色、背景的控制及整体的排版等，而且还可以针对不同的浏览器设置不同的样式。

CSS(层叠样式表)

## 使用方法

• 行内样式（1000）
• 外联样式
• 内部样式

## 基本选择器

• 标签选择器（1）
• 类选择器（class）（10）
• id选择器（100）

## 选择器优先级

id > 类选择器 > 标签选择器

## 派生选择器

• 包含选择器（后代选择器）
• 子选择器
• 群组选择器
• 属性选择器
• 相邻兄弟选择器
• 通配符选择器

## 字体样式

• font-size
• font-style : italic/oblique;
• font-weight : bold/bolder;
• font-family : “宋体”

## 文本样式

• text-align : center / left / right;
• color : red;
• text-indent : 2em;
• line-height : 30px;
• （水平对齐方式）text-align : center / left / right;
• （设置字体颜色）color : red;
• （设置首行缩进）text-indent : 2em;
• （行高/设置文字垂直对齐方式）line-height : 30px;
• （文本修饰）text-decoration : none/underline/overline/line-through;

##背景样式
background-color : #ccc;
background-image : url( );
background-repeat : no-repeat;
background-position :
background : red url() no-repeat 100px center;
## 列表样式

• list-style : none;

## 超链接样式（伪类选择器）

• :link 只有超链接可以用（未被访问之前）
• :visited 只有超链接可以用（访问过后）
• :hover 可用于任意标签（鼠标经过时）
• :active（鼠标点击时）