欢迎光临散文网 会员登陆 & 注册

HTML笔记:基本框架,超链接,列表,表等,分割线,行级元素,块级元素,锚点,按钮

2020-04-22 20:28 作者:诗书画唱  | 我要投稿

HTML是一个超文本标记语言。

HTML最基本的框架

<html>

<

head>

<title>头部标题</title>

</head>


<body>

主体内容 </body></html>

改变网页背景颜色:bgcolor="颜色"

改变网页的背景图片:background="img/sslogo.png"

标题:<h1>---<h6>作用:再别人搜索的时候可以当做关键字

更容易被别人搜索到(主要作用不是改变字体大小的)

改变字体大小和颜色:<font color=“颜色” size="1-7(数字越大字体越大)">内容</font>

段落标签:<p align="位置(left左center中间right右)">中间跟段落的内容</p>

&nbsp;空格  再网页中你不管空多少次它都以为只有1个空格,所以使用&nbsp;代表空格可以空更多个



常用的图片格式:jpg,png,gif

区别:

jpg:占用大小最小,在使用的时候背景如果为空,使用位白色

png:大小比jpg更大,支持透明背景

gif:动画图片,多张图片拼接成一个动态图

插入图片:<img  src="路径" alt="提示信息" align="对齐方式" border="边框大小" 

width="宽度" height="高度"/> 

相对路径:相对于项目中的位置

绝对路径:相对于计算机中的位置

走马灯:<marquee direction="方向(top,down,left,right)" scrolldelay="默认为90(滚动完一次后多少时间滚动第二次)"

loop="次数  -1(无限循环)   数字是几滚动几次"  scrollamount="数字越大滚动越快">

超链接:<a href="目标网页的路径" target="_self(在自身选项卡中打开网页)    _blank(新建选项卡打开网页)"></a>


(href="#":代表这个是课空连接,将自身刷新)



锚点链接:<a href="#目标的位置">点击此处跳到目标的内容</a>    <a name="目标位置">目标的内容</a>

<hr>分割线

行级元素:在一行中可以显示多个的标签

块级元素:一行只能有一个

无序列表:

<ul type="square">

<li>具体内容</li>

<li>具体内容</li>

</ul>

有序列表

<ol type="a,A,I"  start="数字">

<li>具体内容</li>

<li>具体内容</li>

</ol>

自定义列表

<dl>

<dt>标题内容</dt>

<dd>内容的介绍</dd>

<dd>内容的介绍</dd>

</dl>

表格

<table border="1px" >

<tr>

<th>代表标题一般在第一行</th>

<td>具体的内容</td>

</tr>

</table>

width:设置表格宽度,给table设置整个表格的宽度该表,给td设置的时候是整列单元格的宽度会改变

height:设置表格高度,给table设置整个表格的高度该表,给tr设置的时候是整行的高度会改变

border:设置表格边框

align:设置表格的对齐方式,给table设置整个表格居中,给tr设置这行内容文字居中,给td设置这个单元格内容居中

cellspacing:设置单元格与单元格之间的距离

cellspadding:表格文字距离边框的距离

colspan:合并列,将两列的内容合并为1列

rowspan:合并行,将两行的内容合并为1行

不管合并行和合并列合并后,多余的单元格需要删除掉

一整个叫做表单(form)里面的控件叫做表单元素(form 元素)


form作用是包括住所有的form元素,将form中的内容进行传递的一个载体

form:一个用来传递内容的容器

action:将内容传递到的具体位置

method:传递的方式(get【会将传递的内容在地址栏中显示】,post【隐藏传递的内容】)

<input name="起名字" type="设置元素的类型" value="具体的值"

size="长度" Maxlength="最大输入的字符长度"  checked="是否选中">

readonly:设置文本框内容是否可以更改

文本框:text

密码框:password

单选按钮:radio(单选按钮必须分组,使用name赋值)

复选按钮:checkbox(可以选中一个或多个,或一个都不选中)

提交文件:file

下拉框:

<select>

<option>北京</option>

<option selected="selected">上海</option>

<option>广州</option>

</select>

文本域:

<textarea cols="15" rows="5" placeholder="请输入个人介绍"></textarea>

submit:提交按钮,将form元素的数据进行提交

reset:重置form表单元素

button:普通按钮,现在没有作用,学js用来写事件

<input type="date" />:日期元素

<input type="email" />:必须写@,邮箱

<input type="week">XX年XX周

<input type="time">小时:分钟

<input type="url">必须写网址

<input type="month">XX年XX月

<input type="image" src="img/sslogo.png" />:和submit一样,但是可以使用图片当按钮


HTML笔记:基本框架,超链接,列表,表等,分割线,行级元素,块级元素,锚点,按钮的评论 (共 条)

分享到微博请遵守国家法律