首页 > 代码库 > HTML
HTML
《标签》
<h1>--<h6>----显示一个标题，h1的文字最大，h6的文字是小
<p>---描述的是一个段落
<hr>--能得到一个水平线
<br/>--标签使文本进行换行显示
<strong>--这中间包含文字加粗，
<em>--它中间的文字倾斜.
<span>--通常是用样式来控制它中间的文字的不同
《列表》
无序列表
<ul>--无序列表
<li>--列表
type--设置类型
circle--空心圆点
square--实心正方形
list-style:none---去点
有序列表
<ol>--类型：1，a,A,i,I--有序列表
《图片，文字》
<dl>
<dt>--放图片
<img>---加一个图片 src="http://www.mamicode.com/路径"
<dd>--放文字
《锚链接》
<a name="top"></a>--定义跳转位置
<a href="http://www.mamicode.com/#top">---跳转
target="_blank" -- 跳转，在新页面打开
《特殊字符》
 --空格 一个汉字两个空格
"--双引号
<--小于号
>--大于号
©--版权符号
《表格》
border--边框
<table>--产生表格
<tr>--产生一行
<td>--产生一个单元格
align="center"--居中
width--宽度
height--高
rowspan--跨行
colspan--跨列
text-align: center;----文本居中
cellspacing---单元格的间距
《表单》
<form>--产生表单
action--后台处理数据的页面地址
method--提交方式
input--添加表单元素
type--设置类型
value--属性是元素的值
name--元素名称
text--文本框
maxlength--最大值
size--文本框宽度
file--文件域
radio--单选按钮--name属性相同，可有互斥作用
checked="checked"--默认选中
checkbox--复选框
<textarea>--文本域
readonly--表示只读
cols--显示字符的宽度
rows--显示多少行
hidden--隐藏域
<fieldset>--语义化--设置范围内出现边框
<legeng>--设置边框左上角的文字提示
《下拉列表框》
<select>--产生下拉列表
<option>--列表内容
《按钮》
submit--提交
reset--重置
image--图片提交
button--普通按钮--没有功能，需要借助js来实现
《框架》
【1】
iframe--可以嵌入另一个页面，不但嵌入本网站的页面，还可嵌入其它网站的页面
<iframe src="http://www.mamicode.com/foot.html" frameborder="1" scrolling="no" width="100%" height="100">----示例
scrolling--滚动条
【2】
frameset--用得比较少，因为浏览器兼容性不好。只能嵌入本网站的页面。
它形成一个框架页面，把本页进区域划分，然后每个一区域用一个其它的页面来填充。
noresize="noresize" 不能拖动页面大小。
所以注意：框架页面没有body。rows="20%,30%,*"表示把页面垂直上中下,划分3个区域。
cols="20%,30%,*"这是水平左中右,划分3个区域。
《样式，，布局》
【1】
html--标签选择器--建议页面在统一风格是使用
. --类选择器，使用时，有个class属性
id--id选择器，建议只用于布局层
sty
《样式的位置》
内嵌样式表:写在页面的 <head>标签中,它只针对当前页面有效,作用范围针对当前页。
行内样式表:直接写入某一个标签中。作用范围只是当前这一个标签。
<p style="font-size:24px; font-family:‘隶书‘;">这是第三段。</p>
外部样式表:这也是开发最常用的做法。
就是把样式形成单独的文件.css。
然后页面与样式文件进行关联。
它的作用范围是整个网站。
关联方式：<link rel="stylesheet" type="text/css" href="http://www.mamicode.com/css/mycss.css"/>
《后代选择器》
#div1 p{ color:#30C; font-size:16px;}
这一种情况叫后代选择器，表示p 样式只在#div1这个id选择器中起作用。
《并集选择器》
a,h3{ font-size:12px; color:#000;}表示a标签与h3标签共享一个样式
《全局选择器》
*{ padding:0px; margin:0px; font-size:14px;}
表示清除所有标签默认的外边距及内填充。整个网站的字体大小为14px(像素)。
《优先级》
样式表有优先级：行内样式表 > 内嵌样式表 > 外部样式表
选择器也有优先级：ID选择器 > 类选择器 > 标签选择器
《文本与字体属性》
font-family--设置集体类型
font-size--设置字体大小
font-style--设置字体风格
font--在一个声明中设置所有属性
color--设置颜色
text-align--设置元素水平对齐的方式
text-indent--设置首行文本的缩进
line-heigth--设置文本的行高
text-decoration--设置文本的装饰--none没有下划线
《伪类样式》
link--未访问
visited--访问过
hover--鼠标悬停时
active--激活时
《伪类样式使用》
类选择器+：+伪类样式名
cursor:pointer--鼠标经过时会变成手型
li:last-child--最后一个
《背景属性》
background-color--背景颜色
background-image:url()--背景图片
background-repeat:no-repeat--背景图片不平铺
prpeat-x 表示沿x轴平铺。
prpeat-y 表示沿y轴平铺
《背景偏移》
background-position:30px 30px;表示图片沿x轴偏移30px，沿y轴偏移30px.
《盒子模型》
margin--外边距
padding--内边距
《边框属性》
border-color--边框颜色
border-style--风格
border-weidth--边框的粗细
《浮动》
float--浮动
clear--清除浮动
<div style="clear: both;"> </div>--亦可加此层，去清除浮动
《内容溢出》
overflow属性
hidden--把溢出的内容隐藏
scroll--出现滚动条
auto--如果有溢出也会出现滚动条
visible--呈现在盒子外面
结合width，清除浮动，旷展盒子的高度
《display》用于指定HTML标签的显示方式
属性用于控制标签的隐藏与显示问题。
如果标签隐藏了，这个标签不会占浏览器的空间了，脱离了标准文档流。
同时能使块级标签转成行级标签，也可以把行级标签转换成块级标签
block--将元素显示为块级标签，该元素前后会带有换行符
inline--默认，元素会显示为行内元素，该元素前后没有换行符
none--该元素不会被显示
《position，定位》
relative--相对定位
absolute--绝对定位
fixed--固定定位
《Z-index》
控制多页面的前后位置
《脚本js》
《编写位置：》
<script>--标签导入
<script>--标签包含
《Dom对象》
《植入声音标签》
audio --植入声音标签
《防止客户端保存密码时自动填充》
onfocus="this.type=‘password‘"
HTML