本文详细介绍了HTML的基本用法，包括文档声明、常用标签如段落、列表、表格等，以及如何使用样式表和设置表单等内容。
1.一个元素：标签+属性+内容
2.<!DOCTYPE>声明html文档的版本，相当于dtd。<!DOCTYPE html>声明为html5
3.<meta charset="utf-8"/>
4.文本元素：标题，<h1>~<h6>由大到小
段落，<p> <p style="color:red;">
列表:有序（前面1,2,3的）<ol> 无序。（前面是个大黑点）<ul> <li>列表里的项
分区：块分区<div> 行内分区<span>
行内
5.<div style="border:1px solid #ccc;">边框1px，实线，灰色
6.元素显示方式：块级元素：元素前后自动换行<p><div><h1>
行内元素：不会换行<span><a><i><u>修饰一断文字的某几个字
7.如果一断文字只想改变几个字的样式可用<span>套上 <span style="color:red;">
8.<i><em>文字倾斜，<b><strong>加粗文字，<del>删除线<u>下划线
9. ；空格 ©；版权号 &it；小于号 >；大于号
10.<img src="" width="" height="">图片
11.<a href="" target="">href为链接地址，target为打开方式_blank：新窗口 _self:自己页面打开
12.<a name="aaa">锚点</a>锚点，能够链到当前页面的任意位置
<a href=“#aaa”>回到锚点</a>
13.表格<table>,行<tr>，列<td>按顺序画出 <table border="1px" width="30px" heigth="60%">屏幕的百分之60
14.px就是像素，屏幕里的一个点
15.<td>colspan=“2”跨2列，rowspan=“2”跨2行。很重要，合并单元格
16.thead tbody tfoot对表格分组，方便选取各各区域内容<tbody style="color:red;">
17.align=“left”right center单元格内的内容居哪边
18.<th>标题行的<td>自动居中加粗
19.<div style="border:1px solid red;width:960px;margin:0 auto">div居中
20.<form> enctype属性控制表单提交内部的编码
21.<label for="aa">账号：</label>label是通过input的id来绑定的
<input type="text" id="aa"/>label可以通过for属性绑定到input，点label相当于点了input
22.readonly只读属性，maxlength限制输入字符数
23.<input type="radio">单选框 ，name属性设为一样即可单选<input type=“checkbox”>多选框，checked属性表示默认选中
24.<input type=“reset”>重置，value属性名字
25.<input type="hidden">不希望用户看见的信息 ,<input type="file">文件选择框，提交文件给服务器的
26.<textarea>文本域（大号文本框）有cols，rows，readonly属性
27.<select>
<option value="1">aaa</option>最终提交的是value的值
</select>下拉选
28.<link rel="stylesheet" type="text/css" href="路劲">外部引用样式文件
29.font-family:“微软雅黑”；字体。层叠性：多次加样式会叠加。继承性。
30.内联样式优先级最高，内部和外部采取就近原则，谁在后面谁为主
31.backgroung-color:#ccc;
32..name,#a1{
}选择器可以一起选择，逗号隔开
33.#p1 b{
}在p1下选择所有的b，后代选择器
34.#p1>b{
}只找儿子，不找孙子，
35.伪类选择器，可以做出许多动态效果:link,:visited,:active,:hover,:focus
36.a:link{
}选择没点击过的超链接
37.a.visited{
}选择已经访问过的超链接
38.#button：active{
background-color：red；
}选择被点中的button，选择被激活的状态
39.#img：hover{
}选择鼠标上的图片，选择鼠标悬停的东西
40.#input：focus{
}获取焦点的样式
41.border-left:15px solid #ccc；border-bottom:15px solid #ccc;
42.单位：px，%，em（1.6）
43.定位：改变默认的元素的位置。浮动，相对，绝对，固定
44.di{
float:right/left;浮动
}
45.p{
clear:right;
}消除浮动对P的影响
46.<div style="border:0;clear:right;"></div>最好的消除福鼎影响
47.div{
position:relative;
left:50px;
top:50px;
}相对偏移，相对于本身
48.div{
position:absolute;
}绝对定位，相对于第一个设置了特殊定位的父元素。
49.div{
position:fixed;
bottom：10px；
right:5px;
}固定定位，参考窗口
50.display:none;不显示
51.z-index堆叠顺序
52.e.target获取事件源
53.冒泡机制，由里向外触发事件。event.cancelBubble=“true”
54.当采取外联样式时图片要填全路径background-image: url('http://localhost:8080/SaleWell/picture/1.jpg');
扫一扫
3039
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
