Html入门笔记整理

一、html:超文本标记语言(HyperText Markup Language)

特点:

  • Html文本不需要编译,不区分大小写;
  • 扩展名为“*.html”或“.htm”;
  • Html结构包括两部分:头head和体body。

二、html基本模板

三、html注释格式

<!-- 注释内容 -->

四、标题标签:<hn>

<h1> <h2> <h3> <h4> <h5> <h6>

《=================》

注:n从1到6,标题字体大小越来越小。

五、水平分隔线:<hr>

size:水平线高度,单位像素。
color:颜色。
noshade:无阴影。取值noshade,表示纯色。

六、字体标签:<font>

size:字体大小,从1到7,越来越大。默认值为3。
face:字体(如:face=”宋体”)。
color:字体颜色。颜色取值:#xxxxxx或colorname或rgb(x,x,x)。
  1. 对于#xxxxxx:红绿蓝分别取值:
    00—FF(FF为十六进制的255) #000000黑色 #FFFFFF白色 #FF0000红色 #00FF00黑色 #0000FF蓝色
  2. 对于colorname:取值:red,blue,pink,gold,gray …
  3. 对于rab(x,x,x):传入三颜色的数值即可。

七、格式化标签:<b> <i> <p> <br/>

<b>:加粗
<i>:斜体
<p>:定义段落。P标签会自动在其前后创建一些空白。
<br/>:换行

八、图片标签:<img>

常用属性:

src:指定需要显示图片的URL
alt:图片无法显示时的替代文本
width:宽度
height:高度

九、列表标签:<ol> <ul> <li>

<ol>:有序列表。
    type:列表类型,取值:A,a,I,i,1等。
<ul>:无序列表。
    type:符号的类型,取值:disc(实心圆),square(方块),circle(空心圆)。
<li>:ol和ul的子标签,用于定义列表项。

《=================》

十、超链接标签:<a>

href:规定链接指向的页面的 URL。
target:确定以何种方式打开href所设置的页面。
    _self:默认值。在该窗口加载目标(href)文档,并替换本窗口。
    _blank:新窗口中载入目标文档。
    _parent:这个目标使得文档载入父窗口或者包含来超链接引用的框架的框架集。如果这个引用是在窗口或者在顶级框架中,那么它与目标 _self 等效。
    _top:在整个窗口中打开被链接的文档。

注:在所有浏览器中,链接的默认外观是:

十一、表格标签:<table> <tr> <td> <th>

<table>

属性

描述

align

left center right

规定表格相对周围元素的对齐方式。

bgcolor

rgb(x,x,x) #xxxxxx colorname

规定表格的背景颜色

border

pixels

表格边框的宽度(如:border=”1”)。

cellpadding

pixels 或 %

规定单元边沿与其内容之间的空白。

cellspacing

pixels 或 %

规定单元格之间的空白。

frame

void above below hsides lhs rhs vsides box border

规定外侧边框的哪个部分是可见的。

rules

none groups rows cols all

规定内侧边框的哪个部分是可见的。

summary

text

规定表格的摘要。

width

% pixels

规定表格的宽度。

<th>:定义表头。内容默认居中,加粗。
<tr>:定义行。
<td>:定义列。
    colspan:列合并数。
    rowspan:行合并数。
    nowrap:单元格中的内容是否折行。
    align:单元格内容的水平对齐方式,取值:left,right,center。
    height:规定表格单元格的高度。

《=================》

十二、框架标签:<frameset> <frame>

<frameset>

属性

描述

cols

pixels或%或 *

定义框架集中列的数目和尺寸。值1,值2,值3,……(一个值表示一行,多个值之间用逗号隔开,值也可以是10%、10px等,最后一个值如果不想计算,可以使用“*”匹配剩余量。)如:<frameset col=”15%,20%,*”></frameset>

rows

pixels或%或*

定义框架集中行的数目和尺寸。(同上)

注:frameset标签不能和body一起使用。

<frame>

属性

描述

frameborder

0 或1

规定是否显示框架周围的边框。

marginheight

pixels

定义框架的上方和下方的边距。

marginwidth

pixels

定义框架的左侧和右侧的边距。

noresize

noresize

规定无法调整框架的大小。

scrolling

yes no auto

规定是否在框架中显示滚动条。

src

URL

规定在框架中显示的文档的 URL。

十三、表单标签:<form>

action:规定当提交表单时向何处发送表单数据。
method:规定用于发送 form-data 的 HTTP 方法。(值:GET和POST)
enctype:规定在发送表单数据之前如何对其进行编码。
    enctype=” application/x-www-form-urlencoded”: 在发送前编码所有字符(默认)。
    enctype=” multipart/form-data”:不对字符编码。在使用包含文件上传控件的表单时,必须使用该值。
    enctype=” text/plain”: 空格转换为 "+" 加号,但不对特殊字符编码。

十四、输入域标签:<input>

size:定义输入字段的宽度。
src:定义以提交按钮形式显示的图像的 URL。
checked:规定此 input 元素首次加载时应当被选中。
disabled:当 input 元素加载时禁用此元素。
maxlength:允许输入的最大长度。
readonly:是否只读。
type:规定 input 元素的类型。
    checkbox:定义复选框。
    file:定义输入字段和 "浏览"按钮,供文件上传。
    hidden:定义隐藏的输入字段。
    image:定义图像形式的提交按钮
    password:定义密码字段。该字段中的字符被掩码。
    radio:定义单选按钮。
    reset:定义重置按钮。重置按钮会清除表单中的所有数据。
    submit:定义提交按钮。提交按钮会把表单数据发送到服务器。
    text:定义单行的输入字段,用户可在其中输入文本。默认宽度为20个字符。
    button: 定义可点击按钮(多数情况下,用于通过 JavaScript 启动脚本)。

十五、文本域标签:<textarea>

属性:

cols:规定文本区内的可见宽度。
disabled:规定禁用该文本区。
maxlength:规定文本区域的最大字符数。
readonly:规定文本区为只读。
required:规定文本区域是必填的。
rowsnumber:规定文本区内的可见行数。

十六、下拉列表标签:<select> <option>

<select> :
    name:名。
    size:多选时,可见选项的数目。
    multiple:不写默认单选,取值为“multiple”为多选。
<option>:select的一个子标签
    selected:勾选当前列表项
    value:值。

十七、节标签:<div>

<div>:可定义文档中的分区或节(division/section)。
    align:规定 div 元素中的内容的对齐方式(值:left或right或center或justify)。