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. C++ concurrent_queue

    ConcurrentQueue 用C++11提供的多线程类实现一个线程安全的队列: #include <queue> #include <mutex> #include < ...

  2. selenium基础 --获取内容

    from time import sleep from selenium import webdriver browser = webdriver.Chrome() url = "http: ...

  3. tomcat 启动失败

    1.tomcat单独通过脚本可以启动,但是http://localhost:8080加载页面失败 tomcat 启动失败: a.检查JAVA_HOME和CATALINA_HOME是否配置正确:或者直接 ...

  4. java基础第一章

    有一定的基础,但是还是要重新开始,2020.10.6 1.手写Hello World public class HelloWorld{ public static void main(String[] ...

  5. 如何发布代码到maven中心仓库

    deploy to sonatype 参考文章 https://blog.csdn.net/xuefu_78/article/details/52494698 https://blog.csdn.ne ...

  6. Paraview教程

    快速入门 https://www.youtube.com/watch?time_continue=1017&v=Y1RATo2swM8 Cyprien Rusu系列 Paraview Vide ...

  7. Python作业1

    name = " aleX" # 1 移除 name 变量对应的值两边的空格,并输出处理结果 print(name.strip()) # 2 判断 name 变量对应的值是否以 & ...

  8. oracle数据库表空间扩展

    //查看表空间情况 SELECT Upper(F.TABLESPACE_NAME) "表空间名",D.TOT_GROOTTE_MB "表空间大小(M)",D.T ...

  9. Win32编程之控制线程

    0x01. 如何让线程停下来 让自己停下来: Sleep() 函数 当程序执行到某段代码的时候可以使用sleep() 函数进行暂停 使用sleep()函数挂起的时候会自动恢复过来的 让别人停下来: S ...

  10. Jenkins自动化构建PHP实列教程

    安装Jenkins 请参考群主的安装教程 进入jenkins,添加SSH server,并且安装gitlab,Generic Webhook Trigger Plugin,GitHub plugin, ...