html篇

1.动态网页和静态网页的区别

静态网页:代码和内容写好后,不会改变的网页。

动态网页:代码和内容写好后,内容会随着时间,环境,数据库操作结果而改变的网页。

2.块级元素和行内元素的区别

块级元素:独占一行,可以定义宽高,默认宽度为100%;

行内元素:多个元素可以放在同一行,除非超宽自动折行,不能直接定义宽高,宽度随内容而定。

3.img标签的提示文字

<img src="" alt="加载失败时的提示文字" title="鼠标悬停时的提示文字">

4.下拉框

在很多时候都会用到这个标签,它和option是配套使用的

select 标签中加multiple ,默认展开下拉框,可同时选择多个选项。

<select>
	<option><option>	
  <option><option>
	<option><option>
</select>

5.label 标签

用的很多,例:表单验证提示信息 ;用它修改复选框/单选框默认样式 做提升用户体验的点击效果。

6.table去除内外边距,td边框重叠 合并表格

border-collapse:collapse;//合并表格边框

table标签上直接加cellspacing="0" ---对应css中margin--去除格子之间的间隙

table标签上直接加cellpadding="0"---对应css中padding--去除表格与内容之间的留白

colspan=""/rowspan=""//合并横向和纵向 注意:只能在td上进行合并,合并后要在标签上删除合并的元素

7.阻止a标签的跳转和刷新

<a href ="javascript:return false;">禁止点击 </a>  
//或者
<a href ="javascript:void(0);">禁止点击 </a>
js中 e.parentDefault     return false 也能实现

8.input修改为不可输入状态

  1. disabled 属性规定应该禁用 input 元素,被禁用的 input 元素,不可编辑,不可复制,不可选择,不能接收焦点,后台也不会接收到传值。设置后文字的颜色会变成灰色。disabled 属性无法与 <input type="hidden"> 一起使用。
    示例:<input type="text" disabled="disabled" />
  2. readonly 属性规定输入字段为只读可复制,但是,用户可以使用Tab键切换到该字段,可选择,可以接收焦点,还可以选中或拷贝其文本。后台会接收到传值. readonly 属性可以防止用户对值进行修改。readonly 属性可与 <input type="text"> 或 <input type="password"> 配合使用。
    示例:<input type="text" readonly="readonly">
  3. readonly unselectable="on" 该属性跟disable类似,input 元素,不可编辑,不可复制,不可选择,不能接收焦点,设置后文字的颜色也会变成灰色,但是后台可以接收到传值。

示例:<input type="text"  readonly  unselectable="on" >

9.pre标签

说明:http://yige.org/tags/tag_pre.php

contenteditable:html标签属性--是否可编辑状态

paste:粘贴触发

<pre
  class="edit-area"
  contenteditable
  placeholder="请输入内容"
  ref="editArea"
  @input="e => (message = e.target.innerText)"
  @paste.prevent="reslovePaste"
  @keyup.enter.prevent.exact="sendMessage()"
  @click="setRange"
  @keyup="setRange"
></pre>

核心属性

<pre>标签支持以下核心属性:

属性

描述

DTD

class

类名

指明元素的类名

STF

dir

rtl
ltr

指定元素里内容的文本方向

STF

id

id

指明元素的唯一id

STF

lang

语言代码

指定元素内容的语言代码

STF

style

样式定义

指定元素的内嵌样式

STF

title

文本

指定元素的提示文本

STF

xml:lang

语言代码

在XHTML文档中指定元素内容的语言代码

STF

更多关于核心属性的信息。


事件属性

<pre>标签支持以下事件属性:

属性

描述

DTD

onclick

脚本

在元素区域内单击鼠标(不区分左右键)时执行脚本

STF

ondblclick

脚本

在元素区域内双击鼠标(不区分左右键)时执行脚本

STF

onmousedown

脚本

在元素区域内按下鼠标键(不区分左右键)时执行脚本

STF

onmousemove

脚本

当鼠标指针在元素区域内移动时执行脚本

STF

onmouseout

脚本

当鼠标指针移出元素区域时执行脚本

STF

onmouseover

脚本

当鼠标指针移入元素区域时执行脚本

STF

onmouseup

脚本

在元素区域内松开鼠标键(不区分左右键)时执行脚本

STF

onkeydown

脚本

按下一个键时执行脚本

STF

onkeypress

脚本

按下并松开一个键时执行脚本

STF

onkeyup

脚本

松开一个键时执行脚本

STF

posted @ 2023-08-17 15:15  丶乔  阅读(16)  评论(0)    收藏  举报