1.javaWeb技术体系

2.HTMl 超文本标记语言 （超文本的意思就是除了可以包含文字之外，还可以包含图片链接音乐视频等。。。）

　　2.1 HTML网页的组成  （结构：HTML 表现：CSS 行为：Ja vaScript JQuery）

　　2.2 常用HTML标签

　　　　1）： html 根标签

　　　　2）： head 头标签

　　　　3）： body 体标签

　　　　4）： h　   标题标签

　　　　5）： a       超链接

　　　　6）： table  表格

　　　　7）： form   表单   表单的method如果是get那么在浏览器的地址栏会有详细信息，如果是post则没有

1. HTML代码

 1 <!DOCTYPE html>

 2 <html>

 3 <head>

 4     <!-- 设置当前页面使用的字符集，同时也告诉浏览器使用该字符集进行解码 -->

 5     <meta charset="UTF-8" />

 6     <!-- 设置浏览器标签页中显示的标题 -->

 7     <title>Hello World</title>

 8 </head>

 9 <body>

10     <!-- 注释快捷键是ctrl + shift + / -->

11     <!--行注释的快捷键是Ctrl+shift+c -->

12     我的第一个网页

13     写完记得保存

14 </body>

15 </html>

hello world

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>常用标签</title>

</head>

<body>

    <!--标题标签 一共6个  -->

    <h1> 一级标签</h1>

    <h2> 二级标签</h2><br/>

    <!-- 标题与换行，<br>是换行 -->

    <h3> 三级标签</h3>

    <h4> 四级标签</h4>

</body>

</html>

常用标题以及换行br

 1 <!DOCTYPE html>

 2 <html>

 3 <head>

 4 <meta charset="UTF-8">

 5 <title>Insert title here</title>

 6

 7 <!-- 统一修改当前页面链接的跳转方式  如果后续链接没有单独设置的话 -->

 8 <base target="_self">

 9 </head>

10 <body>

11     <!--使用a标签创建一个超链接

12             href属性：用来设置要跳转的页面的路径

13             target属性：用来设置跳转的页面在何处打开

14                 _self:默认。在当前标签页打开

15                 _blank：在新的标签页打开

16              -->

17         <a href="./tag.html">hello</a><br>

18         <a href="./tag.html" target="_self">hello world</a>

19         <!--  -->

20 </body>

21 </html>

超链接于属性

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>this is label HTML</title>

</head>

<body>

<!-- 通过table标签创建一个标签表格 -->

    <table border="1">

    <!-- 表格中的行使用tr标签表示 -->

        <tr>

            <!-- 表格中的表头使用th标签表示 -->

            <th>姓名</th>

            <th>职业</th>

            <th>阵营</th>

            <th>武器</th>

        </tr>

        <tr>

            <td rowspan="2">liubei</td>

            <td>a</td>

            <td>b</td>

            <td>c</td>

        </tr>

        <tr>

        <!-- 跨行合并单元格 -->

            <td >guanyu </td>

            <td>a1</td>

            <!-- 跨列合并单元格 以及居中-->

            <td colspan="2" align="center">b1</td>

        </tr>

    </table>

</body>

</html>

表格的跨行列合并于居中

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>Insert title here</title>

</head>

<body>

    <!-- 使用form标签创建一个表单

        action属性：指定服务器的地址

        method属性：指定表单的请求方式

            get：默认值，发送一个get请求，用户的数据通过浏览器的地址栏进行传输

            post：发送一个post请求名用户输入的数据通过请求体

    -->

    <form action="taget.html" method="post">

        <!-- 表单中的表单项使用input表示，不同的表单项通过type属性指定 -->

        <!-- 用户输入的数据通过name属性值进行携带，并以键值对的形式发送到服务器，多个键值对之间使用&符号分隔

            例如：user=admin&psd=123456 -->

        用户名：<input type="text" name="user"><br>

        密码：<input type="password" name="psd"><br>

        <!-- 通过value来指定按钮上显示的文字 -->

        <input type="submit" value="login">

    </form>

</body>

</html>

表单

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>古诗词</title>

<style type="text/css">

    /* 标签选择器 */

    h1 {

    color:red

    }

    h2 {

        background-color: red

    }

/*ID选择器

格式：#id属性值

*/

    #p1{color:green}

    /*类选择器

    格式：.class (该处的点class不能忽略点)

    */

    .p2{color:blue}

    /*分组选择器

    格式：将各个选择器之间使用逗号分隔  */

    #p1,.p2{font-size:30px}

</style>

</head>

<body>

    <h1>静夜思</h1>

    <h2>唐。李白</h2>

    <p id="p1">hi mygirfrined</p>

    <p class="p2">hi my boy frined</p>

    <p class="p2">hi my boy frined</p>

    <p class="p2">hi my boy frined</p>

    <p>hi my boy frined</p>

    <div>我是div标签，默认占用浏览器的一整行，我是用来布局的</div>1111

</body>

</html>

选择器设置字体颜色等css

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>古诗词</title>

<style type="text/css">

    /* 标签选择器 */

    h1 {

    color:red

    }

    h2 {

        background-color: red

    }

/*ID选择器

格式：#id属性值

*/

    #p1{color:green}

    /*类选择器

    格式：.class (该处的点class不能忽略点)

    */

    .p2{color:blue}

    /*分组选择器

    格式：将各个选择器之间使用逗号分隔  */

    #p1,.p2{font-size:30px}

</style>

</head>

<body>

    <h1>静夜思</h1>

    <h2>唐。李白</h2>

    <p id="p1">hi mygirfrined</p>

    <p class="p2">hi my boy frined</p>

    <p class="p2">hi my boy frined</p>

    <p class="p2">hi my boy frined</p>

    <p>hi my boy frined</p>

    <div class="p2">我是div标签，默认占用浏览器的一整行，我是用来布局的</div>1111

    <!--

        颜色表达方式：

        1.使用英文单词表示

            例如：红色：red

        2.使用rgb值表示

            例如：rgb（255,255,255）

        3.使用十六进制数

            例如红色：#FF0000

     -->

</body>

</html>

颜色表达方式

一：JavaWeb的更多相关文章

  1. 从啥也不会到可以胜任最基本的JavaWeb工作，推荐给新人的学习路线（二）

    在上一节中,主要阐述了JavaScript方面的学习路线.先列举一下我朋友的经历,他去过培训机构,说是4个月后月薪过万,虽然他现在还未达到这个指标. 培训机构一般的套路是这样:先教JavaSE,什么都 ...

  2. JavaWeb——Servlet

    一.基本概念 Servlet是运行在Web服务器上的小程序,通过http协议和客户端进行交互. 这里的客户端一般为浏览器,发送http请求(request)给服务器(如Tomcat).服务器接收到请求 ...

  3. JavaWeb——Listener

    一.基本概念 JavaWeb里面的listener是通过观察者设计模式进行实现的.对于观察者模式,这里不做过多介绍,大概讲一下什么意思. 观察者模式又叫发布订阅模式或者监听器模式.在该模式中有两个角色 ...

  4. .JavaWeb文件上传和FileUpload组件使用

    .JavaWeb文件上传 1.自定义上传 文件上传时的表单设计要符合文件提交的方式: 1.提交方式:post 2.表单中有文件上传的表单项:<input type="file" ...

  5. javaWeb应用打包

    在Java中,使用"jar"命令来对将JavaWeb应用打包成一个War包,jar命令的用法如下:

  6. JavaWeb——tomcat安装及目录介绍

    一.web web可以说,就是一套 请求->处理->响应 的流程.客户端使用浏览器(IE.FireFox等),通过网络(Network)连接到服务器上,使用HTTP协议发起请求(Reque ...

  7. 做JavaWeb开发不知Java集合类不如归家种地

    Java作为面向对象语言对事物的体现都是以对象的形式,为了方便对多个对象的操作,就要对对象进行存储.但是使用数组存储对象方面具有一些弊端,而Java 集合就像一种容器,可以动态地把多个对象的引用放入容 ...

  8. JavaWeb基础学习体系与学习思路

    对于JAVAWEB的学习,首先一定要明确的是学习整体框架和思路,要有一个把控.对于WEB,很多人认为是做网页,简单的把静态网页与JAVAWEB与网页设计一概而论. 拿起一本JS就开始无脑的学习,学了一 ...

  9. Eclipse下配置javaweb项目快速部署到tomcat

    用惯了VS,再用Eclipse,完全有一种从自动挡到手动挡的感觉啊. 很多同学在Eclipse下开发web项目,每一次修改代码,看效果的时候都有右键项目->Run as -> Run on ...

  10. javaweb学习笔记之servlet01

    一.Servlet概述 A servlet is a small Java program that runs within a Web server. Servlets receive and re ...

随机推荐

  1. 发布MeteoInfo 1.2.4

    在JLaTeXMath库(http://forge.scilab.org/index.php/p/jlatexmath/)的支持下,实现了利用LaTeX语法显示特殊符号和数学公式的功能.需要在字符串首 ...

  2. swoole为什么不建议使用static和global

    $http = new swoole_http_server("0.0.0.0", 9501); $http->on("request", functio ...

  3. python的部分GUI模块简介tkinter、pyqt5（Qt Designer）

    笔者认为,这两个作为Python3较为常用且简单的GUI模块,是Python开发者所必须学习至少是了解的. 其中tkinter为Python3自带的GUI模块,而pyqt5则需要通过pip insta ...

  4. linux 环境搭建Jenkins

    这里提供一个本地搭建Jenkins的方法,基于wins 的 https://blog.csdn.net/u011541946/article/month/2017/09/2   下面讲的是在服务器上操 ...

  5. poj2187 Beauty Contest （凸包 + 旋转卡壳）

    Beauty Contest Time Limit: 3000MS   Memory Limit: 65536K Total Submissions: 38349   Accepted: 11851 ...

  6. ZooKeeper的数据模型

    ZooKeeper的数据模型 ZooKeeper提供的命名空间与标准的文件系统的命名空间非常类似:名称是由斜杠(/)分隔的一系列路径元素:ZooKeeper命名空间中的每个节点都由路径标识,如下图: ...

  7. JavaWeb中的域对象

    域对象:可以在不同Servlet之间传递数据的对象,就是域对象,它们内置了map集合,都有setAttribute和getAttribute方法: Java Web有ServletContext.Se ...

  8. redis过期事件，swoole监听

    $serv = new Swoole\Server('0.0.0.0', 9501, SWOOLE_BASE, SWOOLE_SOCK_TCP); $serv->set(array( 'work ...

  9. JVM内存管理和垃圾回收

    无论对于Java程序员还是大数据研发人员,JVM是必须掌握的技能之一.既是面试中经常问的问题,也是在实际业务中对程序进行调优.排查类似于内存溢出.栈溢出.内存泄漏等问题的关键.笔者将按下图分多篇文章详 ...

  10. Python使用psycopg2模块操作PostgreSQL

    https://blog.csdn.net/pcent/article/details/78643611