html第一阶段总结
html格式汇总
<!doctype html><!-- html5格式声明 -->
<html lang="en"><!-- 语言,en为英语,zh为中文 -->
<head><!-- 头部 -->
<meta charset="UTF-8"><!-- 编码声明 -->
<meta name="keyword" content="关键字1,关键字2,..."><!-- 声明关键字 -->
<meta name="description" content="内容介绍"><!-- 声明内容,网站描述 -->
<title>窗口主题</title><!-- 窗口主题 -->
</head>
<body><!-- 身体 -->
页面内容
</body>
</html>
常用元素汇总
<h1>标题1 <!-- 标题标签,1-6,最大为1,最小为6 -->
<h2>标题2<br/><!-- br换行标签 -->
<b>加粗</b><strong>html5的加粗</strong>
<i>斜体</i><em>html5的斜体</em>
<del>定义删除的文本</del><br/>
X<sup>上标</sup>Y<sub>下标</sub>
拓展:
<ruby><!-- 拼音 -->
广州<rt>guangzhou</rt>
北<rt>bei</rt>京<rt>jing</rt>
</ruby>
<mark>标记,涂色</mark>
超链接:
<a href="http://www.baidu.com">点击跳转到百度</a><!-- 链接必须有http:// -->
<a href="index.html">点击跳转到当前文件目录下的index.html页面</a>
<a href="myweb/index.html">点击跳转到当前文件目录的myweb文件夹下index.html页面</a>
<a href="../myweb/index.html">
点击跳转到当前文件目录的上一级目录的myweb文件夹下index.html页面</a>
<a href="myweb/index.html" target="_blank" title="提示信息">在新窗口打开</a>
<a href="myweb/index.html" target="_self" title="提示信息">在当前窗口打开</a> 锚点:
<a name="A" id="A">位置A</a>
<a href="#A">跳转到位置A</a> <!-- 锚点的name和id应保持一致,原因是部分浏览器认name,部分认id -->
其他:
<a href=“mailto:邮箱地址”>邮件链接</a>
<a href=“tel:电话号码”>一键拨打</a>
<a href="sms:139xxxxxxx">一键发送短信</a>
图像基本属性:
<img src="图片地址" width="图片宽" height="图片高" alt="显示失败时的提示文字" >
图像热区:
<img src="url" usemap="#map001"><!-- 指定热区方案为map001 -->
<map name="map001">
<area shape="rect" coords="x1,y1,x2,y2" href="url001" />
<area shape="circle" coords="x,y,r" href="url002" />
<area shape="poly" coords="x1,y1,x2,y2,x3,y3..." href="url003">
</map>
视频,音频:
<audio src="xx.ogg/mp3"><!-- 音频 -->
<source src="XX.ogg" type="audio/ogg">
<source src="XX.mp3" type="audio/mpeg"><!-- 考虑兼容性会用source代替src -->
<P>不支持音频时的提示信息
</audio>
<video src="XX.mp4" width="视频宽" height="视频高">
<source src="XX.ogg" type="video/ogg">
<source src="XX.mp4" type="video/mp4"><!-- 考虑兼容性会用source代替src -->
<p>不支持视频时的提示信息
</video>
<!-- 视频音频的相同属性:
autoplay 页面载入后直接自动播放
controls 向用户显示控件,比如播放按钮,进度条,全屏按钮
loop 当媒介文件完成播放后再次开始播放
preload 预加载,自动缓冲 视频独特属性:
muted 静音播放
poster 视频封面 -->
列表:
<ul type="disc/circle/square"><!-- type默认为disc,circle为空心圆,square为矩形 -->
<li>无序列表</li>
<li>无序列表</li>
<li>无序列表</li>
</ul> <ol type="1/a/A/I" start="第一项的开始数字/字母">
<li>有序列表</li>
<li>有序列表</li>
<li>有序列表</li>
</ol> <dl><!-- 定义列表 -->
<dt>专有名词</dt>
<dd>定义</dd>
</dl>
表格:
<table border="边框线粗,自然数" bgcolor="背景颜色" width="宽度" height="高度" cellpadding="表格内容与边框距离" cellspacing="表格与表格之间的距离" align="水平对齐方式left/center/right" valign="垂直对其方式top/center/buttom">
<th>表头1</th><th>表头2</th>
<tr tr表示一行表格><td>表格1</td><td>表格2</td></tr>
<tr tr表示一行表格><td>表格3</td><td>表格4</td></tr>
</table>
<!-- 其他属性:
colspan:合并列数
rowspan:合并行数 -->
简单的表单:
<form align=center action="提交页面" methor="提交方法get/post"><!-- 一个form表示一个完整的表单 -->
账号:<input type="text"><br/>
密码:<input type="password"><br/>
<input type="submit" value="确定">
</form>
表单lable标签作用:
<label for="username">账号:</label><!-- lable的for属性对应input的id属性 -->
<input type="text" id="usename">
表单其他属性:
placeholder:占位符,常用于提示
readonly:只读,无法点击输入
disable:禁用,表单变成灰色
maxlength:可以输入的字符最大长度
autocomplete:提交后记录输入信息,必须同时有name属性
autofocus:页面载入后光标自动放在该表单,用于搜索表单
min:最小值,用于数量表单
max:最大值,同上
step:数量的间隔,如2,则间隔效果为1,3,5,7...
pattern:格式,值为正则表达式,用于表单验证
表单类型:表单类型较多,建议一个一个打出来看效果
框架:
<iframe src="内嵌页面地址,若为网上地址,必须有http://" width="宽度" height="高度" scrolling="滚动条:yes/no/auto" frameborder="边框:0/1"></iframe>
a标签拓展:
a {text-decoration:none;} <!-- 消除下划线 -->
a:link {color:#000000;text-decoration:none;} /* 未被访问的链接 */
a:visited {color:#000000} /* 已被访问过的链接 */
a:hover {text-decoration:underline} /* 鼠标悬浮在上的链接 */
a:active {color:#000000} /* 鼠标点中激活链接 */
html第一阶段总结的更多相关文章
- PHP四个阶段目标以及第一阶段学习内容
PHP课程体系主要分为四个阶段,第一阶段讲的是网页HTML和数据库MySQL,第一阶段要学会网页制作的基础知识,熟用各种基本标签,对数据库进行操作,各项考核都能够达标,拿出出众的项目展示. 在第二个阶 ...
- Bete冲刺第一阶段
Bete冲刺第一阶段 今日工作: github团队协作流程 web:调整dao层设计,增加新的dao组件 客户端:之前遗留的界面跳转的BUG 目前所遇问题: 第一,COCOAPODS的安装上还是有点问 ...
- java - 第一阶段总结
java - 第一阶段总结 递归 递归:能不用就不用,因为效率极低 package over; //递归 public class Fi { public static void main(Strin ...
- 自我总结(六)---(学习j2ee+j2ee第一阶段项目)
自我完善的过程就是在不断的自我总结不断的改进. 学习了Struts2 Spring Hibernate. 十天前结束了这个课程.也考试了.这次考试老师说机试考的还不错.其实就是一个简单的用户登录,进行 ...
- JAVA EE 第一阶段考试
在第一阶段中我们学习了Spring Struts2 Hibernate.虽然在外面的公司中,公司项目的框架中都不在使用Struts2了.他好像出现了不可修复的bug.但是在学校,依然还是要学习这个.在 ...
- Java第一阶段总结
学习java已经一个多月的时间了,第一阶段总算完成了. 这中间遇到很多问题,通过问同学问学长,收获了很多,但也知道自己和其他同学相差很远.他们java第一阶段只用了不到一个月的时间,而我拖了很长时间, ...
- [原创].NET 业务框架开发实战之十 第一阶段总结,深入浅出,水到渠成(后篇)
原文:[原创].NET 业务框架开发实战之十 第一阶段总结,深入浅出,水到渠成(后篇) .NET 业务框架开发实战之十 第一阶段总结,深入浅出,水到渠成(后篇) 前言:接着上篇来. 系列文章链接: [ ...
- OO第一阶段总结
OO第一阶段总结 一.各次作业程序结构 第一次作业 第一次作业由于初用JAVA,还没有深刻理解面向对象的编程方法,故在编程过程中只用了一个类,一个方法,即完成了相应的程序功能.这必然不是本课程的目的, ...
- 坚持:学习Java后台的第一阶段,我学习了那些知识
最近的计划是业余时间学习Java后台方面的知识,发现学习的过程中,要学的东西真多啊,让我一下子感觉很遥远.但是还好我制定了计划,自己选择的路,跪着也要走完!关于计划是<终于,我还是下决心学Jav ...
- 做生活的有心人——xxx系统第一阶段总结
2017秋,桃子已经步入大学三年级了,觉得格外幸运 因为现在,有了学习的动力. 如果你和我一样也是在大学中后部分才意识到,自己是个大人了,思维模式开始转变开始融入一些前所未有的认知,觉得自己渺小得如沧 ...
随机推荐
- tar等
tar格式,会打包成一个文件,可以对多个目录,或者多个文件进行打包tar命令只是打包,不会压缩,打包前后大小是一样的 tar命令 -c //打包-x //解压-f //指定文件-t //查看 tar ...
- Windows Internals学习笔记(七)Image Loader
参考资料: 1. <Windows Internals> 2. Fibers 知识点: ● 当一个进程在系统上启动时,内核将创建一个进程对象来代表它,并执行各种内核相关的初始化任务.然而, ...
- 初识onselectstart
onselectstart几乎可以用于所有对象,其触发时间为目标对象被开始选中时(即选中动作刚开始,尚未实质性被选中). 实例: 在做拖拽效果的时候,为了防止js选中页面上的其他元素,onselect ...
- 让IE7 IE8支持CSS3 background-size属性
简介 CSS3 新增的 background-size 是一个很有用的属性,用于定义背景图片的尺寸,有了这个属性,你就可以任意指定背景图片的大小.其中最常用的值应该要数 cover 了,该值能让背景图 ...
- STM32学习笔记(九) 外部中断,待机模式和事件唤醒
学会知识只需要不段的积累和提高,但是如何将知识系统的讲解出来就需要深入的认知和系统的了解.外部中断和事件学习难度并不高,不过涉及到STM32的电源控制部分,还是值得认真了解的,在本文中我将以实际代码为 ...
- 【转载】CSS规范
原文地址:http://www.cnblogs.com/whitewolf/p/4491707.html 目录 HTML 语法 HTML5 doctype 语言属性(Language attribut ...
- iOS开发 利用Reachability判断网络环境
导入头文件:#import "Reachability.h" 然后将 SystemConfiguration.framework 添加进工程: 1.检查当前的网络状态(wifi.W ...
- LayoutInflater和inflate()
LayoutInflater LayoutInflater抽象类是用来加载XML布局文件(UI界面)的. 作用: 1.对于一个没有被载入或者想要动态载入的界面,都需要使用LayoutInflater. ...
- SPSS数据分析—重复测量差分析
多因素方差分析中,每个被试者仅接受一种实验处理,通过随机分配的方式抵消个体间差异所带来的误差,但是这种误差并没有被排除.而重复测量设计则是让每个被试接受所有的实验处理,这样我们就可以分离出个体差异所带 ...
- maven入门探讨
java项目最恶心的一点莫过于需要使用大量的jar.每次引用jar的时候都要自己手动去各地寻找,然后导入到项目的指定文件夹当中最后还要添加Path.这无疑是一项工作量巨大的工作,同时如果控制不当就会提 ...