首页 > 代码库 > html and css and js
html and css and js
一.
1.大致了解；
1. HTML是网页内容的载体。内容就是网页制作者放在页面上想要让用户浏览的信息，可以包含文字、图片、视频等。
2. CSS样式是表现。就像网页的外衣。比如，标题字体、颜色变化，或为标题加入背景图片、边框等。所有这些用来改变内容外观的东西称之为表现。
JavaScript是用来实现网页上的特效效果。如：鼠标滑过弹出下拉菜单。或鼠标滑过表格的背景颜色改变。还有焦点新闻（新闻图片）的轮换。可以这么理解，有动画的，有交互的一般都是用JavaScript来实现的。
2.html
（1）HTML文件基本架构：
<!DOCTYPE html >
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here（插入标题）</title>
</head>
<body>
HTML文档的主体部分，在此标志对之间可包含<p>……</p>、<h1>……</h1>、<br>、<hr>等众多的标志。
它们所定义的文本、图像等将会在浏览器的框内显示出来。
</body>
</html>
2.格式标记：
1．<p>……</p>
<p></p>标志对是用来创建一个段落，在此标志对之间加入的文本将按照段落的格式显示在浏览器上。<p>标志还可以使用align属性，它用来说明对齐方式，语法如下所示。
<p align="参数"></p>
Align的参数可以是Left（左对齐）、Center（居中）和Right（右对齐）3个值中的任何一个。例如<p align="center"></p>表示标志对中的文本使用居中的对齐方式。
2．<br>
<br>是一个很简单的单标记指令，它没有结束标志，因为它用来创建一个回车换行，即标记文本换行。
3．<blockquote>……</blockquote>
在<blockquote></blockquote>标志对之间加入的文本将会在浏览器中按两边缩进的方式显示出来。
4．<dl>……</dl>、<dt>……</dt>、<dd>……</dd>
<dl></dl>用来创建一个普通的列表；<dt></dt>用来创建列表中的上层项目；<dd></dd>用来创建列表中最下层项目，<dt></dt>和<dd></dd>都必须放在<dl></dl>标志对之间。
5．<ol>……</ol>、<ul>……</ul>、<li>……</li>
<ol></ol>标志对用来创建一个标有数字的列表。<ul></ul>标志对用来创建一个标有圆点的列表。<li></li>标志对只能在<ol></ol>或<ul></ul>标志对之间使用，此标志对用来创建一个列表项，若<li></li>放在<ol></ol>之间，则每个列表项加上一个数字；若放在<ul></ul>之间，则每个列表项加上一个圆点
6．<div>……</div>
<div></div>标志对用来排版大块HTML段落，也用于格式化表，此标志对的用法与<p></p>标志对非常相似，同样有align对齐方式属性。
（3） 文本标记
文本标记主要针对文本的属性设置进行标记说明，如斜体、黑体字、加下划线等。
1．<pre>……</pre>
<pre></pre>标志对用来对文本进行预处理操作。
2．<h1></h1>……<h6></h6>
HTML语言提供了一系列对文本中的标题进行操作的标志对：<h1></h1>、<h2></h2>、……、<h6></h6>。<h1></h1>是最大的标题，而<h6></h6>则是最小的标题。如果在HTML文档中需要输出标题文本，可以使用这6对标题标志对中的任何一对。
3．<b>……</b>、<i>……</i>、<u>……</u>
经常使用Word的人对这3个标志对一定很快就能掌握。<b></b>用来使文本以黑体字的形式输出；<i></i>用来使文本以斜体字的形式输出；<u></u>用来使文本以下加一划线的形式输出。
4．<tt>……</tt>、<cite>……</cite>、<em>……</em>、<strong>……</strong>
这些标志对的用法和上边的一样，差别只是在于输出的文本字体不太一样而已。<tt></tt>用来输出打字机风格字体的文本；<cite></cite>用来输出引用方式的字体，通常是斜体；<em></em>用来输出需要强调的文本（通常是斜体加黑体）；<strong></strong>则用来输出加重文本（通常也是斜体加黑体）。
5．<font>……</font>
<font></font>可以对输出文本的字体大小、颜色进行随意的改变。这些改变主要是通过对它的两个属性size和color的控制来实现的。size属性用来改变字体的大小，它可以取值为-1、1和+1；而color属性则用来改变文本的颜色，颜色的取值是十六进制RGB颜色码或HTML语言给定的颜色常量名。
(3) 图像标记
再简单朴素的网页如果只有文字而没有图像将失去许多活力，图像在网页制作中是非常重要的一个方面，HTML语言也专门提供了<img>标志来处理图像的输出。
1．<img>
<img>标志并不是真正地把图像加入到HTML文档中，而是将标志对的src属性赋值。这个值是图像文件的文件名，其中包括路径，这个路径可以是相对路径，也可以是网址。所谓相对路径是指所要链接或嵌入到当前HTML文档的文件与当前文件的相对位置所形成的路径。
假如网站的HTML文件与图像文件（文件名假设是logo.gif）在同一个目录下，则可以将代码写成<img src="http://www.mamicode.com/logo.gif">。假如网站的图像文件放在当前的HTML文档所在目录的一个子目录（子目录名假设是images）下，则代码应为<img src="http://www.mamicode.com/images/logo.gif">。
%注意：通常图像文件都会放在网站中一个独立的目录里。必须注意一点，src属性在<img>标志中是必须赋值的，是标志中不可缺少的一部分。
除此之外，<img>标志还有alt、align、border、width和height属性。align是图像的对齐方式，在上边已经提到过。border属性是图像的边框，可以取大于或者等于0的整数，默认单位是像素。width和height属性是图像的宽和高，默认单位也是像素。alt属性是当光标移动到图像上时显示的文本。
2．<hr>
<hr>标志是在HTML文档中加入一条水平线。它可以直接使用，具有size、color、width和noshade属性。
size用来设置水平线的厚度，而width用来设定水平线的宽度，默认单位是像素。noshade属性不用赋值，而是直接加入标志即可使用，它是用来加入一条没有阴影的水平线，不加入此属性水平线将有阴影。
html and css and js