十一、CSS初始化详解

CSS初始化

不同浏览器对有些标签的默认值是不同的,为了消除不同浏览器对HTML文本呈现的差异,照顾浏览器的兼容性,我们需要对CSS初始化。

简单理解:CSS初始化是指重设浏览器的样式。(也称为CSS reset)
每个网页都必须首先进行CSS初始化。

Unicode编码字体:

把中文字体的名称用相应的Unicode编码来代替,这样就可以有效的避免浏览器解程CSS代码时候出现乱码的问题。比如:
黑体 \9ED1\4F53
宋体 \5B8B\4F53
微软推黑 \5FAE\8F6F\96C5\9ED1

这里我们以京东CSS初始化代码为例。

/* 把我们所有标签的内外边距清零 */
* {margin: 0;padding: 0
}/* em 和 i 斜体的文字都不倾斜 */
em,
i {font-style: normal
}/* 去掉每个li前面的小圆点 */
li {list-style: none
}img {border: 0;/* 为了照顾低版本浏览器,如果 图片的外面包含了链接 会出现边框的问题 */vertical-align: middle /* 解决图片底侧出现空白缝隙的问题 */
}button {cursor: pointer /* 当我们鼠标经过button按钮时,鼠标变成小手的样子 */
}a {color: #666;text-decoration: none
}a:hover {color: #c81623
}button,
input {font-family: Microsoft YaHei, Heiti SC, tahoma, arial, Hiragino Sans GB, "\5B8B\4F53", sans-serif
}body {/* 抗锯齿性,避免文字被放大后会产生锯齿 */-webkit-font-smoothing: antialiased;background-color: #fff;/* 12px/1.5 表示所有字体的大小为12px,1.5倍的行高 *//* "\5B8B\4F53" 代表的是宋体,用这种方式,浏览器的兼容性会比较好。 把中文字体的名称用相应的Unicode编码来代替,这样就可以有效地避免浏览器解释CSS代码时出现乱码的情况*/font: 12px/1.5 Microsoft YaHei, Heiti SC, tahoma, arial, Hiragino Sans GB, "\5B8B\4F53", sans-serif;color: #666
}.hide,
.none {display: none
}/* 清除浮动 */
.clearfix:after {visibility: hidden;clear: both;display: block;content: ".";height: 0
}.clearfix {*zoom: 1
}

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/471300.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

计算机的起源和历史英语作文,端午节的由来和历史英语作文

端午节的由来和历史英语作文端午节与春节和中秋节并列为中国三大节日。下面是小编分享给大家的端午节的由来和历史英语作文,希望能给您带来帮助!端午节的由来和历史英语作文1The Dragon Boat Festival is a lunar holiday, occurring on the fifth day o…

第二十九天-ssh服务重要知识深入浅出讲解

目录概述: 1. SSH简介 2. SSH安全验证方式 3. 安装并测试OpenSSH 4. SSH的密匙 4.1 生成你自己的密匙对 4.2分发公用密匙 5. 配置SSH 5.1 配置客户端的软件 5.2 配置服务端的软件 6. 拷贝文件 6.1 用"scp"拷贝文件 6.2 用"sftp"拷贝文件 6.3 …

LeetCode 2141. 同时运行 N 台电脑的最长时间(二分查找)

文章目录1. 题目2. 解题1. 题目 你有 n 台电脑。给你整数 n 和一个下标从 0 开始的整数数组 batteries ,其中第 i 个电池可以让一台电脑 运行 batteries[i] 分钟。 你想使用这些电池让 全部 n 台电脑 同时 运行。 一开始,你可以给每台电脑连接 至多一个…

十二、HTML5新增标签特性详解(audio、video、input)

HTML5 第一天 一、什么是 HTML5 HTML5 的概念与定义 定义:HTML5 定义了 HTML 标准的最新版本,是对 HTML 的第五次重大修改,号称下一代的 HTML两个概念: 是一个新版本的 HTML 语言,定义了新的标签、特性和属性拥有一…

联想新电脑桌面没有计算机,联想电脑没有wifi图标不见了怎么办

1.联想笔记本电脑WiFi图标不见了,怎么回事吧,试了很多方法一、无线网卡开关未打开;1、查看周边有没有手动百机械开关,一般在前面板,上面标有无线符号。2、按一下Fn无线信号键(度F几中的一个)找打无线WIFI3、打开控制机板,右上角查…

Spring与Oauth2整合示例 spring-oauth-server

原文地址:http://www.oschina.net/p/spring-oauth-server?fromerrvpTctDBF转载于:https://www.cnblogs.com/longshiyVip/p/5052657.html

十三、CSS 3新特性详解(一)——属性、结构伪类、伪元素选择器,nth-child与nth-of-type区别,2D rotate,calc函数、滤镜filter、过渡transition

七、CSS3 属性选择器(上) 什么是 CSS3 在 CSS2 的基础上拓展、新增的样式 CSS3 发展现状 移动端支持优于 PC 端CSS3 目前还草案,在不断改进中CSS3 相对 H5,应用非常广泛 属性选择器列表 属性选择器代码演示 (1)E[att] 选择具有…

信息的表示和处理

文章目录1. 信息存储2. 整数的表示learn from 《深入理解计算机系统》 1. 信息存储 大多数计算机,一字节(最小的寻址单元) byte 8 bits 位 C语言中一个指针的值(无论它指向一个整数、一个结构或是某个其他程序对象)…

计算机等级考试试题在线测试,计算机等级考试上机练习题.pdf

计算机等级考试上机练习题一、程序设计题浙江省计算机等级考试(二级VB )上机测试的程序设计题,从2002 年秋季开始,其题型及考试要求都有较大变化。要求考生在老考生目录中,按照题目要求,自己新建一工程文件Design.Vbp &#xff0c…

十一、MySQL视图学习笔记(详解)

视图 含义:理解成一张虚拟的表,和普通表一样使用 mysql5.1版本出现的新特性,是通过表动态生成的数据 比如:舞蹈班和普通班级的对比 视图和表的区别: 名称创建语法的关键字使用占用物理空间视图create view增删改查&…

css cursor 的可选值(鼠标的各种样式)

crosshair; 十字准心 The cursor render as a crosshair游标表现为十字准线 cursor: pointer; cursor: hand;写两个是为了照顾IE5,它只认hand。 手 The cursor render as a pointer (a hand) that indicates a link游标以暗示(手指)的形式来表明有一个连…

2021年算法工作总结

2021年5月10日,我转行到互联网做算法工作,离开了工作接近8年的机械设计工作,还是要在这里感谢军哥对我的帮助和指点! 换工作后,陆续学了《流畅的python》,FastAPI框架学了点皮毛,python web 编…

学硕计算机考296算高分么,考研总分是多少算高分?考研340分是什么水平?

原标题:考研总分是多少算高分?考研340分是什么水平?每个考研的学生都想考一个高分,分数越高代表录取的希望越大,但是考研达到多少分算高分呢?有没有衡量考研分数的标准呢?小编为大家整理了关于考研总分高分相关的相关信息,一起…

HDU 4117 GRE Words

这道题不难想到这样的dp。 dp[字符串si] 以si为结尾的最大总权值。 dp[si] max(dp[sj]) &#xff0c;1.j < i&#xff0c;2.sj是si的子串。 对于第二个条件&#xff0c;是一个多模版串匹配的问题&#xff0c;可以用AC自动机。 预先O(m)把AC自动机建好&#xff0c;然后动态…

十四、CSS 3新特性详解(二)——2D转换(transform)、动画(animation)、动画序列

HTML5 第二天 一、rotate 2d旋转指的是让元素在2维平面内顺时针旋转或者逆时针旋转 使用步骤&#xff1a; 给元素添加转换属性 transform属性值为 rotate(角度) 如 transform:rotate(30deg) 顺时针方向旋转30度 div{transform: rotate(0deg); }二、三角 <!DOCTYPE html&…

pip/conda导出 requirements.txt 注意事项

pip 使用 pip freeze > ./requirements.txt 导出 requirements.txt 发现很多包没有版本号&#xff0c;而是 file:/// 使用pip list --formatfreeze > ./requirements.txt 导入安装 pip install -i https://pypi.tuna.tsinghua.edu.cn/simple -r requirements.txt con…

计算机系统操作在线作业,电子科大《计算机操作系统》在线作业3

计算机操作,计算机网络14春13秋 13春电子科大《计算机操作14春13秋 13春电子科大《计算机操作系统》在线作业3 1 2试卷总分&#xff1a;100 测试时间&#xff1a;--单选题、单选题(共 20 道试题&#xff0c;共 100 分。)1. 在下列性质中,哪一个是分时系统的特征()。A. 多路性B.…

fortune命令简介

本文转自《阮志峰的网络日志》&#xff0c;原文网址&#xff1a;http://www.ruanyifeng.com/blog/2015/04/fortune.html 作者&#xff1a; 阮一峰 日期&#xff1a; 2015年4月14日 美国中餐馆的最后一道菜&#xff0c;往往是小甜饼&#xff0c;叫做"幸运饼"&#xff…

conda安装pytorch1.10.1+paddlepaddle-gpu2.2.1+cuda10.2+cudnn7.6.5

NV驱动下载安装https://www.nvidia.cn/Download/index.aspx多卡的话&#xff0c;安装 NCCL https://developer.nvidia.com/nccl/nccl-download安装conda&#xff0c;并配置通道 vim ~/.condarc show_channel_urls: truessl_verify: truechannels:- https://mirrors.tuna.tsing…

十五、CSS 3新特性详解(三)——3D转换(位移、旋转、呈现)、透视perspective、旋转rotateX、Y、Z、呈现transform-style

HTML5 第三天 一、 认识 3D 转换 3D 的特点 近大远小物体和面遮挡不可见 三维坐标系 x 轴&#xff1a;水平向右 – 注意&#xff1a;x 轴右边是正值&#xff0c;左边是负值 y 轴&#xff1a;垂直向下 – 注意&#xff1a;y 轴下面是正值&#xff0c;上面是负值 z 轴&#x…