`
java风
  • 浏览: 57435 次
  • 来自: 北京
社区版块
存档分类
最新评论
  • 泛泛evil: 总结的很好,谢谢分享
    JavaScript
  • wanxkl: 哇!总结的太好了。。凤哥哥,你好强大啊。。请问您跟凤姐什么关系 ...
    css应用

Html

    博客分类:
  • java
阅读更多

HTML

超链接:{

<a href=http://www.baidu.com>百度一下,你就知道</a>

Frameset属性1cols=30%,200,*:以列方式分割,左半部占30%,中间部分200pixel,剩下为第三部分;

2rows=30%,200,*:以行方式分割,上半部占30%,中间部分200pixel,剩下为第三部分;

3border=1:框线宽度pixel

4frameborder=yes:是否显示框线,no不显示框线。

Frame定义子网页1scrolling=No:不会有scrolling bar,默认为yes

2Noresize:使用者无法调整分割网页的大小。

<a>标签中的target属性1、指定名称:名称为frame名称;

2、打开一个新窗口(_blank);

3、链接会开启在原本窗口中,并占满整个浏览器窗口(_top);

4、占满目前子网页的frameset所指定区域(_parent)。

例如:<a href="http://www.baidu.com" target="_blank">百度</a>

  <a href="http://www.google.com" target="_blank">谷歌</a>

  <a href="http://www.163.com" target="_blank">网易</a>

  <a href="http://www.sina.com" target="_blank">新浪</a>

  <a href="http://www.sohu.com" target="_blank">搜狐</a>

例如:邮箱页面

父页面<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>

        <frameset cols="30%,*">

        <frame src="media.html" scrolling="no" Noresize>

        <frame src="welcome.html" name="main" Noresize>

        </frameset>

</html>

  菜单栏(30%

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>

        <head>

        <title>media.html</title>

    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">

    <meta http-equiv="description" content="this is my page">

    <meta http-equiv="content-type" content="text/html; charset=UTF-8">

    

    <!--<link rel="stylesheet" type="text/csshref="./styles.css">-->

    <link rel="stylesheet" type="text/css" href="../css/style.css">

  </head>

  

  <body class="first">

  <p> </p>

  <p> </p>

  <p> </p>

      <a href="writer.html" target="main" >写信</a>

    <br/>

      <a href="receive.html" target="main">收件箱</a>

    <br/>

      <a href="caogao.html" target="main">草稿箱</a>

    <br/>

      <a href="yifasong.html" target="main">已发送</a>

    <br/>

      <a href="lajixiang.html" target="main">垃圾箱</a>

    <br/>

      <a href="denglu.html" target="_top">退出</a>

  </body>

</html>

   可变网页(70%):

   <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>

  <head>

    <title>welcome.html</title>

    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">

    <meta http-equiv="description" content="this is my page">

    <meta http-equiv="content-type" content="text/html; charset=UTF-8">

    

    <!--<link rel="stylesheet" type="text/csshref="./styles.css">-->

    <link rel="stylesheet" type="text/css" href="../css/style.css">

  </head>

  

  <body id="second">

      <p> </p>

  <p> </p>

  <p> </p>

    <h3 align="center">欢迎进入邮箱,你有2<a href="receive.html">未读邮件</a>,请阅读<h3>

  </body>

</html>

}

图片作为超链接:{

<a href=http://www.baudu.com><img src=../images/23.jpg></a>

例如:<a href="http://www.baidu.com"><img src="23.jpg" width="100px" height="100px"/></a>

}

创建邮件链接:{

<a href=mailto:test@163.com?subject=AboutHTML>发邮件给我</a>

例如:<a href="mailto:zhangsan@163.com?subject=good">张三</a>

  <a href="mailto:lisi@163.com?subject=bad">李四</a>

}

<img>标签的属性:{

src:图像文件地址;

width:图像宽度;height:图像高度;

border:图像边框;

alt:给图像显示一个“交互文本”,图像找不到时显示;

title:鼠标放到图片上面即显示。

例如:<img alt="图片已经失效" title="这是孙俪" src="233.jpg" width="200px" height="200px"/>

}

<hr>标签:{

例如:<hr size="1" color="red" width="80%" align="left"/>

}

5秒钟后页面自动跳转到百度:{

<meta http-equiv="refresh" content="5;URL=http://www.163.com">

}

列表:{

   有序列表:

       <ol>

       <li>coffee</li>

       <li>tea</li>

       <li>milk</li>

       </ol>

   无序列表:

       <ul>

       <li>coffee</li>

       <li>tea</li>

       <li>milk</li>

</ul>

   例如:<ol>

   <li>踢足球</li>

   <li>打篮球</li>

   <li>打拳皇</li>

   <li>学习</li>

   <li>写代码</li>

    </ol>

<ul>

<li>踢足球</li>

<li>打篮球</li>

<li>打拳皇</li>

<li>学习</li>

<li>写代码</li>

</ul>

}

表格:{-

<table>

<th>表格头

<tr>

<td>列:1colspan=2跨两列;

        2rowspan=2跨两行;

        3align=leftrightcenter对齐方式。

例如:

<body>

<table border="1" align="center" bordercolor="red">

<tr>

<th>

姓名

</th>

<th>

性别

</th>

<th>

职业

</th>

<th>

备注

</th>

</tr>

<tr>

<td>

李小龙

</td>

<td>

</td>

<td>

影视巨星

</td>

<td>

曾经

</td>

</tr>

<tr>

<td>

李连杰

</td>

<td>

</td>

<td>

影视巨星

</td>

<td>

现役

</td>

</tr>

<tr>

<td>

李冰冰

</td>

<td>

</td>

<td colspan="2">

影后

</td>

</tr>

</table>

  </body>

}

表单:{

  <form name=formTest action=”” method=post>

  name:表单的名称;

  actionform表单的提交路径; 

  method属性指的是提交的方式  有两个值 get或者是post

   1.get提交方式

   1).表单中提交的表单域的值(该次请求的参数列表)会显示在地址栏中的问号后面  所有安全性较低 

   凡是涉及到数据安全问题  那么不能采用get的提交方式

   2).不能传递数据量过大的数据

   2.post提交方式

   1).表单中提交的数据并不会显示在地址栏中  而是保存到了一个HttpServletRequest对象中  安全性较高

   凡是涉及到数据传递安全问题 都采用post提交方式  比如 登录 注册的密码问题

   2).传递大数据量数据时一定要采用post的提交方式  比如 上传文件

  

   注意:真正开发中get提交方式应用更为广泛  所有的超链接 以及在地址栏中直接输入地址的请求方式都是get提交方式

表单域:可以写或者可以选择的文本框。表单域的name属性值作用:将该表单域的value值在表单提交时提交给服务器,有name值该表单域的value属性值可以提交,没有则不能提交,所以表单中 所有需要提交给服务器的表单域都应该加上name属性,但是像提交按钮这种表单域,服务器对于它的value没有兴趣(没用)

文本框:

<input type=test name=firstname value=”” maxlength=10>

密码框:

<input type=password name=password value=”” maxlength=6>

文本域:

<textarea rows=10 cols=30 name=despcriprion>

单选按钮:

<input type=radio name=sex value=male checked>

<input type=radio name=sex value=female >

例如:

<!-- 注意:实现同一功能的单选按钮的name属性值必须要保持一致 -->

   <input type="radio" name="sex" value="0"/>

   <input type="radio" name="sex" value="1"/>

   <input type="radio" name="sex" value="2" checked/>保密

   <br>

复选按钮:

   <!-- 注意:实现同一功能的复选按钮的name属性值建议保持一致 -->

   <input type="checkbox" name="hobby" value="0" checked/>打篮球

   <input type="checkbox" name="hobby" value="1" checked/>踢足球

   <input type="checkbox" name="hobby" value="2"/>游泳

   <input type="checkbox" name="hobby" value="3"/>学习

   <input type="checkbox" name="hobby" value="4" checked/>睡觉

下拉列表:

     <select name="province" id="province">

   <option selected=true value="000">请选择省</option>

   <option value="001">河北</option>

   <option value="002">河南</option>

   <option value="003">山东</option>

   <option value="004">山西</option>

   <option value="005">湖南</option>

复选下拉列表:

    <select name="province" id="province" multiple>

   <option selected=true value="000">请选择省</option>

   <option value="001">河北</option>

   <option value="002">河南</option>

   <option value="003">山东</option>

   <option value="004">山西</option>

   <option value="005">湖南</option>

   隐藏域:用来保存一些不需要显示给用户看但是要提交给服务器的内容。

       <input type=hidden name=hidden1 value=abc>

以上name属性值必须写,需要向服务器提交value,下面几个按钮则可以不写。

<input type=reset value=重置按钮>

<input type=button value=普通按钮>

<input type=submit value=提交按钮>

readonly将文本框变为只读,disabled将按钮置成灰色不可操作(disabled=true),两者的区别是用(disabled时)提交时地址栏不显示该项信息。

}

<!--EndFragment-->
分享到:
评论

相关推荐

    winfrom中嵌套html,跟html的交互

    在Windows Forms(WinForms)应用开发中,有时候我们需要在应用程序中展示富文本或者实现复杂的用户交互,这时可以采用嵌入HTML的方式。本文将详细介绍如何在WinForms中嵌入HTML,并与HTML进行交互,同时通过提供的...

    C# HtmlToWord 将HTML文件转换成word文档

    在IT行业中,经常需要处理各种格式的文档,例如HTML和Word。HTML主要用于网页设计和开发,而Word则是常用的文本编辑工具,尤其适合制作报告、合同等格式化文档。本篇文章将详细探讨如何利用C#编程语言实现从HTML文件...

    html2image 2.0.3 用于简单的html转图片

    Html2Image html2Image = Html2Image.fromHtml(sb.toString(),null); // 这边如果设置false,图片不会自动根据内容设置长宽默认长1024 ,宽768 //html2Image.getImageRenderer().setAutoHeight(false); ...

    html5网站实例

    HTML5是现代网页开发的核心标准,它在原有HTML4的基础上引入了诸多新特性,极大地提升了网页的交互性和表现力。本实例将详细讲解如何利用HTML5来构建一个完整的网站,包括布局、登录功能以及内容展示。 一、HTML5的...

    JS-HTML-Format(JS及HTML代码格式化工具集合)

    针对JS(JavaScript)和HTML(超文本标记语言)这两种广泛使用的前端开发语言,有多种代码格式化工具可以帮助开发者实现这一目标。下面将详细介绍这些工具及其特点。 1. **JS Beautify**: JS Beautify是一款开源...

    Android TextView显示html的demo

    在Android开发中,有时我们需要在TextView中展示富文本内容,比如HTML格式的文本,这能够增强界面的表现力,包括插入图片、设置字体样式等。这个"Android TextView显示html的demo"就是专门为了实现这一功能而设计的...

    html 个人网站 源码

    HTML个人网站源码是构建网页或简单网站的基础框架,它包含HTML、CSS和可能的JavaScript文件,这些元素共同构成了一个动态、交互式的网络界面。在这个压缩包中,我们看到的是一个名为“经典三列布局整套模板”的项目...

    html期末大作业

    HTML(HyperText Markup Language)是用于创建网页的标准标记语言,它是互联网上应用最广泛的语言,也是构建网页的基础。在这个“html期末大作业”中,我们可以推测这是一个学生或学习者为了完成课程要求,练习并...

    html2pdf_中文

    在IT行业中,HTML to PDF转换是一项常见的需求,特别是在网页内容需要离线阅读或者打印时。`html2pdf`是一个PHP库,它允许开发者将HTML页面转换为PDF文档,从而实现这个功能。`html2pdf`库特别强调了对中文的支持,...

    HTML静态网页模板下载大全

    HTML静态网页模板是网页设计中常见的一种资源,它是由HTML、CSS和JavaScript等技术构建的预设布局和设计。这些模板通常包含多个页面,如首页、关于我们、联系我们、产品展示等,为创建网站提供了一个快速而高效的...

    50余款手机页面模版源码html5

    50余款手机页面模版源码html5 1.1【32赞HTM5响应式系列之右侧多级滑动式】仿Slideby触屏版html5响应式手机wap网站模板 2【32赞HTML5响应式系列之订餐模板】微官网美食订餐html5触屏响应式手机wap网站订餐模板 5【32...

    html2fpdf 中文支持

    html2fpdf 或 html2pdf 是在fpdf上开发的一个可以将html页面转换为pdf文件的PHP类。 官方网址 http://sourceforge.net/projects/html2fpdf/ 近日,由于开发项目需要,需要一个能将页面转换为pdf的插件,以供客户端...

    HTML转PDF 非常好用

    HTML到PDF转换是一种常见的需求,尤其在Web开发和文档生成领域。Aspose.Pdf是一款强大的.NET库,专门用于处理PDF文档,其中包括将HTML转换为PDF的功能。以下是对这个主题的详细探讨。 首先,理解HTML(超文本标记...

    通过SpringBoot访问HTML页面源码

    在本文中,我们将深入探讨如何使用SpringBoot框架访问和处理HTML页面。SpringBoot以其便捷的配置和快速的应用开发而闻名,使得构建Web应用程序变得更加简单。本实例将展示一个清晰、简洁且注释丰富的代码示例,帮助...

    纯HTML网页源码

    HTML,全称HyperText Markup Language,即超文本标记语言,是构建互联网页面的基础。它是一种标记语言,通过一系列标签来描述网页的结构和内容。"纯HTML网页源码"指的是只包含HTML代码,不依赖其他如JavaScript、CSS...

    FreshHTML3.32.0.0汉化版

    FreshHTML是一款广受欢迎的HTML编辑器,其3.32.0.0汉化版为中文用户提供了极大的便利。这款编辑器的最大特点是它的所见即所得(WYSIWYG)功能,这意味着用户在编辑HTML代码时,可以直接看到页面的实际显示效果,极大...

    html静态页面源代码

    HTML(HyperText Markup Language)是一种标记语言,用于创建网页内容并定义其结构。在这个"html静态页面源代码"的压缩包中,包含了四个HTML源文件,它们是构建静态网站的基础。静态网站指的是不包含服务器端动态...

    html5饼图、柱状图、折线图,Html5+JS开发

    HTML5是一种先进的网页标准,它在图形和交互性方面提供了许多增强功能,使得开发者能够创建出更加生动和富有表现力的网页应用。本资源包含了一系列使用HTML5和JavaScript技术实现的图表,包括饼图、柱状图和折线图,...

    HTML日期选择控件

    HTML日期选择控件是网页开发中常用的一种交互元素,它允许用户方便地选取日期,常用于表单提交、日程安排或时间记录等场景。在HTML5中,引入了`&lt;input type="date"&gt;`标签,为开发者提供了一个内置的日期选择控件,但...

    html2canvas.js 下载

    《html2canvas.js:网页截屏的利器》 在当今的Web开发中,用户界面的交互性和可分享性越来越重要,而html2canvas.js正是实现这些功能的关键工具。这个JavaScript库允许开发者将网页的HTML结构及其CSS样式转换为...

Global site tag (gtag.js) - Google Analytics