欢迎到我的简书查看我的文集

前言:

HTML 英文: HyperText Markup Language内容

html是超文本标记语言,是网页语言的基础知识,html是通过标签来定义的语言,所有代码都是由标签所组成的,在html代码中不用区分大小写.

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">

<title>Examples</title>

<meta name="description" content="">

<meta name="keywords" content="">

<link href="" rel="stylesheet">

</head>

<body>

</body>

</html>

html代码是由<html>开始的,并且由</html>结束的,包含头部分<head></head>和体部分<body></body>两部分组成.

头部分是用来给html页面添加属性信息的,头部分是最先加载的内容,而体部分是页面数据存储的地方.

在html代码中,多数标签都是有开始标签和结束标签的，其中有个别标签因为只有单一功能,所以没有开始标签和结束标签这样.

这种个别标签: <br />, 要建议使用 "/", 这是规范要求.

html为超文本标记语言,标记语言,要对标签进行修饰,添加丰富的内容操作,可以对属性值进行改变,增强效果,也可以增强用户体验感.

属性与属性值之间用“=”连接.

文本尾部 ".txt" 改扩展名 为 ".html".

打开时默认关联打开浏览器.

格式：

// 超文本标记

<标签名 属性名='属性值' />

<标签名 属性名='属性值'> 数据内容 </标签名>

在html中,代码都是由标签所组成的,代码逻辑相当低.

// 头和体

<html>

 <head>

  <title></title>

 </head> // 网页的属性信息

 <body>

 </body> // 网页的数据内容

</html>

html是网页的最基本语言,为了操作数据,需要对数据进行不同标签的封装并通过标签中的属性可以对封装的数据进行操作.

字体标签

字体标签为: <font>

例如: <font size="10px" color="red">达叔小生</font>

复杂颜色用16进制表示，表现形式#FF0000两个数为一组，按红，绿，蓝排列，如：#00FF00表示绿色.

标题标签: <h1><h2>...<h6>

数字越大越小来着.

列表标签

<dt>为上层项目

<dd>为下层项目

实例:

<dl>

	<dt>名称</dt>

		<dd>达叔小生</dd>

		<dd>dashucoding</dd>

	<dt>部门名称</dt>

		<dd>技术部</dd>

		<dd>研究部</dd>

</dl>


<ol>为数字标签,<ul>为符号标签,<li>为具体项目内容标签

图像标签

<img>

// 实例

<img src=”1.jpg” align=”middle” border=”3” alt=”图片说明文字”/>

// align时属性定义图片的排列方式

// border是用来设置图像的边框

地图 <map>

<img src="dashucoding.jpg" alt="图片说明文字" usemap="#Map" />

  <map >

    <area shape="rect" coords="40,50,100,104" href="1.html" />

    <area shape="circle" coords="118,203,40" href="2.html" />

  </map>

表格标签

<table>

标题标签为<caption>,是表格的标题

表头标签:<th>

行标签:<tr>

单元格标签:<td>

实例:

// width值为百分比,让表格的宽度随浏览器窗口的大小变化

<table border="1" width=”40%”>

	<caption>表格标题</caption>

	<tr>

		<th>姓名</th>

		<th>年龄</th>

	</tr>

	<tr algin=”center”>

		<td>达叔小生</td>

		<td>dashucoding</td>

	</tr>

</table>

实例2:

// 表头标签:<th>

// colspan：th标签占两列

<table border="1" width="40%">

<tr>

	<tr>

	<th colspan="2">

	个人信息

	</th>

	</tr>

	<tr align="center">

		<td>达叔小生</td>

		<td>dashucoding</td>

	</tr>

</tr>

</table>


<tbody></tbody>表格体

超链接 <a>标签

1. 超链接<a href=””>

<a href=”http://www...cn” target=”_blank”>达叔</a>

2. 定位标记<a name=””>

<a name=”标记”>标记位置</a>

<a href=”#标记”>返回标记位置</a>

框架

<frameset rows="20%,*>

// 上部分

 <frameset cols="28%,*>

 </frameset>

</frameset>


// <frameset>

框架标签会到<head>和<body>之间

例子:

<frameset>

</frameset>

画中画标签：<iframe>

<iframe src=”1.html” >

</iframe>

表单

表单标签：<form>

输入标签 input

文本框 text

密码框 password

单选框 radio

复选框 checkbox

隐藏字段 hidden

提交按钮 submit

重置按钮 reset

按钮 button

按钮 button

图像 image

选择标签 <select>

子项标签 <option>

多行文本框 <textarea>

表单提交：明确提交方式,指定method属性值,默认为get,form表单中的action属性值,是指定表单数据提交的目的地.

get和post

get提交的数据会显示在地址栏中,而post不会,使用get会对敏感信息不安全.

get的提交数据体积有限,而post可以提交大体积的数据.

get将提交数据封装到了http消息头的第一行,而post将提交的数据封装到消息头后

提交表单建议使用post

头标签

头标签放在<head></head>头部分之间

<title>用于显示浏览器的标题栏内容

<base> href 属性和 target 属性

<meta>用于网页的描述信息,是搜索引擎的关键字进行搜索

<link>

rel (目标文档与当前文档的关系)属性

type (文档类型)属性

media (在哪种设备上起作用)属性

XHTML(可扩展的超文本标记语言)

Extensible HyperText Markup Language

XML(可扩展标记语言) -> 对数据信息的描述

Extensible Markup Language

HTML -> 数据显示的描述

public class Server{

 public static void main(String[] args) throws Exception {

  ServerSocket ss = new ServerSocket(90);

  Socket s = ss.accept();

  System.out.println(s.getInetAddress().getHostAddress());

  InputStream in = s.getInputStream();

  byte[] buf=new byte[1024];

  int len = in.read(buf);

  String text = new String(buf,0,len);

  System.out.println(text);

  PrintWriter out = new PrintWriter(s.getOutputStream(),true);

  out.println();

 }

}

meta标签

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8">

<!--  meta http-equiv="refresh" content="3;url=http://www.sina.com.cn" /-->

<title>Insert title here</title>

</head>

<body>

你好

</body>

</html>


<i>一下</i>

<u>其他</u>

<strong>标签</strong>

X<sub>2</sub>  X<sup>2</sup>

<pre>代码格式</pre>

Java中css的学习

css是用来实现网页的页面效果,层叠样式表(Cascading Style Sheets),css将页面的内容和显示样式进行了分离,提高了显示功能.

四种方式:

  1. style属性方式
<p style="";></p>
  1. style内嵌方式
<style type=”text/css”>

</style>
  1. 导入方式
@import url(css_1.css);
  1. 链接方式
<link rel="stylesheet" type="text/css" href="css_1.css" media="screen" />

样式优先级是由上到下，由外到内

css选择器共有三种：

  1. html标签名选择器
  2. class选择器 -> 标签名.class值
  3. id选择器 -> #id值

i. 关联选择器

p b { color:#fff;}

ii. 组合选择器

p,div { color:#fff;}

iii. 伪元素选择器

a:link  超链接未点击状态。

a:visited 被访问后的状态。

a:hover 光标移到超链接上的状态（未点击）。

a:active 点击超链接时的状态。

@import

达叔小生：往后余生，唯独有你

You and me, we are family !

90后帅气小伙，良好的开发习惯；独立思考的能力；主动并且善于沟通

简书博客： 达叔小生

https://www.jianshu.com/u/c785ece603d1

结语

  • 下面我将继续对 其他知识 深入讲解 ，有兴趣可以继续关注
  • 小礼物走一走 or 点赞

第59节:Java中的html和css语言的更多相关文章

  1. 第83节:Java中的学生管理系统分页功能

    第83节:Java中的学生管理系统分页功能 分页功能一般可以做成两种,一种是物理分页,另一种是逻辑分页.这两种功能是有各自的特点的,物理分页是查询的时候,对数据库进行访问,只是查一页数据就进行返回,其 ...

  2. 第82节:Java中的学生管理系统

    第82节:Java中的学生管理系统 学生管理系统的删除功能 删除,点击超链接,点击弹出对话框式是否进行删除,如果确定,就删除,超链接执行的是js方法,在js里访问,跳转servlet,,servlet ...

  3. 第80节:Java中的MVC设计模式

    第80节:Java中的MVC设计模式 前言 了解java中的mvc模式.复习以及回顾! 事务,设置自动连接提交关闭. setAutoCommit(false); conn.commit(); conn ...

  4. 第79节:Java中一些要点

    第79节:Java中一些要点 前言 一些知识点忘了没,可以通过一个点引出什么内容呢?做出自己的思维导图,看看自己到了哪一步了呢 内容 如果有人问jre,jdk,jvm是什么,你怎么回答呢? jre的英 ...

  5. 第78节:Java中的网络编程(上)

    第78节:Java中的网络编程(上) 前言 网络编程涉及ip,端口,协议,tcp和udp的了解,和对socket通信的网络细节. 网络编程 OSI开放系统互连 网络编程指IO加网络 TCP/IP模型: ...

  6. 第77节:Java中的事务和数据库连接池和DBUtiles

    第77节:Java中的事务和数据库连接池和DBUtiles 前言 看哭你,字数:8803,承蒙关照,谢谢朋友点赞! 事务 Transaction事务,什么是事务,事务是包含一组操作,这组操作里面包含许 ...

  7. 第76节:Java中的基础知识

    第76节:Java中的基础知识 设置环境,安装操作系统,安装备份,就是镜像,jdk配置环境,eclipse下载解压即可使用,下载tomcat 折佣动态代理解决网站的字符集编码问题 使用request. ...

  8. 第71节:Java中HTTP和Servlet

    第71节:Java中HTTP和Servlet 前言 哭着也要看完!!!字数: 学习xml和TomCat 会写xml,看懂xml 解析对象 SAXReader reader = new SAXReade ...

  9. 第70节:Java中xml和tomcat

    第70节:Java中xml和tomcat 前言: 哭着也要看完,字数: jdbc crud - statement dao java.sql.Driver The interface that eve ...

随机推荐

  1. Visual Studio连接Oracle数据库

    一.安装Oracle Developer Tools for Visual Studio 2015 其他的什么client一概不要装,装了的直接卸载. 下载时需要登录,如果之前已经注册账号,提醒一下密 ...

  2. centos 添加右键在终端打开

    yum -y install nautilus-open-terminal

  3. FPGA學習筆記（貳）--- 流水燈

    平臺:FPGA黑金开发板 AX301 開發環境:Quartus Prime Version 17.0.0 Build 595 04/25/2017 Standard Edition 引脚配置:鼠標托拉 ...

  4. mercury水星路由wifi连接不上的坑

    如题,房东发给我的水星路由,是有些bug的,比方说我的手机会偶尔某天连上了没有网络,但是其他wifi设备和有线就没问题. 这种wifi网络很差甚至没有网络的问题会随机在你的wifi设备上发生,你甚至连 ...

  5. OO第5-7次作业总结

    前三次作业可以说是入门编程,随着课程的深入,这三次多线程作业使我们开始慢慢接触工程性的编程任务. 对比起1-3次作业,5-7次作业明显没有那么顺利了,之前在互测环节每次最多就一个BUG或者没有BUG, ...

  6. 得到一个文件夹中所有文件的名称的几个方法（命令指示符, C++, python）

    因为最近一直需要获得一个文件下的所有图片的名称,自己又总是跨平台使用,所以把自己在不同环境之下使用的方法总结如下 1.cmd 模式下 优点:简单 例如,我想将一个文件夹下的所有".jpg&q ...

  7. asp:DropDownList 使用

    <asp:DropDownList ID="DropDownList1" runat="server" onchange="return My_ ...

  8. javabean转换为map对象

    在调用第三方接口发现对方使用map进行接收(不包括秘钥等),将bean类属性转换为map,直接贴代码: /** * JavaBean对象转化成Map对象 * * @param javaBean */p ...

  9. 理解特性attribute 和 属性property的区别 及相关DOM操作总结

    查一下英语单词解释,两个都可以表示属性.但attribute倾向于解释为特质,而property倾向于解释私有的.这个property的私有解释可以更方便我们下面的理解. 第一部分:区别点 第一点:  ...

  10. bzoj3110(整体二分)

    #include<iostream> #include<cstdio> #include<cmath> #include<cstring> #inclu ...