1、css用户界面样式

a、鼠标样式(记住几个兼容性好的)

cursor:default/pointer/move/text;

b、轮廓 outline

outline:2px solid red;

outline:0/none(取消轮廓线)

c、防止拖拽文本域

textarea{resize:none;}

d、背景图片和背景颜色一起出现时,背景颜色在最底层。

e、行内块和文字对齐

vertical-align  对块级元素不起作用

图片和文字默认基线对齐

f、去除图片底侧空白缝隙

g、 溢出的文字隐藏

转载于:https://www.cnblogs.com/yangyutian/p/10630073.html

css学习_css用户界面样式相关推荐

  1. WEB前端学习:CSS学习_用户界面样式

    用户界面样式 文章目录 用户界面样式 一.鼠标样式 二.轮廓 三.防止文本域拖拽 四.去除图片底侧空白间隙 五.溢出文字隐藏 1. work-break 2. white-space 3. text- ...

  2. 【温故知新】CSS学习笔记(样式表)

    CSS-网页的美容师 CSS-Cascading Style Sheets 美化样式 通常叫做层叠样式表(级联样式表). CSS样式引入的方式有三种(书写位置): 1.内部样式表 <head&g ...

  3. css学习_css书写规范

    css书写规 1.空格规范: div { color: red; } 2.选择器规范 3.属性 属性定义要另起一行 属性定义后必须以分号结尾 div { color: red; font-size: ...

  4. 【CSS进阶】精灵图、字体图标、用户界面样式、常见布局技巧、初始化、CSS三角

    该系列文章是博主学习前端入门课程的笔记,同时也为了方便查阅,有任何问题都欢迎在评论区提出.本文主要介绍精灵图.字体图标.CSS三角.用户界面样式.vertical-align.常见布局技巧.初始化 思 ...

  5. 八、pink老师的学习笔记—— CSS用户界面样式(鼠标样式、轮廓线、防止拖拽文本域)

    2. CSS用户界面样式 所谓的界面样式, 就是更改一些用户操作样式,以便提高更好的用户体验. 更改用户的鼠标样式 (滚动条因为兼容性非常差,我们不研究) 表单轮廓等. 防止表单域拖拽 2.1 鼠标样 ...

  6. CSS基础(part16)--CSS用户界面样式

    学习笔记,仅供参考,有错必纠 参考自:pink老师课堂笔记 文章目录 CSS用户界面样式 鼠标样式cursor 轮廓线outline 防止拖拽文本域resize CSS用户界面样式 鼠标样式curso ...

  7. 前端笔记(9)元素的隐藏与显示,css用户界面样式,vertical-align垂直对齐,溢出文字省略号显示,css精灵技术,过渡,焦点,滑动门,margin负值

    css样式表/层叠样式表(7) 元素的隐藏与显示 (1)dispaly显示 (2)visibility可见性 (3)overflow溢出 css用户界面样式 鼠标样式cursor 轮廓线outline ...

  8. web前端入门学习 css(7)css高级技巧 (精灵图、字体图标、css三角、鼠标样式、表单轮廓线、文本框拖拽、垂直对齐、图底空白缝隙、margin负值、溢出文字省略号、文字环绕、css初始化)

    文章目录 精灵图 为什么需要精灵图? 精灵图的使用 精灵图课堂案例 用精灵图拼出自己的名字 字体图标 字体图标的下载 字体图标的引入 字体图标的追加 css三角(用边框border制作) 案例:京东三 ...

  9. html css图标怎么跟文字并排,CSS高级技巧:精灵图、字体图标、CSS三角做法、CSS用户界面样式、vertical-align属性应用、溢出文字省略号、常见布局技巧...

    CSS高级技巧目录 1.精灵图 使用原因:一个网页往往会有很多小的背景图片作为装饰,为了有效减少接收和发送请求的次数,提供页面加载速度,所以出现了精灵技术.核心原理就是将小图片整合到一张图里,这样浏览 ...

最新文章

  1. Git clone时出现Please make sure you have the correct access rights and the repository exists.问题已解决。
  2. libvirt 启动 qemu 的过程
  3. Webservice开发之xsd中开发list请求参数的接口
  4. 课程上线 -“新手入门 : Windows Phone 8.1 开发”
  5. java script 添加控件,【更新】GLG工具包Visualization and HMI Toolkit更新至v3.6,支持Java Script...
  6. 高级数据分析1代码_用Python进行数据分析,让你一看就会
  7. HTTP协商缓存与HTTP强缓存
  8. php上传png_PHP支持多种格式图片上传(支持jpg、png、gif)
  9. sdut3138: N!(计算n!中结尾零的个数)
  10. 贝茨视觉训练法 (Dr William Bates)方法
  11. 笔记本计算机怎么进入安全模式启动,笔记本怎么进入安全模式,详细教您联想笔记本怎么进入安全模式...
  12. 2020.10.27【GWAS】丨使用vcftools绘制pi(θπ) 选择消除分析图
  13. 第四周:基于图像相似度比较的分镜头
  14. 干货来了 | SQL 进阶技巧
  15. Scala基础语法1
  16. java socket实现的简易的聊天工具demo
  17. ES 如何实现向量搜索【以图搜图/语义搜索】
  18. php面向对象三大特性,PHP面向对象的三大特性之一封装性
  19. 无线电技术 | 关于无线定位技术TDOA的综合论述(一)
  20. Screenmonitor(全自动截屏软件)

热门文章

  1. 5款最好的MySQL自由软件工具
  2. 主动模式下FTP的详细工作过程
  3. cisco2950 查看端口流量
  4. python笔记9-多线程Threading之阻塞(join)和守护线程(setDaemon)
  5. Tomcat pool 发布脚本
  6. SAS接口互连完全指南
  7. Spring实战——Profile
  8. [c#] const 与 readonly
  9. PLSQL Developer简单使用教程
  10. Velocity简单语法及VelocityHelper封装