HTML基础

最新推荐文章于 2023-03-06 17:15:50 发布

JDBC咯

最新推荐文章于 2023-03-06 17:15:50 发布

阅读量54

点赞数

分类专栏：前端文章标签： html 前端 css js java-ee

本文链接：https://blog.csdn.net/qq_46015410/article/details/123164759

版权

前端专栏收录该内容

3 篇文章 0 订阅

订阅专栏

html概述

超文本标记语言(HyperText Markup Language)

超文本：文字网页中显示的超链接图片视频

标记：标签记号用来描述网页内容浏览器根据标签内容进行解释执行

买东西 —>标签(价格型号材质…)

<b>hello world !</b>

学习html 本质就是学习各种各样的标签

浏览器解析执行网页

html开发网页

网页开发工具：HBuilderX

基本语法

html声明 html版本为html5 告诉浏览器如何解释网页
<!DOCTYPE html>
html称为根标签  网页中的所有内容都写在根标签中. 
<html> 
    头部
	<head>
        设置网页信息  编码设置
		<meta charset="utf-8" />
        搜索引擎搜索使用的关键字
        <meta name="keywords"  content="手机,家电">
		<title>网页标题</title>
        <link href="img/baidu.ico" rel="icon"/>
	</head>
    身体
	<body>
		<b>网页中的内容都写body标签中</b>
	</body>
</html>

注释 ctrl+/

标签分类

闭合标签 <标签类型>内容</标签类型>
自闭合标签 <标签类型内容/>

标签属性对标签内容进行修饰，写在开始标签中属性名=“值” 可以有多组

常用基本标签

段落标签：

align 设置对齐方式

标题标签：

h1~h6

换行标签:

注意：颜色设置在style里面

列表标签：type 设置序号样式

无序列表：
有序列表：

标尺线：

可设置颜色color、宽度width、加粗size、

超链接：

href=“URL”

href (Hypertext Reference超文本引用) 规定链接指向的页面的URL(页面地址)

URL(Uniform Resource Locator)统一资源定位符
target=“_self/_blank”

_self:默认在当前窗口打开

_blank:在新窗口打开

图片：

src=“图片地址”(width height border)
alt=“图片不能正常显示时的提示信息”
title=“图片移入时的提示信息”

注意：

有些标签占一行：h hr p (有align)
有些标签占本身内容大小 a i b
标签要正确嵌套

定义锚点

特殊符号转译

空格：&nbsp;
小于号：&lt;
大于号：&gt;
商标：&trade;
注册商标：&reg;
版权：&copy;

表格基本定义设置

表格：

有行有列；里面可以存放数据；还可以用来网页布局；

table 表格；tr 行；th表头单元格；td单元格；

<table>
    <tr>
        <th>
        </th>
    </tr>
    <tr>
        <td>
        </td>
    </tr>
</table>

边框：border;

宽度：width;

高度：heigth;

背景颜色：bgcolor;

背景图片(优先于背景颜色)：background;

内容到边框的距离：cellpadding

单元格与单元格之间的距离：cellspacing

注意：表格内容只能放单元格当中（否则默认在表外）;

表格对齐——合并

table>tr*4>td*5
按tab，生成4行五列的单元格

对齐

align:水平位置(left center right)

vlign:垂直位置(top middle bottom)

合并

跨列合并：colspan=“合并的单元格数量”
跨行合并：rowspan=“合并的单元格数量”

表单

有许多可以输入或选择的组件，用户可以在表单中输入信息，最终将表单信息提交到服务器，为后端程序收集数据

form 表单，有以下属性：

action=“服务器的地址”
method=“htttp请求提交数据的方式” get post delete put

input:输入框，有以下属性：

type="";name=“向服务器端提交数据的键”;value=“值”;placeholder=“提示信息，不是组件的值”
1. 单行文本框：type=“text”;
2. 密码框：type=“password”;
3. 单选框：type=“radio”; name属性值相同为一组： name="";value为提交的内容；默认选择checked =“checked”;
4. 复选框：type=“checkbox”
5. 文件选择框: type=“file” ;筛选文件：accept=".jpg,.png"
size=“尺寸”
readonly="readonly"只读
disabled="disabled"禁用(不向服务器提供数据)

select:下拉选择框，option：选项，selected="selected"默认选择框

textarea:多行文本输入域，cols="“column列,rows=”"行

按钮：

提交按钮：type=“submit”（可以触发表单提交）
重置表单：type=“reset”（使表单还原至默认形态）
普通按钮：type=“button”（触发事件）onclick

<form>
		    账号<input type="text"name="account"value="" placeholder="请输入账号"/><br/>
		    密码<input type="password"/><br/>
		    性别<input type="radio"name="gender"value="男"checked="checked"/>男
		    <input type="radio"name="gender"value="女"/><br/>
		    爱好<input type="checkbox"name="hobby"value="唱歌"/>唱歌
		    <input type="checkbox"name="hobby"value="说唱"/>说唱<br/>
		    省份<select name="pro">
		    <option value="101">北京</option>
		    <option value="102">上海</option>
		    <opttion value="103">天津</opttion>
		    </select>
		    照片<input type="file"/><br/>
		    备注<textarea cols="30"rows="5"name="mark">www</textarea><br/>
		    <input type="submit"value="登录"/>
		    <input type="reset"/>
		    <ipput="button"value="按钮"οnclick="alert('ssss')"/>
		</form>

内联框架

在一个窗口内嵌入一个子窗口，在子窗口内嵌入一个网页

<a href="http://www.qq.com" target="qq">腾讯</a>
<iframe src="index.html" name="qq"></iframe>

target=“指定窗口的名称”

_parent 在父级（上一级）打开链接

_top 在顶级打开链接

JDBC咯

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
HTML基础

html概述超文本标记语言(HyperText Markup Language)超文本：文字网页中显示的超链接图片视频标记：标签记号用来描述网页内容浏览器根据标签内容进行解释执行买东西 —>标签(价格型号材质…)<b>hello world !</b>学习html 本质就是学习各种各样的标签浏览器解析执行网页html开发网页网页开发工具：HBuilderX基本语法html声明 html版本为html5 告诉浏览器如何解释网页<!DO
复制链接

扫一扫