网页入门

最新推荐文章于 2024-08-06 09:48:00 发布

小粉、

最新推荐文章于 2024-08-06 09:48:00 发布

阅读量207

点赞数

文章标签： html

本文链接：https://blog.csdn.net/qq_55415442/article/details/115933449

版权

HTML##第一篇入门

HTML超文本标记语言，它是用来描述网页的一种语言

HTML不是一种，编程语言，而是一种标记语言

HTML是基本结构

基本结构#

网页

<html>
    <head>
        <title>我的第一个网页</title>
    </head>
    <body>我的第一个网页<br/>
    </body>
</html>

TAB +标签字母秒变标签

br+bat=

网络的基本标签

标题标签

标题标签h中，等级越高字体越小加粗不变

标题标签都要在body标签；i


<html>
    <head>
        <title>我的第一个网页</title>
    </head>
    <body>我的第一个网页<br/>
   <h1>
   。。。。
</h1>
    </body>
</html>

换行标签

<br/

段落标签

...

<html>
    <head>
        <title>我的第一个网页</title>
    </head>
    <body>我的第一个网页<br/>
        <P>
    我是大手笔
</P>
    </body>
</html>

元素

块元素

无论内容多少，该元素独占一行（lip，h1-h6……）

行内元素

内容撑开宽度，左右都是行内元素的可以排在一行（a，strong，em……）

水平线标签

默认整个网页

字体样式标签

……

斜体 …… 或者……

特殊符号

特殊符号		举例
空格	&nbsp；	<a hrer="#”>百度&nbsp；\|&nbsp；

		<a hrer="#”>新浪
大于号	&gt；	如果时间&gt；晚上6点，就坐车回家
小于号	&lt；	如果时间&lt；早上6点，就飞着上学
引号	&quot；	W3C规范中，HTML的属性值必须用成对的&quot；引起来
版权符号@	&copy；	&quot； 2003–2013 大傻逼学校

插入图片标签

<img 最重要src="图像地址"width="30PX"高单位px   宽height="50px"alt="图片加载不出来出现的文字"title="鼠标悬停提示文字"/>

链接标签

<a href="链接路径" target="_self或者_blank 判断新链接是否覆盖之前的窗口 "链接文本></a>

图片超链接

<a href="链接路径" target="_self覆盖或者_blank 判断新链接是否覆盖之前的窗口 "<img 最重要src="图像地址/"></a>

iframe网页嵌套网页

在一个网页嵌套一个网页

<iframe src="2.html"width="" height=""

列表分类

无序列表（重点）

声明无序列表<ui><li>文字</li>声明列表项
    <li>文字</li>
    <li>文字</li>
    <li>文字</li>包含嵌套关系
</ui>

没有顺序没一个li标签都独占一行

有序列表

<ol>
    <li>文字</li>
</ol>

定义列表的特性：

没有顺序，每个

标签、

标签独占一行(块元素)

默认没有标记

一般用于一个标题下有一个或多个列表项的情况

有顺序i标签都独占一行应用与试卷排名

无序和有序标签下面只能包含li标签

常用的超链接

锚链接

从A页面的甲位置转达本文的乙位置

创建跳转链接甲位置

创建跳转标签

乙位置

表格的基本语法

<table border="1" align="center"
    cellpading="20" cellspacing="2"
    width="500" height="500">
    <tr>
        <td></td>
        <td></td>
    </tr>
</table>

border(显示表格) center中央 cellpadding 改变表格内间距

tr行标签 td列标签 colspan 标签里面的属性在表格内是加粗

学生信息

colspan跨列

rowspan跨行

视频音频

<video src="视频路径" controls></video>

autoplay 马上播放视频/音频

controls 人工操作播放

height 播放器高度

loop 循环播放

preload 点击才播放

width 播放器的宽度s

muted 静音

元素名	描述
header	标题头部区域的内容（用于页面或者页面中的区域）
footer	标记脚步区域的内容（用于整个页面或者页面中的区域）
section	Wed页面中的独立区域
article	独立文章内容
aside	相关内容或应用（常用于侧边栏）
nav	导航类辅助内容

表单

```html

 <p><form action="01.html"method="get"></form></p>
<<input type="text" name="us"></p>
<p><input type="password" name="aw"></p>
<p><input type="submit"></p>
<p><input type="reset"></p>

action 表单提交位置可以是网站或者是一个请求处理地址

method get post 提交方式

属性	说明
type	指定元素的类型。text文本框、password密码框、checkbox、radio、submit、reset、file、hidden、image和 button，默认为text
name	指定表单元素的名称
value	元素的初始值。type为radio时必须指定一个值
size	指定表单元素的初始宽度。当type为text 或password时，表单元素的大小以字符为单位。对于其他类型，宽度以像素为单位
maxlength	type为text或password时，输入的最大字符数
checked	type为radio或checkbox时，指定按钮是否是被选中

多行文本域

<textarea name="showText" cols="x" rows="y"> 文本内容</textarea>

一个中文字符等于两个英文字符

<textare name="showText" cols="x" rows="y"> 文本内容</texttarea>

<input name="gen" type="radio" valiue="男" checked />男

<input name="gen" type="radio" value="女" />

<input type="checkbox" name="interest" value="sports"/>运动

<input type="checkbox" name="interest" value="talk" checked/>聊天
<input type="checkbox" name="interest" value="play"/>玩游戏

<select name="列表名称" size="行数">
<option value="选项的值" selected="selected">...</option>
<option value="选项的值">...</option>
</select>

<inout type="reset" name="butReset" value="rese按钮"/>(重置按钮)
<inout type="sumit" name="butSubmit" value="subimit"/>(提交按钮)
<form action="#"method="post">
    <p>
        请输入网址:<input type="url" name="userUrl"/></p>
    <input type="submit"/>
    </p>
</form>
数字滚动<input type="number" name="num" min="0"max="数值" step="间隔数值"/>
<input type="submit"/>

小粉、

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
打赏
0
评论
网页入门

HTML##第一篇入门HTML超文本标记语言，它是用来描述网页的一种语言HTML不是一种，编程语言，而是一种标记语言HTML是基本结构基本结构#网页<html> <head> <title>我的第一个网页</title> </head> <body>我的第一个网页<br/> </body></html>TAB +标签字母秒变标签b
复制链接

扫一扫