当前位置: 首页 > Web前端 > HTML5

一分钟看懂HTML和CSS(Lebyte,Lebytejava,LebyteArchitecture)2

时间:2023-04-06 00:22:24 HTML5

HTML和CSS(二)想成为优秀的java架构师,看这里→Lebyte免费公开课(腾讯课堂)如果你需要更多资讯请点击右侧→这是一条不归路,有秃顶风险,请慎重选择!主要内容HTML页面常用的标签由标签组成,不同的标签浏览器呈现不同的风格和内容。我们需要记住常用的标签。大致可以分为以下几类:标题、横线、段落、换行符、图片、表格、超链接、列表、表单、下拉列表、div、span。标题和横向标题

-

标签可以定义标题,标题按降序排列。由于h元素具有精确的语义,请谨慎选择合适的标记级别来构建文档的结构。请不要使用标题标签来更改同一行的字体大小。相反,我们应该使用级联样式表定义来实现漂亮的显示效果。这样的标签不会产生错误,但不具有标题的效果。h1标签可以被搜索引擎获取,从而使页面搜索的时候可以检索到,但是一个页面最好只有一个h1标签,否则可能会进入搜索引擎的黑名单。

水平线标记在HTML页面中创建一条水平线,在视觉上将文档分成多个部分。在HTML中,标签没有结束标签。
常用属性属性值说明alignCenterLeftright指定hr元素的对齐方式,后面可以换成stylesizepixels指定hr元素的高度(粗细),后面可以换成widthPixels%指定宽度hr元素,稍后可以使用Style将其替换为段落并包装段落

标签定义段落。p元素会自动在其前后创建一些空白。浏览器会自动添加这些空格,或者你可以在你的样式表中指定它们。理解:中文教材的段落之间会有很大的差距。

常用属性属性值说明alignleft,right,center,justify指定段落中文字的对齐方式,以后可以用style代替。br标签是一个换行符,
标签是一个空标签(意思是它没有结束标签,所以这是错误的:

)。注意:
标签只是开始换行,当浏览器遇到

标签时,它通常会在相邻段落之间插入一些垂直间距。请使用
输入空行,而不是打断段落。
列表无序列表由

  • 标签组成。
    • ...
    • 努力学习
    • 天天向上
    commonattribute属性值说明typedisccirclesquare指定列表的项目符号类型。可以使用样式覆盖。dise:实心圆(默认)circle:空心圆square:有序的正方形列表由
    1. 标签组成。
      1. ...
      1. 努力学习
      2. 每天
      共同attribute属性值描述type1aAiI指定列表中使用的标记类型。1:以数字形式表示序号(默认)a:以小写字母表示序号A:以大写字母表示序号i:以小写罗马数字表示序号I(大写i):表示序号大写罗马数字div和spandiv
      是块级元素,通常与css结合使用,用于布局。
      标签可以将文档分成独立的、不同的部分。它可以用作严格的组织工具,不使用任何与之关联的格式。
      是块级元素。这意味着它的内容自动在新行开始。事实上,换行符是
      固有的唯一格式化行为。可以通过
      的类或ID应用其他样式。
      content
      常用属性属性值说明alignleft,right,center指定div元素中内容的对齐方式,以后可以用style代替。span标签用于组合文档中的行内元素,span没有固定的格式表示。它仅在应用样式时在视觉上发生变化。content格式化标签font指定文本的字体、字体大小和字体颜色pre定义预格式化文本。包含在pre元素中的文本通常会保留空格和换行符。文本也将呈现为等宽文本标记****(粗体文本)、****(斜体文本)、****(带下划线的文本)、(underlinedtext),(subscriptedtext),(superscriptedtext)标签标签定义从一个页面链接到另一个页面的超链接。元素最重要的属性是href属性,它表示要链接的目标位置。同时,没有href属性,a标签中的内容和普通文本没有区别,失去了超链接的作用。如果想跳转到当前页面,href的值为#。链接页面通常显示在当前浏览器窗口中,除非您指定另一个目标(target属性)。百度常用属性该属性值描述了hrefURL连接要重定向到的位置,可以是其他页面,也可以是当前页面。targetblank_parent_selftopFramename指定在何处打开链接文档作为锚点a标签的name值。_blank:打开新页面显示页面;_self:当前页面显示和跳转页面,默认值。_top:对于frameset布局的页面,希望覆盖整个页面显示。Framename:这里的framename和上面的值不一样。具体以框架名称为准。该值表示跳转后将要连接的页面显示在对应名称的frame中。Anchor的实现使用a标签的name属性:一般标签的id属性:divid="",aid=""等:
      ,锚点定位返回第一个图片img元素嵌入一张图片到网页。注意:从技术上讲,标签并不是在网页中插入图片,而是从网页链接图片。标签为引用的图像创建一个占位符。Requiredattribute属性值说明alttext指定图片的替代文字,一般占位文字无法在图片中正常显示。srcURL指定显示图像的URL。常用属性属性值说明aligntop,bottom,middle,left,right指定图片如何根据周围的文字排列borderpixels定义图片周围的边框heightpixels,%定义图片的高度。widthpixels,%定义图像的宽度。titletext鼠标悬停在图像上时显示的文本表格
      标签定义了一个HTML表格。标签定义了表格的行。tr元素包含一个或多个th或td元素标签定义HTML表格中的标准单元格。定义表格中的标题单元格。th元素内的文本通常呈现为居中粗体文本,而td元素内的文本通常是左对齐的普通文本。一个简单的HTML表格由一个table元素和一个或多个tr、th或td元素组成。理解:table相当于表格的外框,tr是一行,td是一个单元格,th是一个带有一个标题功能,th里面的内容同时有加粗的效果。常用属性属性值说明alignright,center,left表格对齐方式borderpx指定表格边框宽度width%,px指定表格宽度tr常用属性属性值说明alignright,left,center定义表格行内容对齐方式.bgcolorrgb(x,x,x),#xxxxxx,colorname指定表格行的背景色,以后可以用style代替。valigntop,middle,bottom指定表格行内容的垂直对齐方式,以后可以替换为样式。的colspan和rowspan分别指定单元格跨越的列数和行数Formform
      标签用于为用户输入创建HTML表单。表单可以包含输入元素,例如文本字段、复选框、单选按钮、提交按钮等。它还可以包含文本区域等元素。表单用于将数据传输到服务器。表单元素是块级元素,在它之前和之后中断。常用属性属性值说明actionURL指定提交表单时将表单数据发送到哪里method:表单提交方式:get,postget:默认,主动获取方式,数据放在url上,数据容量有限,安全性差,有缓存post:数据放在请求实体,数据量理论上是无限的。相对安全,无缓存输入标签用于收集用户信息。根据type属性的取值,输入字段有多种形式。输入字段可以是文本字段、复选框、单选按钮、按钮等。常用属性属性值说明alttext定义图像输入的替代文本。checkedchecked指定首次加载时应检查此输入元素。disableddisabled在加载输入元素时禁用此元素。readonlyreadonly指定输入字段是只读的。maxlengthnumber指定输入字段中字符的最大长度。valuevalue指定输入元素的值。typebuttoncheckboxfilehiddenimagepasswordradioresetsubmittext指定输入元素的类型。按钮复选框文件隐藏字段图片按钮密码单选按钮重置按钮提交按钮文本如果上传文件,请求方式为post,并在表单中添加一个属性:enctype="multipart/form-data"注:1.Nonename属性的属性不能提交到后台!!!!2.同名单选按钮为一组。3.Checkbox复选按钮以相同名称分组。textarea这个标签定义了一个多行文本输入控件。文本区域可以容纳无限量的文本,文本区域的大小可以通过cols和rows属性指定。cols指定文本区域的可见宽度。rows指定文本区域中可见的行数。labelbutton常用属性属性值说明disableddisabled禁用按钮。typebutton、submit和reset指定按钮的类型。valuetext指定按钮的初始值。namebutton_name指定按钮的名称。selectselectcommonattribute属性值说明disableddisabled禁用下拉框。multiplemultiple指定可以选择多个选项。namename指定下拉列表的名称。sizenumber指定下拉列表中可见选项的数量。optioncommonattributes属性值说明disableddisabled禁用下拉框。selectedselected指定选项(当首次显示在列表中时)表现为选中状态。valuetext定义发送到服务器的选项值。公共字符实体在HTML中,某些字符是保留的。小于号(<)和大于号(>)不能在HTML中使用,因为浏览器会将它们误认为标签。要想正确显示保留字符,就必须在HTML源码中使用字符实体。实体名称是区分大小写的!标签的分类HTML中标签元素分为三种不同类型:块元素、行内元素、行内块元素。块级元素元素换行开始,后面的元素也换行开始;可以设置元素的高度、宽度、行高、上下外边距;如果未设置元素宽度,则为父容器本身的100%(与父元素的宽度一致),除非设置了宽度。内联元素和其他元素在一行;无法设置元素的高度、宽度、上下外边距;元素的宽度是它包含的文本或图像的宽度,不能更改。行内块元素是保留的。小于号(<)和大于号(>)不能在HTML中使用,因为浏览器会将它们误认为标签。如果我们想要正确显示保留字符,就必须在HTML源代码中使用字符实体。实体名称区分大小写!标签的分类HTML中标签元素分为三种不同类型:块元素、行内元素、行内块元素。块级元素元素换行开始,后面的元素也换行开始;可以设置元素的高度、宽度、行高、上下外边距;如果未设置元素宽度,则为父容器本身的100%(与父元素的宽度一致),除非设置了宽度。内联元素和其他元素在一行;无法设置元素的高度、宽度、上下外边距;元素的宽度是它包含的文本或图像的宽度,不能更改。行内块元素和其他元素在一行上;元素的高度、宽度、行高以及上下边距都是可设置的。