目录
标记语言
常用的标记语言有XML（可扩展标记语言）和HTML（超文本标记语言）
XML一般用于软件系统的配置文件，例如Maven的配置文件settings.xml文件,项目中安装依赖的pom.xml文件。
HTML被广泛的用于网页的结构设计
XML文件的后缀名就是 xml
HTML文件的后缀名可以是 htm或html
标记语言编写的文件结构是树形结构，因此HTML网页也称为HTML文档树
1.只有一个根节点（只可以嵌套，不可以并列，根节点没有兄弟节点，没有父节点，只有子节点）
2.节点可以并列，也可以嵌套，并列节点之间是兄弟关系（拥有同一个父节点），嵌套节点之间是父子关系
3.一个父节点可以嵌套多个子节点一个节点可能存在多个兄弟节点
4.一个节点只有一个直接父节点，但可以存在多层的父节点
5.节点（node）也称为标签（tag）或者元素（element），是标记语言的最小组成单位，每一个节点用于标记网页中的一个信息
6.标签的语法
单标签： <标签名 内容 />
双标签： <标签名> </标签名>
标签中的 "/" 代表节点的闭合,表示这个节点到此结束
双标签有开始标签和结束标签，在结束标签中用 “/” 闭合，可以嵌套子标签
单标签不可以嵌套子标签，自闭合
常用标签
建立一个HTML
1.hello world
2.表格标签的使用
3.表格的跨行与跨列
跨行
跨列
4.图片标签的使用
5.超链接标签的使用
6.锚链接的使用
1.定义锚点
2.定义超链接
7.表单标签的使用
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>07表单标签的使用</title>
</head>
<body>
<!-- 表格（table）:用于展示数据
表单（form）:用于输入数据
-->
<!-- action="表单提交地址",method="用于指定提交方式"-->
<!--1. input标签
type属性用于指定input标签的类型
text普通文本输入框
password密码输入框
hidden隐藏域（用于在表单中携带数据传输给服务器,且不需要用户看见这个元素）
radio
placeholder输入提示信息
-->
<form action="" method="">
<!-- disabled设为禁用-->
<input type="text" placeholder="请输入账户名" disabled/>
<br/>
<input type="password" placeholder="请输入账户密码" disabled/>
<br/>
<!-- 隐藏域 不会显示出来给用户看 提交给后端的-->
<input type="hidden" value="1954"/>
<!-- 通过name属性实现单选互斥,name一样判定为一组-->
<!-- 通过checked="checked"属性实现单选，默认选中-->
<!-- 浏览器规定,属性名与取值一样的时候可以只写属性名-->
<!-- 取id标记一下 for id 用文本关联按钮-->
<input type="radio" id="M" name="sex"/>
<label for="M">男</label>
<input type="radio" id="W" name="sex" checked/>
<label for="W">女</label>
<br/>
<input type="checkbox" id="Java" name="job"/>
<label for="Java">Java工程师</label>
<br/>
<input type="checkbox" id="Web" name="job"/>
<label for="Web">Web工程师</label>
<br/>
<input type="checkbox" id="Linux" name="job"/>
<label for="Linux">Linux工程师</label>
<br/>
<!-- 2.select标签 下拉选-->
<lable for="province">请选择省份</lable>
<select name="" id="province">
<option value="" disabled>江苏省</option>
<!-- selected 默认选择-->
<option value="" selected>浙江省</option>
<option value="">安徽省</option>
<option value="">四川省</option>
</select>
<br/>
<!-- 文本域标签textarea,用于长文本的输入-->
<textarea name="" id="" cols="30" rows="10" placeholder="请输入你的自我介绍"></textarea>
<br/>
<!-- 按钮两种写法-->
<input type="button" value="普通按钮">
<input type="reset" value="重置按钮">
<input type="submit" value="提交按钮">
<br/>
<button type="button">普通按钮</button>
<button type="reset">重置按钮</button>
<button type="submit">提交按钮</button>
<br/>
</form>
</body>
</html>
CSS
CSS基础选择器
行内T0优先级
外部样式和内部样式
先建一个css文件
内部样式:CSS写在HTML文件中的<style>标签中 只能被当前网页使用
外部样式:CSS代码单独写在CSS文件中,在html文件中使用link标签进行链接
有缺点
高级css选择器
后代选择器 .box div
父子选择器 .box>div
兄弟选择器 .box3+div .box3~div
并集选择器
伪类选择器
扫一扫
736
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
