other
小于 1 分钟html
html 模板
<!doctype html>
<html lang="zh">
<head>
<!--
html lang 语言编码:
中文(简体和繁体一样):zh
英文:en
所有代码见:https://www.w3school.com.cn/tags/html_ref_language_codes.asp
-->
<meta charset="utf-8">
<title>语音播报</title>
<base href="/">
<meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body>
<script type="text/javascript"></script>
</body>
去掉html原生的空白区域
*{
padding:0px;margin:0px
}
计算宽高
概述

父容器高度基准减少指定px
父容器 div 使用了 padding 同时设置子 div 的高度为 100% 会导致子 div 超出父 div - 100%是按照父div计算的。如果要子 div 不要超过父 div 的高度,则要用到上面的计算高度 calc(100% - 50px),注意括号里面的减号两侧要有空格。
前置后置
为所有 p标签在内容前面追加“子曰”
p:before{
content:'子曰:';
}
后置追加:
p:after{
content: ' -- 摘自论语';
}
文本不换行显示省略号
overflow:hidden;
text-overflow:ellipsis;
white-space:nowrap
手型光标
- 在目标标签上定义类 class="hoverPointer"
- 在 css 文件中实现样式
.hoverPointer:hover {
cursor:pointer
}
div按照内容最大宽度
max-width: max-content
