四大伪类,css鼠标样式设置,reset操作,静止对文本操作
07.31自我总结
一.a标签的四大伪类
- a:link{样式} 未访问时的状态(鼠标点击前显示的状态)
- a:hover{样式} 鼠标悬停时的状态
- a:visited{样式} 已访问过的状态(鼠标点击后的状态)
- a:active{样式} 鼠标点击时的状态
补充
- input:focus{样式} 点击后鼠标移开保持鼠标点击时的状态
- 上述中的hover,active也适合普通标签
父级 兄弟:hover ~ 自身 {}
自身:hover {}
注意:(只有在< a href=" "></ a>时标签中有效)
二.css鼠标样式设置
cursor是样式中的一种属性代表光标
cursor语法:auto | crosshair | default | hand | move | help | wait | text | w-resize |s-resize | n-resize |e-resize | ne-resize |sw-resize | se-resize | nw-resize |pointer | url (url)

布局设置:
- p{ cursor: text; } :设置鼠标移动到p标签对象时鼠标变为文本选择样式
- a { cursor: pointer; }:设置鼠标移动到a超链接对象时鼠标变为手指形状(链接选择)
- body{ cursor: url("小图片地址")}:设置鼠标指针默认为一个小图片
- 也可以结合a标签的四大伪类结合使用
注意:
cursor:url都是和伪类结合使用,而且书写格式要cursor:url(链接),auto;
三.reset操作
在开发中往往用不到四种伪类,且要清除掉系统的默认样式
就可以如下对a标签进行样式设置:清除系统默认样式 - reset操作
- 代码如下
a {
color: black; <!--清除他的颜色-->
text-decoration: none; <!--清除超链接的下划线-->
}
四.不允许对文本操作样式
- 不允许文本操作:user-select: none;
四大伪类,css鼠标样式设置,reset操作,静止对文本操作的更多相关文章
- 盒子总结,文本属性操作,reset操作,高级选择器,高级选择器优先级,边界圆角(了解),a标签的四大伪类,背景图片操作,背景图片之精灵图
盒子总结 ''' block: 设置宽高 1.没有设置宽,宽自适应父级的宽(子级的border+padding+width=父级的width) 2.没有设置高,高由内容撑开 设置了宽高 一定采用设置的 ...
- 清除系统默认样式,文本样式,高级选择器(权重),边界圆角,a标签的四大伪类,背景图片
清除系统默认样式 大多系统预定义标签,有默认样式,不满足实际开发需求,反倒影响布局通常清除系统样式,利于开发 body,h1-h6,p,table { margin:; } ul { margin:; ...
- CSS滚动条样式设置
webkit浏览器css设置滚动条 主要有下面7个属性 ::-webkit-scrollbar 滚动条整体部分,可以设置宽度啥的 ::-webkit-scrollbar-button 滚动条两端的按钮 ...
- CSS入门(定位之浮动定位、伪类之鼠标悬停、光标修改和透明度修改和列表样式)
一.定位 所为定位,实际上就是定义元素框相对于其正常位置,应该出现在哪儿 定位就是改变元素在页面上的默认位置 分类: 普通流定位(元素默认的定位方式) 浮动定位 相对定位 绝对定位 固定定位 1.普通 ...
- CSS(五):背景、列表、超链接伪类、鼠标形状控制属性
一.背景属性 1.背景属性用来设置页面元素的背景样式. 2.常见背景属性 属性 描述 background-color 用来设置页面的背景色,取值如red,#ff0000 background-ima ...
- 利用 :before :after伪类实现鼠标悬浮动画效果
1.最近在逛网站的时候,想找一下喜欢的鼠标悬浮效果,避免广告的嫌疑,直接放图了: 2.在实现的时候,如果在直接使用鼠标hover ,transform,进行过渡,不能达到想要的效果,因为同时只能触发一 ...
- CSS 鼠标样式大全
cursor是CSS中用于定义鼠标在元素标签上的显示样式,如常用的手型鼠标样式 cursor: pointer; 也可以通过url网址指定扩展名一般为.cur的鼠标图片文件. 名称 属性代码 描述 默 ...
- css 字体样式设置大全
css样式大全(整理版) 字体属性:(font) 大小 {font-size: x-large;}(特大) xx-small;(极小) 一般中文用不到,只要用数值就可以,单位:PX.PD 样式 { ...
- css 字体样式设置
css字体样式(Font Style),属性 时间:2014-05-08 21:49 来源:我爱学习网 | 作者:我爱学习网 | 本文已影响 68353 人 css字体样式(Font Style) ...
随机推荐
- Java设计模式: 单例模式
1.需要传递参数: public class Singleton{ private volatile static Singleton instance = null; private int val ...
- Android绘图通用第三方控件
https://github.com/ddanny/achartengine CodePull requests 2SecurityInsights Charting library fo ...
- initGLWidgetAndViewer
void initGLWidgetAndViewer() { osgViewer::ViewerBase::ThreadingModel threadingModel = osgViewer::Vie ...
- DB2存储过程简单示例
在这个示例中,我们将在DB2中创建一个名为DEMO1201的存储过程. 该存储过程的输入参数IN_NAME和IN_CREDITCARD,表示用户的姓名和身份证号. 该存储过程的作用是根据身份证号来新建 ...
- HttpRequest Get和Post调用其他页面的方法
HttpRequest Get和Post调用其他页面的方法,需要的朋友可以参考一下 //Get请求方式 private string RequestGet(string Url) { ...
- 纯js脚本操作excel
纯js脚本解析excel,并渲染为htm表格,投放大屏并滚动! 代码:https://github.com/tianbogit/js_excel
- RobotFramework:发现一个大坑,当post接口入参为json时,千万不能用sojson转化后的json串(ride解析会有异常,非sojson工具问题),直接用浏览器粘过来的就行
问题背景: 和以往一样愉快的进行着自动化测试,突然就不停的提示我,“程序异常”,查看log发现data中的json变为了数组?????? 那算了,我不先组装入参数据直接data=json入参吧,wha ...
- Flutter布局--appbar导航栏和状态栏
MaterialApp 先看下上图的具体用法:1. title:标题2. actions:表示右侧的按钮的动作3. leading:表示左侧的按钮的动作4. flexibleSpace:5. back ...
- Win 7 环境上,ThingsBoard安装及启动
一.参考官方网址进行Thingsboard的下载与安装, 官方教程https://thingsboard.io/docs/user-guide/install/windows/#step-2-thin ...
- Dapper.NET—轻量ORM
Dapper.NET使用 本文目录 Dapper.NET使用 1.为什么选择Dapper 2.以Dapper(4.0)为例. 2.1 在数据库中建立几张表. 2.2实体类. 3.使用方法 3.1 一 ...