Html和CSS的关系
html:
网页上的信息，包括文字、图片、视频等
css :
网页上信息的外观表现，比如标题字体、颜色、背景图片、边框等
javascript :
给网页加五毛钱特效，比如鼠标滑过颜色改变，焦点轮换，动画交互等
html文件基本结构:
<html>
<head>...</head>
<body>...</body>
</html>
<html></html>
称为根标签，所有的网页标签都在<html></html>中。
<head> </head>
标签用于定义文档的头部，它是所有头部元素的容器。头部元素有<title>、<script>、 <style>、<link>、 <meta>
等标签。
<head>
<title>在网页的标题栏显示</title>
<meta>
<link>
<style>...</style>
<script>...</script>
</head>
<body></body>
标签之间的内容是网页的主要内容，如:h1、p、a、img
等网页内容标签，在这里的标签中的内容会在浏览器中显示出来。
标签
需要承兑出现
#######标题标签:
h1 ~ h7 重要性递减
#######段落标签:
p
图片标签:
img
<img src=url><img src="图片地址" alt="下载失败时的替换文本" title = "提示文本">
1、src：标识图像的位置；
2、alt：指定图像的描述性文本，当图像不可见时（下载不成功时），可看到该属性指定的文本；
3、title：提供在图像可见时对图像的描述(鼠标滑过图片时显示的文本)；
<img src="http://img.mukewang.com/52b4113500018cf102000200.jpg" >
注释
加强标签
strong：粗体
em：斜体
<span>:
没有语义，它的作用就是为了设置单独的样式用的。
效果：span标签内字体变成蓝色
<head>
<style>
span{
color:blue;
}
</style>
</head>
<body>
<span>美国梦</span>
</body>
引用
双引号效果：
<q>引用文本</q>
长引用
两边缩进
<blockquote>引用文本</blockquote>
换行
<br />
空格
水平横线
html4.01版本 <hr>
xhtml1.0版本 <hr />
地址信息
<address>联系地址信息</address>
代码行
<code>var i=i+300;</code>
大段代码
<pre>语言代码段</pre>
无序列表
<ul>
<li>信息</li>
<li>信息</li>
</ul>
有序列表
<ol>
<li>信息</li>
<li>信息</li>
</ol>
序号默认从1开始
排版
<div id="id1">…</div>
表格
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>为表格添加边框</title>
<style type="text/css">
table tr td,th{border:1px solid #000;}
</style>
</head>
<!--下载一点显示一点-->
<!--两行三列-->
<table summary="表格简介">
<caption>表格名</caption>
<!--行1-->
<tr>
<td>列1</td>
<td>列2</td>
<td>列2</td>
</tr>
<!--行2-->
<tr>
<td>列1</td>
<td>列2</td>
<td>列2</td>
</tr>
</table>
<!--下载完成后显示-->
<tbody>
</tbody>
链接
<a href="目标网址" title="鼠标滑过显示的文本">链接显示内容</a>
链接
<a href="目标网址" title="鼠标滑过显示的文本" target="_blank">链接显示内容</a>
target="_blank"：新窗口打开
mailto:在网页中连接Email地址
<img src="http://img.mukewang.com/52da4f2a000150b714280550.jpg">
注意：如果mailto后面同时有多个参数的话，第一个参数必须以“?”开头，后面的参数每一个都以“&”分隔。
网友评论