html5cssjs代码 036 CSS默认值
html5&css&js代码 036 CSS默认值
- 一、代码
- 二、解释
CSS默认值(也称为浏览器默认样式)是指当HTML元素没有应用任何外部CSS样式时,浏览器自动为这些元素赋予的一组基本样式。这些样式是由浏览器的默认样式表(User Agent stylesheet)定义的,不同的浏览器可能会有细微的差异,但大多数浏览器在样式上保持了较高的一致性。
一、代码
<!DOCTYPE html>
<html lang="zh-cn"><head><title>css默认值 编程笔记 html5&css&js</title><meta charset="utf-8" /><style>body {color: cyan;background-color: teal;}table {margin: auto;width: 80%;font-family: "Microsoft Yahei";word-wrap: break-word;text-align: justify;border-collapse: collapse;font-size: 18px;border-width: 1px;border-style: solid;border-color: black;width: 60%;}table th {height: 50px;font-size: 28px;}table td {height: 24px;font-size: 18px;}table th,table td {padding: 8px 8px;border-color: orange;border-style: solid;border-collapse: collapse;box-sizing: 1px;border-width: 1px;}</style></head><body><table><tbody><tr><th width="30%">元素</th><th width="70%">默认的 CSS 值</th></tr><tr><td>a:link</td><td><ul><li>color: (internal value);</li><li>text-decoration: underline;</li><li>cursor: auto;</li></ul></td></tr><tr><td>a:visited</td><td><ul><li>color: (internal value);</li><li>text-decoration: underline;</li><li>cursor: auto;</li></ul></td></tr><tr><td>a:link:active</td><td>color: (internal value);</td></tr><tr><td>a:visited:active</td><td>color: (internal value);</td></tr><tr><td>abbr</td><td>None.</td></tr><tr><td>address</td><td><ul><li>display: block;</li><li>font-style: italic;</li></ul></td></tr><tr><td>area</td><td>display: none;</td></tr><tr><td>article</td><td>display: block;</td></tr><tr><td>aside</td><td>display: block;</td></tr><tr><td>audio</td><td>None.</td></tr><tr><td>b</td><td>font-weight: bold;</td></tr><tr><td>base</td><td>None.</td></tr><tr><td>bdi</td><td>None.</td></tr><tr><td>bdo</td><td>unicode-bidi: bidi-override;</td></tr><tr><td>blockquote</td><td><ul><li>display: block;</li><li>margin-top: 1em;</li><li>margin-bottom: 1em;</li><li>margin-left: 40px;</li><li>margin-right: 40px;</li></ul></td></tr><tr><td>body</td><td><ul><li>display: block;</li><li>margin: 8px;</li></ul></td></tr><tr><td>body:focus</td><td>outline: none;</td></tr><tr><td>br</td><td>None.</td></tr><tr><td>button</td><td>None</td></tr><tr><td>canvas</td><td>None.</td></tr><tr><td>caption</td><td><ul><li>display: table-caption</li><li>text-align: center;</li></ul></td></tr><tr><td>cite</td><td>font-style: italic;</td></tr><tr><td>code</td><td>font-family: monospace;</td></tr><tr><td>col</td><td>display: table-column;</td></tr><tr><td>colgroup</td><td>display: table-column-group</td></tr><tr><td>datalist</td><td>display: none;</td></tr><tr><td>dd</td><td><ul><li>display: block;</li><li>margin-left: 40px;</li></ul></td></tr><tr><td>del</td><td>text-decoration: line-through;</td></tr><tr><td>details</td><td>display: block;</td></tr><tr><td>dfn</td><td>font-style: italic;</td></tr><tr><td>dialog</td><td>None.</td></tr><tr><td>div</td><td>display: block;</td></tr><tr><td>dl</td><td><ul><li>display: block;</li><li>margin-top: 1em;</li><li>margin-bottom: 1em;</li><li>margin-left: 0;</li><li>margin-right: 0;</li></ul></td></tr><tr><td>dt</td><td>display: block;</td></tr><tr><td>em</td><td>font-style: italic;</td></tr><tr><td>embed:focus</td><td>outline: none;</td></tr><tr><td>fieldset</td><td><ul><li>display: block;</li><li>margin-left: 2px;</li><li>margin-right: 2px;</li><li>padding-top: 0.35em;</li><li>padding-bottom: 0.625em;</li><li>padding-left: 0.75em;</li><li>padding-right: 0.75em;</li><li>border: 2px groove (internal value);</li></ul></td></tr><tr><td>figcaption</td><td>display: block;</td></tr><tr><td>figure</td><td><ul><li>display: block;</li><li>margin-top: 1em;</li><li>margin-bottom: 1em;</li><li>margin-left: 40px;</li><li>margin-right: 40px;</li></ul></td></tr><tr><td>footer</td><td>display: block;</td></tr><tr><td>form</td><td><ul><li>display: block;</li><li>margin-top: 0em;</li></ul></td></tr><tr><td>h1</td><td><ul><li>display: block;</li><li>font-size: 2em;</li><li>margin-top: 0.67em;</li><li>margin-bottom: 0.67em;</li><li>margin-left: 0;</li><li>margin-right: 0;</li><li>font-weight: bold;</li></ul></td></tr><tr><td>h2</td><td><ul><li>display: block;</li><li>font-size: 1.5em;</li><li>margin-top: 0.83em;</li><li>margin-bottom: 0.83em;</li><li>margin-left: 0;</li><li>margin-right: 0;</li><li>font-weight: bold;</li></ul></td></tr><tr><td>h3</td><td><ul><li>display: block;</li><li>font-size: 1.17em;</li><li>margin-top: 1em;</li><li>margin-bottom: 1em;</li><li>margin-left: 0;</li><li>margin-right: 0;</li><li>font-weight: bold;</li></ul></td></tr><tr><td>h4</td><td><ul><li>display: block;</li><li>margin-top: 1.33em;</li><li>margin-bottom: 1.33em;</li><li>margin-left: 0;</li><li>margin-right: 0;</li><li>font-weight: bold;</li></ul></td></tr><tr><td>h5</td><td><ul><li>display: block;</li><li>font-size: .83em;</li><li>margin-top: 1.67em;</li><li>margin-bottom: 1.67em;</li><li>margin-left: 0;</li><li>margin-right: 0;</li><li>font-weight: bold;</li></ul></td></tr><tr><td>h6</td><td><ul><li>display: block;</li><li>font-size: .67em;</li><li>margin-top: 2.33em;</li><li>margin-bottom: 2.33em;</li><li>margin-left: 0;</li><li>margin-right: 0;</li><li>font-weight: bold;</li></ul></td></tr><tr><td>head</td><td>display: none;</td></tr><tr><td>header</td><td>display: block;</td></tr><tr><td>hr</td><td><ul><li>display: block;</li><li>margin-top: 0.5em;</li><li>margin-bottom: 0.5em;</li><li>margin-left: auto;</li><li>margin-right: auto;</li><li>border-style: inset;</li><li>border-width: 1px;</li></ul></td></tr><tr><td>html</td><td><ul><li>display: block;</li><li>html:focus</li><li>outline: none;</li></ul></td></tr><tr><td>i</td><td>font-style: italic;</td></tr><tr><td>iframe:focus</td><td>outline: none;</td></tr><tr><td>iframe[seamless]</td><td>display: block;</td></tr><tr><td>img</td><td>display: inline-block;</td></tr><tr><td>input</td><td>None.</td></tr><tr><td>ins</td><td>text-decoration: underline;</td></tr><tr><td>kbd</td><td>font-family: monospace;</td></tr><tr><td>label</td><td>cursor: default;</td></tr><tr><td>legend</td><td><ul><li>display: block;</li><li>padding-left: 2px;</li><li>padding-right: 2px;</li><li>border: none;</li></ul></td></tr><tr><td>li</td><td>display: list-item;</td></tr><tr><td>link</td><td>display: none;</td></tr><tr><td>main</td><td>None.</td></tr><tr><td>map</td><td>display: inline;</td></tr><tr><td>mark</td><td><ul><li>background-color: yellow;</li><li>color: black;</li></ul></td></tr><tr><td>menu</td><td><ul><li>display: block;</li><li>list-style-type: disc;</li><li>margin-top: 1em;</li><li>margin-bottom: 1em;</li><li>margin-left: 0;</li><li>margin-right: 0;</li><li>padding-left: 40px;</li></ul></td></tr><tr><td>menuitem</td><td>None.</td></tr><tr><td>meta</td><td>None.</td></tr><tr><td>meter</td><td>None.</td></tr><tr><td>nav</td><td>display: block;</td></tr><tr><td>noscript</td><td>None.</td></tr><tr><td>object:focus</td><td>outline: none;</td></tr><tr><td>ol</td><td><ul><li>display: block;</li><li>list-style-type: decimal;</li><li>margin-top: 1em;</li><li>margin-bottom: 1em;</li><li>margin-left: 0;</li><li>margin-right: 0;</li><li>padding-left: 40px;</li></ul></td></tr><tr><td>optgroup</td><td>None.</td></tr><tr><td>option</td><td>None.</td></tr><tr><td>output</td><td>display: inline;</td></tr><tr><td>p</td><td><ul><li>display: block;</li><li>margin-top: 1em;</li><li>margin-bottom: 1em;</li><li>margin-left: 0;</li><li>margin-right: 0;</li></ul></td></tr><tr><td>param</td><td>display: none;</td></tr><tr><td>picture</td><td>None.</td></tr><tr><td>pre</td><td><ul><li>display: block;</li><li>font-family: monospace;</li><li>white-space: pre;</li><li>margin: 1em 0;</li></ul></td></tr><tr><td>progress</td><td>None.</td></tr><tr><td>q</td><td>display: inline;</td></tr><tr><td>q::before</td><td>content: open-quote;</td></tr><tr><td>q::after</td><td>content: close-quote;</td></tr><tr><td>rp</td><td>None.</td></tr><tr><td>rt</td><td>line-height: normal;</td></tr><tr><td>ruby</td><td>None.</td></tr><tr><td>s</td><td>text-decoration: line-through;</td></tr><tr><td>samp</td><td>font-family: monospace;</td></tr><tr><td>script</td><td>display: none;</td></tr><tr><td>section</td><td>display: block;</td></tr><tr><td>select</td><td>None.</td></tr><tr><td>small</td><td>font-size: smaller;</td></tr><tr><td>source</td><td>None.</td></tr><tr><td>span</td><td>None.</td></tr><tr><td>strike</td><td>text-decoration: line-through;</td></tr><tr><td>strong</td><td>font-weight: bold;</td></tr><tr><td>style</td><td>display: none;</td></tr><tr><td>sub</td><td><ul><li>vertical-align: sub;</li><li>font-size: smaller;</li></ul></td></tr><tr><td>summary</td><td>display: block;</td></tr><tr><td>sup</td><td><ul><li>vertical-align: super;</li><li>font-size: smaller;</li></ul></td></tr><tr><td>table</td><td><ul><li>display: table;</li><li>border-collapse: separate;</li><li>border-spacing: 2px;</li><li>border-color: gray;</li></ul></td></tr><tr><td>tbody</td><td><ul><li>display: table-row-group;</li><li>vertical-align: middle;</li><li>border-color: inherit;</li></ul></td></tr><tr><td>td</td><td><ul><li>display: table-cell;</li><li>vertical-align: inherit;</li></ul></td></tr><tr><td>template</td><td>None.</td></tr><tr><td>textarea</td><td>None.</td></tr><tr><td>tfoot</td><td><ul><li>display: table-footer-group;</li><li>vertical-align: middle;</li><li>border-color: inherit;</li></ul></td></tr><tr><td>th</td><td><ul><li>display: table-cell;</li><li>vertical-align: inherit;</li><li>font-weight: bold;</li><li>text-align: center;</li></ul></td></tr><tr><td>thead</td><td><ul><li>display: table-header-group;</li><li>vertical-align: middle;</li><li>border-color: inherit;</li></ul></td></tr><tr><td>time</td><td>None.</td></tr><tr><td>title</td><td>display: none;</td></tr><tr><td>tr</td><td><ul><li>display: table-row;</li><li>vertical-align: inherit;</li><li>border-color: inherit;</li></ul></td></tr><tr><td>track</td><td>None.</td></tr><tr><td>u</td><td>text-decoration: underline;</td></tr><tr><td>ul</td><td><ul><li>display: block;</li><li>list-style-type: disc;</li><li>margin-top: 1em;</li><li>margin-bottom: 1 em;</li><li>margin-left: 0;</li><li>margin-right: 0;</li><li>padding-left: 40px;</li></ul></td></tr><tr><td>var</td><td>font-style: italic;</td></tr><tr><td>video</td><td>None.</td></tr><tr><td>wbr</td><td>None.</td></tr></tbody></table></body>
</html>
二、解释
CSS默认值(也称为浏览器默认样式)是指当HTML元素没有应用任何外部CSS样式时,浏览器自动为这些元素赋予的一组基本样式。这些样式是由浏览器的默认样式表(User Agent stylesheet)定义的,不同的浏览器可能会有细微的差异,但大多数浏览器在样式上保持了较高的一致性。
CSS默认值的目的是确保网页即使在没有CSS的情况下也能呈现出一定的可读性和外观。这些默认值包括了字体大小、颜色、边距、填充、列表样式等多种属性。例如:
- 所有的HTML元素都会有一个默认的字体大小(通常是16像素)。
- 链接(
<a>
标签)默认会有不同的颜色(通常是蓝色),并且带有下划线,以区分它们是可以点击的。 - 段落(
<p>
标签)默认会有上下一定的边距。 - 列表(
<ul>
,<ol>
标签)会有默认的列表项标记和缩进。
了解和使用CSS默认值对于网页开发者来说很重要,因为它可以帮助你快速构建网页的基础样式,并且可以在编写自定义样式时作为参考。有时,开发者会使用CSS的reset
或normalize
方法来重置或统一不同浏览器的默认样式,以便更好地控制网页的整体外观和响应性。
相关文章:

html5cssjs代码 036 CSS默认值
html5&css&js代码 036 CSS默认值 一、代码二、解释 CSS默认值(也称为浏览器默认样式)是指当HTML元素没有应用任何外部CSS样式时,浏览器自动为这些元素赋予的一组基本样式。这些样式是由浏览器的默认样式表(User Agent sty…...
小米路由器4A千兆版刷回官方固件
原文链接:小米路由器4A千兆版刷回官方固件及修改SN绑定APP-小米无线路由器及小米网络设备-恩山无线论坛 (right.com.cn) 进入breed 由于openwrt工作不稳定,决定重新刷回官方固件。 由于当前路由器已经刷过breed,不再重新刷入。 如何刷入b…...

【Leetcode每日一题】 递归 - 两两交换链表中的节点(难度⭐)(38)
1. 题目解析 题目链接:24. 两两交换链表中的节点 这个问题的理解其实相当简单,只需看一下示例,基本就能明白其含义了。 2.算法原理 一、理解递归函数的含义 首先,我们需要明确递归函数的任务:给定一个链表…...

如何部署GPT模型至自有服务器:从零开始搭建你的智能聊天机器人
引言 GPT模型是自然语言处理领域的重要突破,它能够通过生成式的文本生成方式,实现与用户的智能交互。本文将详细介绍如何将GPT模型部署到自有服务器上,并编写一个基本的API接口来实现与聊天机器人的交互。 目录 引言 一、准备工作 首先&am…...
uniapp 之 一些常用方法的封装(页面跳转,页面传参等)
util.js 提示:permission.js是uniapp插件市场由官方DCloud_heavensoft提供的App权限判断和提示插件。 import permision from "/js_sdk/wa-permission/permission.js"/*** uni.toast 封装* param {String} msg toast 提示内容* param {Number} duration …...
flutter 单列选择器
引入 flutter_pickers: ^2.1.9 import package:flutter_pickers/pickers.dart; import package:flutter_pickers/style/default_style.dart; import package:flutter_pickers/style/picker_style.dart;List<String> _numberList [99,98,97,96,95,94,93,92,91,90,89,88,…...

管理类联考–复试–英文面试–问题–WhatWhyHow--纯英文汇总版
文章目录 Do you have any hobbies? What are you interested in? What do you usually do in your spare time? Could you tell me something about your family? Could you briefly introduce your family? What is your hometown like? Please tell me so…...

亮数据代理IP轻松解决爬虫数据采集痛点
文章目录 一、爬虫数据采集痛点二、为什么使用代理IP可以解决?2.1 爬虫和代理IP的关系2.2 使用代理IP的好处 一、爬虫数据采集痛点 爬虫数据采集可能会面临一些挑战和痛点,其中包括: 爬虫代码维护难:网站的结构可能会经常变化&am…...

html5cssjs代码 035 课程表
html5&css&js代码 035 课程表 一、代码二、解释基本结构示例代码常用属性样式和装饰响应式表格辅助技术 一个具有亮蓝色背景的网页,其中包含一个样式化的表格用于展示一周课程安排。表格设计了交替行颜色、鼠标悬停效果以及亮色表头,并对单元格设…...

Eclipse For ABAP:安装依赖报错
1.安装好Eclipse后需要添加依赖,这里的地址: https://tools.hana.ondemand.com/latest 全部勾选等待安装结束; 重启后报错:ABAP communication layer is not configured properly. This might be caused by missing Microsoft Visual C++ 2013 (x64) Runtime DLLs. Consu…...
C++特性三:多态---纯析构和纯虚析构
多态使用时,如果子类中有属性开辟到堆区,那么父类指针在释放时无法调用到子类的析构代码 解决方式:将父类中的析构函数改为虚析构或者纯虚析构 虚析构和纯虚析构共性: 1.可以解决父类指针释放子类对象 2.都需要有具体的函数实现…...

创建可引导的 macOS 安装器
你可以将外置驱动器或备用宗卷用作安装 Mac 操作系统的启动磁盘。 以下高级步骤主要适用于系统管理员以及其他熟悉在“终端”中输入命令的经验丰富的用户。 升级 macOS 或重新安装 macOS 不需要可引导安装器,但如果你要在多台电脑上安装 macOS,而又不…...

ssm+vue的公廉租房维保系统(有报告)。Javaee项目,ssm vue前后端分离项目。
演示视频: ssmvue的公廉租房维保系统(有报告)。Javaee项目,ssm vue前后端分离项目。 项目介绍: 采用M(model)V(view)C(controller)三层体系结构&…...

【pycharm】作为Array查看出现数据无法显示问题(已解决)
【pycharm】作为Array查看出现数据无法显示问题(已解决) 当我们在调试代码的时候,需要对某个变量进行查看,就如同在matlab中,我们可以直接在工作区对某个变量进行双击查看矩阵变量的具体数值 在这里我遇到一个问题&am…...

matlab处理贝塞尔函数
说明:问题来自CSDN-问答板块,题主提问。 需求:在使用解析法求解电机的三维模型,编写程序时需要用到修正的贝塞尔函数,问题是在贝塞尔函数的自变量和阶数变化时函数值变化很大,导致最后求出来的气隙磁密非常大。 一、运行截图 二、解决代码...
【Python】Pycharm 的 python_stubs
Pycharm 的 python_stubs 问题 问题 Pycharm 为了对各种库暴露接口能在编码时提供快速的智能提示,会解析库并在 pycharm 安装目录的 python_stubs 下生成对应的存根,这个操作可以有效的提升 Pycharm 智能提示的效率。但是也有一个问题,称之为…...

AI大模型智能大气科学探索之:ChatGPT在大气科学领域建模、数据分析、可视化与资源评估中的高效应用及论文写作
本文深度探讨人工智能在大气科学中的应用,特别是如何结合最新AI模型与Python技术处理和分析气候数据。介绍包括GPT-4等先进AI工具,旨在帮助大家掌握这些工具的功能及应用范围。本文内容覆盖使用GPT处理数据、生成论文摘要、文献综述、技术方法分析等案例…...

rpc详解rpc框架
文章目录 概述rpc的优点组件工作流程&RPC的底层原理RPC的底层原理 RPC框架rpc框架优点RPC 的实现基础RPC的应用场景RPC使用了哪些关键技术rpc 调用异常一般怎么处理rpc和http的区别为什么RPC要比HTTP更快一些Dubbo和openfeign 区别远程调用RPC框架传输协议传输速度 概述 在…...

【评分标准】【网络系统管理】2019年全国职业技能大赛高职组计算机网络应用赛项H卷 无线网络勘测设计
第一部分:无线网络勘测设计评分标准 序号评分项评分细项评分点说明评分方式分值1点位设计图AP编号AP编号符合“AP型号位置编号”完全匹配5AP型号独立办公室、小型会议室选用WALL AP110完全匹配5员工寝室选用智分,其他用放装完全匹配5其它区域选用放装AP…...

停止docker 容器并删除对应镜像
docker 容器相关命令 docker ps 查看当前系统正在运行的容器情况,返回信息分别为: 容器ID:CONTAINER ID 镜像名IMAGE NAMES 运行命令COMMAND 创建时间CREATED 状态STATUS 映射端口 PORTS docker ps |grep XXX 可以…...
椭圆曲线密码学(ECC)
一、ECC算法概述 椭圆曲线密码学(Elliptic Curve Cryptography)是基于椭圆曲线数学理论的公钥密码系统,由Neal Koblitz和Victor Miller在1985年独立提出。相比RSA,ECC在相同安全强度下密钥更短(256位ECC ≈ 3072位RSA…...

JavaScript 中的 ES|QL:利用 Apache Arrow 工具
作者:来自 Elastic Jeffrey Rengifo 学习如何将 ES|QL 与 JavaScript 的 Apache Arrow 客户端工具一起使用。 想获得 Elastic 认证吗?了解下一期 Elasticsearch Engineer 培训的时间吧! Elasticsearch 拥有众多新功能,助你为自己…...
在HarmonyOS ArkTS ArkUI-X 5.0及以上版本中,手势开发全攻略:
在 HarmonyOS 应用开发中,手势交互是连接用户与设备的核心纽带。ArkTS 框架提供了丰富的手势处理能力,既支持点击、长按、拖拽等基础单一手势的精细控制,也能通过多种绑定策略解决父子组件的手势竞争问题。本文将结合官方开发文档,…...

全球首个30米分辨率湿地数据集(2000—2022)
数据简介 今天我们分享的数据是全球30米分辨率湿地数据集,包含8种湿地亚类,该数据以0.5X0.5的瓦片存储,我们整理了所有属于中国的瓦片名称与其对应省份,方便大家研究使用。 该数据集作为全球首个30米分辨率、覆盖2000–2022年时间…...
五年级数学知识边界总结思考-下册
目录 一、背景二、过程1.观察物体小学五年级下册“观察物体”知识点详解:由来、作用与意义**一、知识点核心内容****二、知识点的由来:从生活实践到数学抽象****三、知识的作用:解决实际问题的工具****四、学习的意义:培养核心素养…...
反射获取方法和属性
Java反射获取方法 在Java中,反射(Reflection)是一种强大的机制,允许程序在运行时访问和操作类的内部属性和方法。通过反射,可以动态地创建对象、调用方法、改变属性值,这在很多Java框架中如Spring和Hiberna…...
WEB3全栈开发——面试专业技能点P2智能合约开发(Solidity)
一、Solidity合约开发 下面是 Solidity 合约开发 的概念、代码示例及讲解,适合用作学习或写简历项目背景说明。 🧠 一、概念简介:Solidity 合约开发 Solidity 是一种专门为 以太坊(Ethereum)平台编写智能合约的高级编…...
Go 语言并发编程基础:无缓冲与有缓冲通道
在上一章节中,我们了解了 Channel 的基本用法。本章将重点分析 Go 中通道的两种类型 —— 无缓冲通道与有缓冲通道,它们在并发编程中各具特点和应用场景。 一、通道的基本分类 类型定义形式特点无缓冲通道make(chan T)发送和接收都必须准备好࿰…...

使用LangGraph和LangSmith构建多智能体人工智能系统
现在,通过组合几个较小的子智能体来创建一个强大的人工智能智能体正成为一种趋势。但这也带来了一些挑战,比如减少幻觉、管理对话流程、在测试期间留意智能体的工作方式、允许人工介入以及评估其性能。你需要进行大量的反复试验。 在这篇博客〔原作者&a…...

毫米波雷达基础理论(3D+4D)
3D、4D毫米波雷达基础知识及厂商选型 PreView : https://mp.weixin.qq.com/s/bQkju4r6med7I3TBGJI_bQ 1. FMCW毫米波雷达基础知识 主要参考博文: 一文入门汽车毫米波雷达基本原理 :https://mp.weixin.qq.com/s/_EN7A5lKcz2Eh8dLnjE19w 毫米波雷达基础…...