web前端第二天学习日记

今天了解了HTML一些常用标签和CSS使用方法和选择器。

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

实现一个表格需要：

表格标记：table

行标记：tr

单元格标记：td

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

如果需要显示表格的边框，就使用border属性设置，值为固定数值：border=”1”(实际开发中不建议这样使用，一般都是使用样式设置)
表格默认的大小是跟随内容变化的，如果需要定义宽和高，通过width和height设置

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

在单元格中使用rowspan实现垂直和clospan实现水平合并 
合并单元格：
在用于合并的单元格中使用属性，属性的值为合并后单元格所占单元格个数，如rowspan=”2”
将被合并(挤出去)单元格删除

补充：通过cellpadding设置表格内容的填充（补白，内间距），通过cellspacing设置单元格之间的间距

表单标记：用于显示接收用户输入或选择的控件，完成数据的收集和发送
标记名：form
必须存在属性：

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

（Post和get的区别：

Post：提交数据在地址栏不可见，数据提交发送慢

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属性值）

在网页中使用注释（给人看）：
<!—注释文本-->
网页中#表示当前
计算机中加载代码的顺序：从上往下，从左往右逐行执行

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：值;
样式属性2：值;
…….

}

ID选择器：选择器名以#后跟自定义的名称
使用特点：在需要使用该选择器的标记中通过属性id=”选择器名”，来使用样式
语法：
#选择器名{
样式属性1：值;
样式属性2：值;
…….

}

类选择器：选择器名以.后跟自定义的名称
使用特点：在需要使用该选择器的标记中通过属性class=”选择器名”，来使用样式
语法：
.选择器名{
样式属性1：值;
样式属性2：值;
…….
}
Id选择器和类选择器的区别：
在网页中每一个ID选择器只能作用于一个标签，而类选择器可以作用于多个标签，这只是开发准则。


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