<!DOCTYPE html> <!-- 文档声明，用于声明一个页面的文档类型定义 -->
<html lang="en"> <!-- html文档的总标签 -->
<head> <!-- html标签的头部 ，头部的内容不会显示在网页中-->
<meta charset="UTF-8"> <!-- 元信息，对信息进行描述的信息 -->
<title>Document</title> <!-- 表示这是一个网页的标题，显示在浏览器选项卡上 -->
<link rel="stylesheet" type="text/css" href="css/index.css"> <!-- 将外部样式表文件链接到html文件中 -->
<script type="text/javascript" src="js/jquery-1.11.0.js"></script> <!-- 插入或者链接一个脚本 -->
<style> /* 在html文档中定义样式信息 */
div {
border: 5px solid black;
}
table,th,td {
border: 2px solid black;
}
</style>
</head>
<body> <!-- 内容区部分，包含网页中显示的元素 -->
<div> <!-- 块级元素，可以用来分割文档 -->
<h1>一级标题</h1>
<h2>二级标题</h2>
<h3>三级标题</h3>
<h4>四级标题</h4>
<h5>五级标题</h5>
<h6>六级标题</h6>
<hr> <!-- 插入水平线 -->
<br> <!-- 插入换行符 -->
<img src="" alt=""> <!-- 链接一幅图像并显示在网页 -->
<audio src="/i/horse.ogg" controls="controls"></audio> <!-- 定义网页中的音频 -->
<table> <!-- 定义一个表格 -->
<thead> <!-- 定义表格的表头 -->
<tr> <!-- 定义表格一行 -->
<th>姓名</th> <!-- 定义表格的表头单元格 -->
<th>年龄</th>
</tr>
</thead>
<tbody> <!-- 定义表格主体区域 -->
<tr>
<td>张三</td> <!-- 定义一个表格单元格 -->
<td>8</td>
</tr>
</tbody>
<tfoot> <!-- 定义表格的脚部区域 -->
<tr>
<td>李四</td>
<td>12</td>
</tr>
</tfoot>
</table>
123<br>
123
<p>这是一个段落</p> <!-- 定义一个锻炼 -->
<a href="https://www.baidu.com/" target="_blank">点我跳转百度</a> <!-- 定义一个超链接 -->
<ul> <!-- 定义无序列表 -->
<li>1</li> <!-- 定义列表项目 -->
<li>2</li>
</ul>
<ol> <!-- 定义有序列表 -->
<li>3</li>
<li>4</li>
</ol>
<span>123</span> <!-- 块元素 -->
<form action=""> <!-- 创建表单 -->
<input type="text"> <!-- 文本域 -->
<input type="button" value="按钮"> <!-- 按钮 -->
<input type="checkbox">单选按钮
<input type="email">
<input type="file">
<input type="password">
<input type="submit">
</form>
<select name="animal"> <!-- 下拉列表 -->
<option value="1">1</option> <!-- 下拉列表中的一个项目 -->
<option value="2">2</option>
<option value="3">3</option>
</select>
<b>文字加粗</b>
<strong>重要的文字</strong>
<i>文字倾斜</i>
<em>强调</em>
<iframe src="https://www.baidu.com" frameborder="0"></iframe><!-- 创建一个内连框架，包含别的页面 -->
<div>输出 空格，<,></div>
</div>
</body>
</html>
css基础
background
-
background-color(定义背景颜色)
-
background-image(定义背景图像)
-
background-repeat(定义背景图像平铺)
-
- repeat
- repeat-x
- repeat-y
- no-repeat
- inherit(父元素继承)
-
background-attachment
-
- fixed (不随着页面滚动)
- local(会随着滚动)
- initiall(设置默认值)
- scroll（默认，滚动）
-
background-position(设置图像的起始位置)
-
- left top
- 0% 0%
text(文本格式)
-
direction(文字的书写方向)
-
-
rtl(从右向左)
-
ltr(从左向右)
-
-
letter-spacing(字符间距)
-
line-height (行高)
-
- px/length
-
text-transform（文本转换）
-
- uppercase
- lowercase
- caplitalize
-
text-indent(文本缩进)
-
text-align( 元素文本的水平对齐 )
-
- justify(两端对齐)
-
text-decoration(文本修饰)
-
- underline
- line-through
- blink
- overline
- underline wavy red(红色波浪下划线)
Font
-
font
-
- font-style
-
- italic
- oblique
- font-variant(字体异体)
-
- small-caps(小型大写字母)
- font-family
- caption
- font-size/height
Link
- a:link (未访问过的链接)
- a:visited (已访问过的链接)
- a:hover (鼠标放在链接上时)
- a:active (链接被点击时）
Ul|Ol
- list-style-type(列表项标记类型)
-
- none(列表布局时用到)
- list-style-position（标记位置）
-
- inside(文本区域内)
- outside(文本区域外)
- list-style-image:url();(图像当做列表项标记)
table
- border-collapse:collapse(折叠边框)
border
- border：:四个方向的边框宽度，颜色，样式
- border-width：
- thin(细边框)
- medium（中等默认）
- thick（粗的）
- length(自定义的如10px)
- inherit
- border-style
-
- solid|dotted（点线）|dashed(虚线)
- none
- hidden
- double(双线边框)
- groove（3D凹槽）
- ridge(3D垄状边框)
- inset
- outset
- border-color
- border-radius(角的弧度)
- border-image
-
- source( 边框的图片的路径 )
- slice( 边框向内偏移 )
- width
- outset( 边框图像区域超出边框的量。 )
- repeat( 边框是否应平铺(repeated)、铺满(rounded)或拉伸(stretched) )
嵌套选择器
- .set p{ }: 为所有 class=“set” 元素内的 p 元素指定一个样式。
- p.set{ }: 为所有 class=“set” 的 p 元素指定一个样式。
display
-
none(从网页隐藏，不影响布局Visibility：hidden(只是不可见了，影响布局))
-
block(以块的形式，但不可嵌套, 前后会带有换行符 )
-
inline(默认，被显示为内联元素 )
-
inline-block （行块）
-
list-item(元素当做列表显示
3495
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
