Java初学者笔记21—HTML

HTML:布置页面最基本的网页开发语言,给网页添加内容。

HTML 是一种超文本的标记语言

      超文本:就是用超链接,把不同地方的文字和信息,拼凑到同一个地方的文本。

      标记语言:<标记名称>例如html,xml,是一种由标签构成的语言。标记语言不是编程语言,没有逻辑,写上了,就会被解析,之后就会被执行。

 

HTML中的标签:

      1. 围堵标签:有开始标签和结束标签。如 <html>  </html>

2 自闭和标签:开始标签和结束标签在一起。如 <br/>

3标签是可以嵌套的,但是你中有我,我中有你,例:<a><b></a></b>

4开始标签之中,可以定义属性<xxx 属性名=”值”>。

5结束标签</xxx>,要加一个斜杠。

6 Html语法不严谨,但是也不要写错。

 

标签学习:

1. 文件标签:构成html最基本的标签

html:html文档的根标签

    head:头标签。用于指定html文档的一些属性。引入外部的资源

    title:标题标签。

body:体标签

<!DOCTYPE html>:html5中定义该文档是html文档

 2. 文本标签:和文本有关的标签

注释:<!-- 注释内容 -->

<h1> to <h6>:标题标签, h1~h6:字体大小逐渐递减

<p>:段落标签

<br>:换行标签

<hr>:展示一条水平线  属性  color:颜色

                    width:宽度

                    size:高度

                    align:对其方式

                center:居中

                left:左对齐

                right:右对齐

<b>:字体加粗

<i>:字体斜体

<font>:字体标签           color:颜色

                 size:大小

                 face:字体

<center>:文本居中

   属性定义:

Color:值的范围:00~FF之间。如: #FF00FF,在调色板中找

width:

1. 数值:width='20' ,数值的单位,默认是 px(像素)

2. 数值%:占比相对于父元素的比例

3 图片标签: img:展示图片

    属性:

 src:指定图片的位置,直接使用相对路径。

”./”可以不写默认的,当要展示的图片是当前目录下的,可以用这个。

“../”代表上一级目录。

4. 列表标签:

 有序列表:

ol:

 li:

 无序列表:

 ul:

 li:

5 . 链接标签:<a>

 href:指定访问资源,可以是一个网址,也可以是自己定义的html

 target:指定打开资源的方式

 _self:默认值,在当前页面打开

 _blank:在空白页面打开  

      6  div和span:

 div:每一个div占满一整行。块级标签

          span:文本信息在一行展示,行内标签 内联标签

      7 语义化标签:为了提高可读性的标签

 <header>:页眉

     <footer>:页脚

 

  8. 表格标签:

 table:定义表格

 width:宽度

 border:边框

 cellpadding:定义内容和单元格的距离

 cellspacing:定义单元格之间的距离。如果指定为0,则单元格的线会合为一条

 bgcolor:背景色

 align:对齐方式

 tr:定义行

 bgcolor:背景色

 align:对齐方式

 td:定义单元格

 colspan:合并列

 rowspan:合并行

 th:定义表头单元格

     <caption>:表格标题

     <thead>:表示表格的头部分

         <tbody>:表示表格的体部分

     <tfoot>:表示表格的脚部分

 

表格之中可以存放图片,我们可以用表格作为模板,去设计网页。在一个单列的表格之中,每一行都可以嵌套多列的表格,用这种方式去完成设计。

     9 表单标签:做一张表单,供用户填选信息。

       <from> : 定义表单的标签,只有作用在<from>中的表单项标签,才会被提交上去。

              <from>属性:action 指定数据提交的地址(URL)

                          Method 指定提交的方式  : get:1. 提交数据会在地址栏中显示。会封装到请求行中,因此不太安全。

                                                         2. 提交数据大小是有限制的。

                                                    Post:1.请求参数不会再地址栏中显示。会封装在请求体中,因此较为安全。

  1. 提交数据的大小是没有限制的

        表单项标签:就是的用于提交数据的模板

          表单项标签必须指明其name属性,也就是要提交数据的名字,否则不会被提交

          <Label> 让输入框和文字信息绑定在一起 :让<lable>的for属性值和表单项标签的属性值对应,可以实现在点击文字信息的时候,相当于点击输入框。

        1 <input> 用于创建一个输入框,选择按钮,提交按钮,可以通过type属性改变样式

            type属性 *text 默认属性 创建一个文本输入框,可以与value属性连用(给文本框初始值),一般与<placeholder>连用(虚的初始值,一点击,一输入,就被取代了)

                     *password 创建一个密码输入框,会让密码不可见(*)

                     *radio 创建一个单项选择按钮,如果要创建多个按钮只能选择一个,要保证其name属性相同。<Cheked>属性设置默认选项。

                             要给每个选项加一个value属性,代表选择之后提交的值。

                     *checkbox 创建一个多选按钮,可以同时勾选多个选项。<chekde>默认值,value要提交的值。

            value属性:根据type判断,有真正要提交的数据(radio,不加value属性,就没有提交的值),也有初始默认值(text,写上提交啥)。

 同一个name的radio,只会被选择一个,而同一个name的checkbox可以被选择多个

                 * file:可以添加一个要提交的文件 (任意类型)

                 * hidden:隐藏域,用户看不见,可以设置要提交的信息

                 * submit:提交按钮,可以提交数据的按钮。

                 * button:就是一个按钮。需要自己设置。

                 * image: 也是提交按钮,但可以通过 src属性设置一张图片的路径,点击图片提交

 

        2<select>:是一个下拉列表,用<option>来指定列表项

                    *selected:添加初始默认值

                    *value : 要提交的信息。

        3<textarea>文本域

*cols:指定每一行有多少字符

*row:初始的默认是多少行

                                  

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值