2023年8月22日

Html: 锚点链接 / 锚点定位

锚点链接是超链接的一种.锚点可以连接到文档中的某一个特定位置.对于较长的页面来说,使用锚点链接可以快速定位到页面中的某一个位置,提升用户体验. 锚点链接的使用场景一般有以下两种: 跳转到当前页面的指定位置 跳转到其他页面的指定位置 注意 定义锚点可以使用name属性或者id属性; html5去掉了name属性,建议使用id定义锚点; 如果是页面顶部的锚点,可以省略不写(为了提高代码的可读性,建议不要省略); <!doctype html> <html lang="zh"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=…
2023年7月24日

Html: CSS 超出不换行

一、CSS实现超出不换行的原理 CSS实现超出不换行的原理是通过white-space属性来实现的。在默认情况下,HTML中元素内的文本中的多个空格和换行符都会被解析成一个空格,而当white-space属性值为nowrap时,会禁止文本中的换行和空格的解析,文本会折行,但是不会进行换行操作。 在某些情况下,文本的内容超出了所在元素的宽度范围,如果不设置white-space属性,会进行自动换行,这样会破坏整个页面的布局效果,而使用white-space属性则可以实现不换行,并且保证页面布局的完整性。 二、使用white-space属性实现超出不换行 以下为实现超出不换行的代码实例: <style> .example { width: 200px; /*设置元素宽度*/ white-space: nowrap; /*设置文本…
2023年7月23日

Html: CSS form 表单对齐

表单对齐方法如下: (1)每行表单分为左栏和右栏,左栏主要是文字,右栏是表单,所有行的左栏长度相等,所有行的右栏的盒子长度之和相等。 左栏一般是一个label,右栏是若干个文本框 (2)所有左栏和右栏的盒子设置为左浮动 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>表单对齐</title> <style type="text/css"> form{ width: 425px; font:14px bold "Microsoft Yahei"; } p:not(.register){ width: 425px; height: 42px; } /*p清浮动*/ p{ overflow: hidden…
2023年7月22日

Html: css实现div水平垂直居中的七种方式

一、使用grid布局 二、使用flex布局 三、使用定位+外边距 四、使用定位+平移 五、使用外边距 + 平移 六、使用文本对齐 + 行高 七、使用表格单元 一、使用grid布局 <!DOCTYPE html> <html lang="en"> <head> <title>test</title> <style> #outside { width: 200px; height: 200px; background: #000; display: grid; place-items: center; /* place-items等于justify-items:center; + align-items:center;*/ } #inside { width: 50px; height: 50px; background: #9…
2022年8月5日

Html: input标签设置disabled="disabled"属性 传值

1.如果不提交表单,设置了disabled属性的input标签的值是不可选取不可编辑状态; eg: <td width="15%" class="mip_form_td_label"><span>库存量:</span> </td> <td class="mip_form_td_content"> <input id="checkBeforeNumber" name="checkBeforeNumber" type="text" value="${CheckData.CHECKBEFORENUMBER}" disabled="disabled" /> </td> 2.如果提交表单,设置了disabled属性的input标签的值是无法传到后台的,也就是不可传值; 3…
2022年7月20日

Html: 详解a标签中href="javascript:"的几种用法

a标签的一种写法<a href="JavaScript:;"></a>,所以就来整理下a标签中href的几种用法。 一、js 伪协议的几种调用方法(参考总结的) 1、a href="javascript:js_method();" 这是常用的方法,但是这种方法在传递this等参数的时候很容易出问题,而且javascript:协议作为a的href属性的时候不仅会导致不必要的触发window.onbeforeunload事件,在IE里面更会使gif动画图片停止播放。W3C标准不推荐在href里面执行javascript语句 2、 a href="javascript:void(0);" onclick="js_method()" 这种方法是很多网站最常用的方法,也是最周全的方法,onclick方法负责执行js函…
2022年3月12日

Markdown 图片不显示

问题: Markdown 图片不显示显示,或显示成一个小小的方框,不显示图片。 原因: 有可能是无法识别,带有中文的图片名字和路径 解决办法: 使用PyCharm打开markdown文件,可完美支持中文路径。…