WebStorm练习笔记

overflow是css代码
最主要的用法有两种

<div style="width:500px;height:22px;line-heihgt:22px;overflow:hidden">这里有一大长串文字</div>

作用是当宽度文字超出500px，高度超出22px的时候，超出的部分隐藏起来……

overflow:auto;

作用是当超出设定的长宽时，出现滚动条
list-style 简写属性。用于把所有用于列表的属性设置于一个声明中。
list-style-image 将图象设置为列表项标志。
list-style-position 设置列表中列表项标志的位置。
list-style-type 设置列表项标搜索志的类型。
margin 边缘，范围
padding 内边距
float 对齐
<br/><hr/> 单行标志
<charset="UTF-8"> 这是网页编码设置
<font> 设置文字标签，默认是3，最大是7,color是字体颜色，face是 字体方式

<font size="5" color="while" face="宋体">字体标签</font>

<p></p> 段落标签
<br /> 换行标签

标题标签，区别，在于以数字大小排序，标题依次变小

<h1><h1>       
<h2><h2>
<h3><h3>

<hr /> 水平线、分割线
01 color ：颜色，它可以设置我们的水平线颜色。
02 width ：宽度，它可以来设置我们水平线的宽度。
03 align: 水平显示方式 居中 居左 居右
04 size: 它可以调节我们我们水平线的粗线。
下面是实例：

---

以下是代码

<hr width="400" align="left" color="red" size="10">

加粗：在我们的HTML里加粗有二组标签

注意： 推荐大家使用strong
倾斜标签

下划线标签：

删除线标签

<img src="图片路径" width="300" height="100" />

这个是插入图片
src:它是我们的图片路径（地址）。
width: 它可以更改我们图片的宽度。
height:它可以更改我们的图片的高度。
title: 它是我们图片的标题，当我们鼠标移上图片的时候会显示它里面的文字。
alt: 它是我们图片替换文本,当图片不能正确加载的时候它会显示我们的替换文本。
border: 边框，它可以设置我们图片的边框。

背景颜色：bgcolor它可以设置我们的背景颜色
背景图片：background 设置背景图片

01 空格：  一个  一个 它就带表一个空格（英文状态下）

01 空格：  一个   一个 它就带表一个空格（英文状态下）

02 小于号： < ====> <

02 小于号： <  ====> &lt;

03 大于号：> ====》>

03 大于号：>   ====》 >

04 版板符号： © ©

04 版板符号： ©          ©

<a href="路径" title="当鼠标放到链接上的时候我们可以看到title里的文字。" ><a/>

01 href: 它与我们img中的src类似。不过它是将我们当前页面跳到其它地方去，里面写的是我们的文件路径。
02 title: 链接标题。当鼠标放到链接上的时候我们可以看到title里的文字。
03 target: 它可以控制我们链接的打开方法
_self： 表示页面在当前窗口打开。
_blank: 表示页面在新窗口打开
_parent: 【与框架集有关】
_top:【与框架集有关】

在我们的HTML里面列表分三种：
无序列表 <ul></ul>
有序列表 <ol></ol>
自定义列表 <dl></dl>

ul <ul type="disc"></ul>
Type: 它是Ul 、li的属性，通过它我们可以控制无序列表前面小点点的展示形式。
01 disc : 它就是默认值，展示为小圆点。
02 circle: 它表示前面是一个小圆圈。
03 square: 它表示前面是小方块。

ol <ol type="a"></ol>
Type ：它是一个属性可以控制我们Li里面的数字。
01 a: 它表示列表按着小写字母的顺序来进行排列。
02 A: 按字母顺序排列此时是大写。
03 i: 按着i ii iii……. 进行排列
04 I: 按着I II III……进行排列
05 1:按着 1 2 3…..进行排列

dl
<dt></dt> 放置的是标题
<dd></dd> 放置的是列表项

<table border="1" width="400" height="160" align="center" cellspacing="0" cellpadding="0">
    <tr><th>姓名</th><th>姓名</th><th>姓名</th></tr>
    <tr align="center"><td rowspan="2">姓名</td><td colspan="2">姓名</td></tr>
    <tr align="center"><td>姓名</td><td>姓名</td></tr>
</table>

姓名	姓名	姓名
姓名	姓名
	姓名	姓名

width: 它可以设置我们表格的宽度。
border:它可以设置我们表格的边框。
align: center 可以让表格居中显示。
height:更改表格的高度。
cellspacing: 它表示我们单元格与单元格之间的距离( 它是table的属性 )
cellpadding: 它表示我们单元格内容与单元格之间的距离。
表格的特性：表格里的单元格和行可以自动平分我们表格的宽和高
rowspan 往下合并，参数为合并多少行，下面的属性可以省略多少行
colspan 往右合并，参数为合并多少列，右面的属性可以省略多少行

input
在HTML里面有很多个表单元素，但是它们有一些规律，大部分的表单元素都是input 然后通过 type属性来进行区分。
表单的作用：可以收集用户信息。
<input type="text"/> text 表示的文本类型
password为密码类型
file为上传文件
button为登录类型
date为时间类型
tel为电话号码类型

<select></select> 为下拉菜单
<textarea name="" rows="400" cols="10"> 这是为文本域
<form></form> 包裹的内容形成表单域