HTML学习笔记(二)

表格标记:显示较工整的数据时建议使用

实现一个表格:需要

表格标记:table

行标记:tr

单元格标记:td

 

额外可用标记:thead ,tbody用于设置能快速搜索的表格

 

编写一个2行2列的表格:

 

 

 

 

 

如果需要显示表格的边框,就使用border属性设置,值为固定数值:border=”1”(实际开发中不建议这样使用,一般都是使用样式设置)

表格默认的大小是跟随内容变化的,如果需要定义宽高,通过width和height设置

在表格中使用align可以设置表格的水平对齐方式,如果align使用在tr或td中表示某行或某列中的内容的水平对齐方式

 

在单元格中使用rowspan实现垂直和clospan实现水平合并

合并单元格:

1.    在用于合并的单元格中使用属性,属性的值为合并后单元格所占单元格个数,如rowspan=”2”

2.    将被合并(挤出去)单元格删除

 

补充:通过cellpadding设置表格内容的填充(补白,内间距),通过cellspacing设置单元格之间的间距

 

 

表单标记:用于显示接收用户输入或选择的控件,完成数据的收集和发送

 

标记名:form

必须存在属性:

method:默认值为get,可选值有post和get,如果明确提交数据方式为get,该属性可以不写

action:用于指定表单数据的发送地址

 

表单的数据收集通过其包含的控件标记来实现:

输入控件:input

必写属性:type,用于设置控件类型

           常用值:

Ø  text:默认值,表示文本框

Ø  password:密码框

Ø  radio:单选按钮框,如果想要多个单选成为一组的单选,必须保证该组单选按钮的name属性值一致

Ø  checkbox:复选框

Ø  button:普通按钮,该按钮没有任何效果,效果的实现必须通过javaScript语言开发,按钮中通过设置其value属性来定义按钮显示的文本

Ø  submit:提交按钮,该按钮具有提交数据的功能,通过设置其value属性来定义按钮显示的文本

常用属性:name,用于设置控制名称(在进行web开发时非常重要

 

下拉列表控件:select,必须结合option(下拉列表项)标记实现

<select>

           <option>2001</option>

           <option>2002</option>

           <option>2003</option>

           <option>2004</option>

       </select>年

文本域控件:textarea

<textarea rows="10" cols="20">

       用户协议

</textarea>

属性rows设置行数,clos设置列数

 

实际开发中:一般借助表格对表单控件进行布局,显示会较工整,每个控件都应该具有一个有意义的name属性值

 

在网页中使用注释(给人看):

<!—注释文本-->

网页中#表示当前

计算机中加载代码的顺序:从上往下,从左往右逐行执行

 

Post和get的区别:

Post:提交数据在地址栏不可见,数据提交发送慢

Get:提交数据在地址栏可见,发送提交速度快

 

样式:外观,外貌,样子

 

CSS:层叠样式表:

使用方式有3种:

行内样式:

在需要使用样式的标记中,通过style属性定义样式

语法:<标记名style=”样式属性1:属性值; 样式属性2:属性值;….”>被修饰的内容</标记名> 

内部样式表:

在head标记中定义style标记,在style标记中定义各种样式选择器

<style>

样式选择器1

样式选择器2

…..

</style>

 

外部样式表:在样式重复使用上效率更高(在实际开发中使用最多)

1.    创建一个以.css为文件后缀名的样式表文件,在文件中编写各种选择器

2.    在需要引用样式的网页的head标记中通过link标记将样式表文件加载

完整语法:

<link href="样式表地址" rel="stylesheet" type="text/css">

 

网页中常用选择器:

1.    标签选择器:选择器名就是标签名,

使用特点:网页中所有属于指定选择器名的标签都会具有该选择器的样式

语法:

选择器名{

样式属性1:值;

样式属性2:值;

…….

}

2.    ID选择器:选择器名以#后跟自定义的名称

使用特点:在需要使用该选择器的标记中通过属性id=”选择器名”,来使用样式

语法:

  #选择器名{

样式属性1:值;

样式属性2:值;

…….

}

3.    类选择器:选择器名以.后跟自定义的名称

使用特点:在需要使用该选择器的标记中通过属性class=”选择器名”,来使用样式

语法:

  .选择器名{

样式属性1:值;

样式属性2:值;

…….

}

 

Id选择器和类选择器的区别:

在网页中每一个ID选择器只能作用于一个标签,而类选择器可以作用于多个标签,这正是开发准则

 

多种样式使用遵循就近原则。


评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值