2018-6-21 seo达人
如果您想订阅本博客内容，每天自动发到您的邮箱中， 请点这里
基本格式：
<！DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html； charset=utf-8">
<title>制作我的第一个网页</title>
<style type="text/css">
h1{font-size；color；text-align：center}
</style>
</head>
<body>
<h1>Hello World！ </h1>
</body>
</html>
注释：<！--注释文本-->
强调语气：<strong>，<em>：前者实现加粗再加粗，后者实现加粗加斜 体。
<span>标签：写在style 里设置单独样式。
<q></q>标签：引用简短文本，使引用的诗句等自己出现双引号。
<blockquote>： 引用长文本，增加缩进量。
<br />： 换行标签。
：代码之间实现空格。
<hr />： 段落之间分隔的横线。
<address>： 定义一个地址（比如电子邮件地址） ，签名或者文档的作者身份。在浏览器上显示的样式为斜体。
<code>： 加入简短代码。
<pre>： 加入一段长代码。
Ul-li标签： 添加新闻信息列表， 图片列表， 无序文字列表。
Ol-li 标签：添加有序列表，与ul-li 标签类似。
<div> ：把一些独立的逻辑部分划分出来，形成栏目板块。其中还可使用
<div id=” “>给板块命名。
<table>： 制作表格。
用CSS 样式为表格添加边框：<style type=”text/css”>
黑色边框： table tr td，th{border：1px solid #000；}</style>
<caption>：为表格添加标题和摘要。 <table summary=’’”表格简介文本”>
<caption>标题文本</caption> </table>
<a>： 实现超链接。<a href=”目标网址” title=“鼠标滑过显示的文本”>链接显示的文本</a> 默认在当前浏览器窗口打开，添加“target—blank ”在新的浏览器窗口打开。
<mailto>： 在网页中链接Email 地址。 <a href=”mailto： yy@qq。com ?
Cc（抄送地址）=zsq@qq。com & bcc（密件抄送地址）=zjj@qq。com &
subject=”主题” & body=“邮件内容”>发送</a> 给多个收件人发送，用分号隔开。第一个参数用？开头，之后用 &隔开。
<img>： 添加图片。Src=”标识图像的位置。” alt=”指定图像的描述性文本，当图像不可见时（下载不成功时），可看到该属性指定的文本”
Title=“提供在图像可见时对图像的描述（鼠标滑过图片时显示的文本）”
<form>： 表单标签，与用户交互使得浏览器可以处理用户的数据。
<form method=”数据传送的方式（get/post）action=”浏览器输入的数据被传送到的地方，如一个 PHP 页面（save。php）””
<label for="username">用户名：</label>
<input type="text" name="username" id="username" value="" />
<label for="pass">密码：</label>
<input type="password" name="pass" id="pass" value="" /> 浏览器显示： 用户名： 肯定存，啊 密码：
表单文本输入框，密码输入框：<form><input type=”text/password”
name=”名称（以备后台使用）” value=“文本（设置默认值，提示作用）”>
文本域的多行输入：<textarearows（height）=”行数” cols（width）
=”列数”>文本</textarea>
单选框，复选框：<input type=”radio（单选框）/checkbox（复选框）”
value=” 值 ” name=” 名 称 ” checked= “ checked ” /> 当 设 置
checked=”checked”时，该选项被默认选中。同一组按钮，name 取值必须相同。
下拉列表框<select>：<label> XX </label>
<select>
<option value=”读书” selected=”selected（被默认选中）”>读书</option></select>
提交按钮 submit：<input type=”submit” value=”提交”>重置按钮 reset：<input type=”reset” value=”重置”>
<label>：<label for=”控件id 名称”>慢跑 </label>
<input type=”checkbox” name=”gender” id=”jogging” />
for 属性的值与id 属性值一定要相同。
Placeholder：<input type=”email” id=”email” placeholder=”Enter email”>该提示会在输入字段为空时显示，并会在字段获得焦点时消失。
CSS 样式：定义文本的显示样式，如字体大小（font-size），颜色（color），加粗（font-weight：bold）等。
注释语句：/*注释语句*/。
内联式 CSS 样式：<p style=”color：red ； font-size：12px”>红色字体</p>
嵌入式 CSS 样式：<style type=”text/css”>span{ }</style>
外部式 CSS 样式：在head 里写：<link href=”XX。css” rel=”stylesheet”
type=”text/css”>，在XX。css 里写：span{ }
三种方式的优先级：相同权值下，内联式 >嵌入式 >外部式。但是，嵌入式 >外部式的前提为嵌入式的位置一定在外部式的后面。
选择器：每一条CSS 样式定义由两部分组成：选择器{样式；}
标签选择器：如<html>，<body>，<h1>，<img>，<p font，，>。
类选择器：。类选择名称（可任意起名，。XX）{css 样式代码；} -> <span class=”XX”></span>
ID 选择器：#类选择名称（可任意，#XX）{css 样式代码；} -><span
id=”XX”></span>只能在文档中使用一次。
“>”子选择器：用于选择指定标签元素的第一代子元素。【直接后代】 first>span{border：1px solid red；} <span>我还是一个<span>胆小如鼠</span>的小女孩</span>
包含（后代）选择器：加入空格，用于选择指定标签元素下的后辈元素。【所有子后代元素】
通用选择器：由一个*指定，匹配html 中所有标签元素。在style 里：
*{color：red；}
伪类选择符 “ ：hover”：它允许给html 不存在的标签（标签的某种状态）设置样式。 a：hover{color：red；}鼠标滑过时字体变为红色。
分组选择符 “ ，”：为多个标签元素设置同一个样式。 如h1，p{ }。
继承：有些样式具有继承性如color，有些不具有如border。具有继承性的允许样式不仅应用于某个特定 html 标签元素，而且应用于其后代。
权值：标签的权值为1，类选择符的权值为10，ID 选择符的权值最高为 100。
p{color：red；} /*权值为1*/
p span{color：green；} /*权值为1+1=2*/
。warning{color：white；} /*权值为10*/
p span。warning{color：purple；} /*权值为1+1+10=12*/
#footer 。note p{color：yellow；} /*权值为100+10+1=111*/ 特殊性：继承也有权值，但是只有0。1 。
层叠：当有相同权重值时，后面的样式会覆盖前面的样式。
重要性 ！important ：p{color：red！important；}这时p 段落中的文本会显示红色。！important 要写在分号前面。
蓝蓝设计( www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、平面设计服务