HTML5学习

来源：互联网发布：java config 配置文件编辑：程序博客网时间：2024/06/07 01:32

1.易忘的几个css属性

overflow:hidden; //设置超过边界部分隐藏

list-style:none; //设置无序列表的样式

text-decoration:none; //设置链接无下划线

box-shadow:[inset] x-offset y-offset blur-radius spread-radiuscolor //给文本添加阴影效果

display: -webkit-box;(父元素)，-webkit-box-flex:1(子元素)；//弹性盒子模型

background:-ms-linear-gradient(top,#fff,#000fff); //设置渐变背景色，从顶部开始，颜色有#fff过渡到#000fff, IE 10

background:-moz-linear-gradient(top,#fff,#000fff); //火狐FireFox

background:-wwebkit-linear-gradient(top,#fff,#000fff); //safari chrome10+

background:-o-linear-gradient(top,#fff,#000fff) ; //Opera

2. 样式表的插入方法

方法一：内联样式表

方法二：内部样式表

<style>

body{padding:0px;margin:0px}

</style>

方法三：外部样式表的插入

3.链接的作用

普通超链接：

①　<a href=”http://www.baidu.com”>百度</a> //文字链接

②　<a href=”http://www.baidu.com”>

<img src=”log.png” width=”200” height=”200” alt=”这是一个图片链接，当图片不能正常显示是，该内容会显示”title = “提示文字”/></a> //图片链接

下载超链接

<a href = "BDC.zip">下载</a> // href属性值为要下载文件的地址

空超链接

<a href = "#">空超链接</a> //空链接用于跳转到页面的首部

锚点

<a href = "czp">点击跳转到锚点位置</a> // 锚点相当于书签

注意：在设置超链接的样式时要遵循

爱恨原则”（LoVe/HAte），即四种伪类的首字母:LVHA。

再重复一遍正确的顺序：a:link、a:visited、a:hover、a:active .

a:link(未被访问)

a:visited(访问过：正真到达那个页面)

a:hove(鼠标悬停)

a:active(鼠标点击与释放之间，对无href属性的a 对象无作用)

4.表格

表格中有几个属性要分清：rowspan = "2" //合并行，colspan = "2" //合并列， cellpadding ="10" //设置单元格的内边距， cellspacing = "10" //设置单元格与单元格间的间隙

5.HTML5元素常见的分类

块级元素：在显示时通常会以新的一行开始

<div>,<p>,<h1>~<h6>,<ul>,<ol>,<li>,<dl>,<dt>,<dl>,<table>,<form>等

行内元素：通常不以新的行开始

<a>,<b>,<i>,<strong>,<span>,<label>等

行内块级元素：是行内显示，但是自己有对应的高度，也可以设置高宽

<img>,<input>,<button>等

6.常用表单标签

<form>表单<input>输入域<textarea>文本域<label>控制标签<fieldset>定义域<legend>域的标题<select>选择列表<option>下拉列表中的选项<optgroup>选项组<button>按钮

7.HTML5新增加的全局属性（所谓全局属性是指对所有的元素都可以使用）

contentEditable属性：默认值为true（可编辑）

designMode属性：on(可编辑)针对整个页面

hidden属性：true(设置元素隐藏)

Spellcheck属性：input和textarea等输入框的错误检查

tabindex属性：tab键操控页面访问的顺序

0 0