2015年9月29日html基础加强学习笔记
创建一个最简便的浏览器
首先打开VS2010,然后在空间里拖出一个Form控件当主页面,其次拖出一个Textbox控件作为地址栏,然后加一个Button控件作为按钮,最后拖出一个WebBrowser作为显示界面。
然后点击Button按钮,然后书写代码
WebBrowser1.Navigate(textBox1.Text);
调整启动项:在资源管理其中右键属性,设置当前选定内容,然后选中要测试的选项,即可进行启动测试。
一些电脑中不显示后缀名怎么办?可以打开一个文件,按alt键,就会出现菜单栏,在工具选项中选择文件夹选项,点击查看,然后选择隐藏后缀名,将勾去掉即可。如何更改Notepad++新建文档的后缀名呢?需要把文档另存为,然后选择所有文件,并写后缀名为所需的,例如html。
符合规范的:<body bgcolor=”red” text=”blue”>啦啦啦啦</body>,在背景颜色和文字颜色属性中间是空格。
不符合规范的:<body bgcolor=”red”,text=”blue”>啦啦啦啦</body>,在背景颜色和文字颜色属性中间是逗号。
不符合规范的:<body bgcolor=red text=blue>啦啦啦啦</body>,属性值无双引号。
一般符合规范的是中间空格,而不是逗号,而且必须带双引号。而不符合规范的也可以写,也可以显示,但是不符合规范。在学习的时候要符合规范,在实际应用的时候为了能够减小文件大小,可以使用简化方式。
静态页面是什么?网页代码都在页面当中,不用执行asp、php、jsp、net等程序生成客户端代码。可以从网址后缀名判断。静态页面的效果是通过js和css来效果实现的。静态页面不能自主管理发布更新页面,如果想要更新内容,需要通过ftp软件把文件down下来用网页制作软件修改,通过fso等技术例外。一般静态页面后缀名html、htm等。
动态页面可以执行asp、php、jsp、net等程序生成客户端网页代码,同时可以通过后台管理对内容进行更新,动态页面的常见扩展名为asp、php、jsp、cqi等。动态是网站与客户端用户互动的意思,并不是网页上有动画显示。
色彩体系
www.w3school.com.cn→html基础教程→html颜色
每种颜色可有256种数值供选择。
红色0-255=>0~ff
绿色0-255
蓝色0-255
当指都为0的时候,是黑色,当值都为最大的时候,是白色。
一般用十六进制数来描述颜色,不用十进制数。
描述色彩使用:#00(红色)00(绿色)00(蓝色)六位十六进制数来描述一个颜色。
全红:#ff0000,全绿#00ff00,全蓝#0000ff
下载“截图软件”,右键有个取色,可以用来取自己想要的颜色的十六进制数。
HTML与XML区别
HTML与XML都可以通过DOM及CSS来控制页面,但是XML语法更严格。
Xml主要用来储存数据,而html则注重展示。
如可以使用<br />或者<br>在html里都可以完成换行命令,但是xml就不可以,会报错。
DOM就是document object model文档对象模型
html标签种类
文本标签:描述文本与字体
格式标签:控制文本排版、分隔等
链接与图表:跳转与锚定,显示图片
列表与表格:展示数据
表单标签:提交数据与服务器交互等
帧标签与分区标签:框架结构内嵌多个页面、分区使用样式
文本标签,标题标签<h1></h1>,数值只能取1-6,1是顶级标签,2次一级3再次一级等等。
如果单单改变文本里字体的大小,那么使用<font size=”7”>我</font>这是单单改变字体的大小。而标签里的字体大是由于是一级标签,分结构,具有优先级。
物理字体物理标签
<b>加粗</b>
<i>斜体</i>
<u>下划线</u>
<sup>上标</sup>
<sub>下标</sub>
<s>加删除线</s>
<tt>打字机</tt>
逻辑字体逻辑标签
<em>斜体</em>
<strong>强调加粗</strong>
<code>计算机代码文本</code>
<samp>计算机代码样本</samp>
<kbd>键盘文本</kbd>
<var>文本的变量部分</var>
<dfn>定义项目</dfn>
<cite>引用</cite>
<small>小号文本</small>
<big>大号文本</big>
为什么推荐使用逻辑字体而不是物理字体呢?因为物理字体主要用于显示,而逻辑字体为了表示包在这对标签里面它所应该表示的特定含义,对于搜索引擎优化有意义。
客户端字体font,如果需要修饰文字的颜色大小以及字体样式,就可以使用font客户端字体。Font的size属性值是1-7.
<font color=”red”>颜色</font>,<font size=”7”>大小</font>,<font face=”华文行楷”>客户端字体</font>
单标签
</br>是回车换行,还可<br/>或<br>
<hr/>创建一条水平线
格式标签
<p>段落</p>
<br/>换行
<center>居中</center>
<hr>分割线
Size(高度粗细)、width(宽度)、align(对齐方式)、noshade(是否有阴影)、color(颜色)
空格(一般文章里要空两个要4个 )
align是控制对齐,align:left/center/right等等。
例如<p align=”right”>右对齐</p>
插入图片(路径、修改图片像素、CSS图文混排图片右围绕文字)
<img src=”路径” width=”500px” style=”float:left”/>
<pre>预格式化,也就是在标签内的格式都得以保存,而不是像平常HTML代码中当前格式被忽略</pre>,少用tab空格键,因为不同浏览器对tab解析不同,多与逻辑字体一起使用。<code>表示逻辑字体里的代码,也就是这里面显示的是代码</code>
相对路径和绝对路径
<img src=”./02.jpg”/>或者<img src=”02.jpg”/>当前目录
<img src=”../02.jpg”/>代表父目录
<img src=”/02.jpg”/>代表根目录,根目录表示的是服务器的根目录与本地磁盘根目录有区别。
url超链接
<a href=”http://www.baidu.com” title:”当鼠标移到文字上时显示的字”>表示该链接被点击的时候执行什么东西,基本格式是协议:内容</a>
<a href=”mailto:jk@itcast.cn”>发邮件</a>
<a href=mailto:jk@itcast.cn?subject=520&body=我今天。。。此处省略一万字>发邮件</a>
效果为点击后弹出邮件框,收件人为邮箱地址,主题为520,内容为我今天。。。此处省略一万字。
<a href=”mailto:jk@itcast.cn”>发邮件</a>
<a href=”javascript:alert(‘哈哈’);”你点啊</a>使用的是js脚本代码,href执行js协议,也可以执行http协议。出现的效果是点击后弹出对话框哈哈。
Target属性
_blank在新窗口中打开
_self在当前窗口打开
_parent在父窗口打开
_top在顶级窗口打开
什么都不写,默认是本页跳转
<a href=”http://www.baidu.com”></a>
本页跳转
<a href=http://www.baidu.com target=”_self”></a>
在新窗口中打开
<a href=http://www.baidu.com target=”_blank”></a>
a标签常见属性
href协议、title鼠标放上去显示的内容、target跳转方式、name锚定,也就是网页回到顶部的功能。
回到顶部功能实现代码:
<body>
<a name=”start(可以随便写)”>开头</a>
</br></br></br></br></br></br></br></br></br></br></br></br></br></br></br></br>很多行
<a href=”#start”>底部</a>
</body>
锚定的另一种用法,跳转到其他页面:
网页1
<body>
<a name=”start(可以随便写)”>开头</a>
巴拉巴拉巴拉
</br></br></br></br></br></br></br><a href=”格式标签.html#d”>跳转到格式标签.html里面的d处</a></br></br></br></br></br></br></br></br></br>很多行
<a href=”#start”>底部</a>
</body>
网页2,路径当前目录格式标签.html
<body>
<p>
    巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉
</p>
<p>        <a name=”d”>我去</a></p>
</body>
实现的结果就是点击网页1的“跳转到格式标签.html里面的d处”,会跳转到网页2的“我去”处。
List列表
Type属性:A、a、I、i、1
有序列表order list(这里type的值是有序的,如果是1那么就按阿拉伯数字排列,如果是a,那么就按小写字母排列,如果是A按大写排列,如果是i按罗马数字排列)
<ol type=”1或a或A或i”>
<li>无序列表(unorder list)</li>
<li>有序列表(order list)</li>
<li>列表项(list item)</li>
</ol>
无序列表unorder list
Type属性:circle空心小圆圈,disk实心小圆圈,square实心小方块
<ul type=”circle”>
<li>无序列表(unorder list)</li>
<li>有序列表(order list)</li>
<li>列表项(list item)</li>
</ul>
自定义列表defined list
<dl>
<dt>自定义项(defined term)</dt>
<dd>自定义解释(defined definetion)</dd>
</dl>
表格:真行假列,左到右
<table></ table >表格
<tr></tr>行
<td></td>表格里的数据
Border框
< table border=”2” bordercolor=”#ff0000”>
<tr>
<td>第一行第一列</td>
<td>第一行第二列</td>
<td>第一行第三列</td>
</tr>
<tr>
<td>第二行第一列</td>
<td>第二行第二列</td>
<td>第二行第三列</td>
<tr>
<td colspan=”2”>第三行第一列</td>(横的占2格,手动控制第一行占两列)
竖的占2格,如果想要一行跨两列,那么用<td rowspan=”2”></td>
<td>第三行第二列</td>
</tr>
</tr>
</ table>
表格基本语法:Table,tr,td。表头th。标题caption,align是caption的一个属性,代表对齐方式。
<caption align=”top”>标题在上面</caption>
<caption align=”bottom”>标题在下面</caption>
Html表格相关属性
<table>→bgcolor表格背景色、border表格线宽、bordercolor表格颜色、cellspacing字与表格的间距、cellpadding表格与表格的间距、width表格宽、height表格高
<td>→align水平对齐方式、valign垂直对齐方式、bgcolor、width、height、colspan横跨、rowspan竖跨
Align属性→center居中、left居左、right居右
Valign属性→middle中间、top置顶、bottom最下
2015年9月29日html基础加强学习笔记的更多相关文章
- 2015年9月28日html基础了解学习
数据库与C#都是在后台运行的逻辑,而html,css,js,jq是在网页前台显示的一些效果.后台要考虑到优化性能效率等等,而前台要吸引到客户,要有更好的客户体验. 通用化,还是效率更高,在做项目中是要 ...
- 2015年12月28日 Java基础系列(六)流
2015年12月28日 Java基础系列(六)流2015年12月28日 Java基础系列(六)流2015年12月28日 Java基础系列(六)流
- 2015年4月29日 dayofweek
#include <stdio.h>#include <stdlib.h>int DayofYear(int year, int month, int day);#define ...
- 零基础学习云计算及大数据DBA集群架构师【企业级运维技术及实践项目2015年1月29日周五】
LNMP/LEMP项目搭建 { 项目框架 # Linux_____WEB_____PHP_____DB # rhel7_____apache__-(libphp5.so)-__php__-(php-m ...
- 2015年11月26日 Java基础系列(六)正则表达式Regex
package com.demo.regex; import java.util.regex.Matcher; import java.util.regex.Pattern; /** * @autho ...
- 2015年11月26日 Java基础系列(五)异常Exception
序,异常都是标准类Throwable的一些子类的对象. Throwable类的几个方法 1 getMessage() 返回描述该异常的信息 2 printStackTrace() 把消息和栈的跟踪记录 ...
- 2015年11月26日 Java基础系列(四)class的定义,继承和实现interface
序,类的设计是JAVA操作的核心,面对对象思想中一切皆对象. 一.类定义中的变量 静态成员变量,为类所有,称为类变量:只有一份,编译时即分配值,使用关键字static声明. 非静态成员变量,每个实例一 ...
- 2015年11月26日 Java基础系列(一)之String与StringBuffer与StringBuilder的区别
序,StringBuffer是线程安全的,StringBuilder是线程不安全的,但是StringBuilder操作速度快,因此在使用时要根据场景合理选择. StringBuffer和StringB ...
- 2015年11月26日 Java基础系列(三)ThreadLocal类初级学习
序,ThreadLocal类是为了解决多线程的安全问题.线程安全的意思也就是说每个线程操作自己的变量,不要对其他线程的值造成影响. 在很多情况下,ThreadLocal比直接使用synchronize ...
随机推荐
- HTML5课程大纲/学习路线
HTML5课程大纲/学习路线 这是什么? 这个一个HTML技术路线的课程大纲/学习大纲. 你能用它做什么? 如果你是找工作的人, 利用本大纲, 你可以学习HTML5语言, 做一个HTML前端工程师, ...
- ORA-12012 error on auto execute of job 8887
*** ACTION NAME:(AUTO_SPACE_ADVISOR_JOB) -- ::58.046 *** MODULE NAME:(DBMS_SCHEDULER) -- ::58.046 ** ...
- [转]利用/*+Ordered*/提高查询性能
[转]利用/*+Ordered*/提高查询性能 2009-02-06 10:46:27| 分类: Oracle | 标签: |字号大中小 订阅 消耗在准备利用Oracle执行计划机制提高查询性能 ...
- vim emmet配置
http://nerd-is.in/2013-12/learning-vim-again-1-install-vundle/ http://nerd-is.in/2013-12/learn-vim-a ...
- windows下STM32开发环境的搭建
一.概述 1.说明 笔者已经写了一篇Linux下STM32开发环境的搭建 ,这两篇文章的最区别在于开发环境所处的系统平台不一样,而其实这个区别对于开发环境的搭建其实影响不大,制作局部上的操作上发生了改 ...
- 大话string
最近看完大话string之后深有感悟,虽然写c#不知不觉的已经写了四年了,但是很多原理也一直不太明白,最近看完这个才算略微明白了一些. string类型有2个重要的特性,一致性和驻留性. 一致性就是说 ...
- Python之创建tuple
tuple是另一种有序的列表,中文翻译为" 元组 ".tuple 和 list 非常类似,但是,tuple一旦创建完毕,就不能修改了. 同样是表示班里同学的名称,用tuple表示如 ...
- import information website
1. 一个很好的展示如何review paper和response to reviewer的网站:openview 该网站给出了许多paper review的例子(如何你是reviewer,那么可以参 ...
- 网页上PNG透明图片的ie6bug
只有IE6有这个Bug,所以的写法这样就可以了 #png{background:url(../images/png32.png) no-repeat;_filter:progid:DXImageTra ...
- BZOJ 1729: [Usaco2005 dec]Cow Patterns 牛的模式匹配
Description 约翰的N(1≤N≤100000)只奶牛中出现了K(1≤K≤25000)只爱惹麻烦的坏蛋.奶牛们按一定的顺序排队的时候,这些坏蛋总会站在一起.为了找出这些坏蛋,约翰让他的奶牛排好 ...