css手册txt（CSS样式中的a:focus的用法是什么）

本文目录

• CSS样式中的a:focus的用法是什么
• css如何让txt的\r\n 在html页面实现换行
• CSS选择器、优先级以及!important知识总结
• css3 文字阴影
• 学html可以看哪些入门书籍

CSS样式中的a:focus的用法是什么

CSS :focus 伪类
CSS 参考手册
定义和用法
:focus 伪类在元素获得焦点时向元素添加特殊的样式。
注释：IE 浏览器不支持此属性。
说明
这个伪类应用于有焦点的元素。例如 HTML 中一个有文本输入焦点的输入框，其中出现了文本输入光标；也就是说，在用户开始键入时，文本会输入到这个输入框。其他元素（如超链接）也可以有焦点，不过 CSS 没有定义哪些元素可以有焦点。
a:link {color: #FF0000} /* 未访问的链接 */
a:focus {color: #00FF00} /* 获得焦点的链接 */
注释：伪类的名称对大小写不敏感。
注释：伪类可与 CSS 类配合使用：
a.red:visited {color: #FF0000;}
《a class="red" href="css_syntax.asp"》CSS Syntax《/a》
如果上面这个例子中的链接已被访问过，那么它会显示为红色。
实例
规定获得焦点的输入字段的颜色：
input:focus
{
color:yellow;
}

css如何让txt的\r\n 在html页面实现换行

用&NBSP代替，代表英文空格，2个&NBSP连写代表一个中文空格。
\r\n，java开发时支持此写法，纯HTML静态页面不支持。
换行：用《br》...《/br》 或《br /》表示
换段：用《p》...《/p》表示
英文空格：用 表示
中文空格：用 表示
当然如果纯文本的话，
可以用padding或margin表示精确距离，也可用text-indent缩进属性表示。

CSS选择器、优先级以及!important知识总结

关于CSS选择器，首先请看这里： CSS 选择器参考手册

通过以上，我们可以将CSS选择器分为以下几种：

《script async src="//jsfiddle.net/hysunny/3gwbeu3v/embed/html,css,result/"》《/script》

示例：

说明：以下E表示元素，attr表示属性，val表示属性的值。

说明：以下E表示元素

示例：

示例：

示例：

示例：

E:not(s) ,匹配不符合当前选择器的任何元素

示例：

E:target ,匹配文档中特定"id"点击后的效果

示例：

这里我们简单讨论下后代元素选择器和子元素选择器的区别

示例

CSS优先级是指CSS样式在浏览器中被解析的 先后顺序 。

多重样式（Mutiple Styles）：如果外部样式、内部样式和内联样式同时应用于同一个元素，就是多重样式的使用情况。

一般情况下，（ 外部 样式）External style sheet 《（ 内部 样式）Internal style sheet 《（ 内联 样式）Inline style

例外 ：如果外部样式放在内部样式的后面，则外部样式将会覆盖内部样式。

示例：

给不同的选择器分配不同的权值

解释：

示例

结果：标签内的数据显示为蓝色。

比较样式的优先级是，只需统计不同选择器的个数，然后与对应的权值相乘即可。根据结果便可得出优先级。

看到这里，有些同学是不是对!important有点迷惑呀 为什么有了它，就优先级最高呐 下面我们再来详细讲一讲!important~

!important 是CSS1就定义的语法，作用是提高指定样式的应用优先权。

语法格式： {cssRule !important} ，即写在定义的最后面，例如： box { color: red !important}

声明了 !important 的样式，具有最高的优先级，相当于写在最下面（最后定义）

IE 6.0 不完全 支持!important

IE支持重定义中的!important，例如：

你将会发现定义了样式 class="yuanxin" 时，在IE下，字体显示为红色（#e00）。
但不支持同一定义中的 !important 。例如：

此时在IE6下不支持，你将会发现定义了样式 class="yuanxin" 时，字体显示为黑色（#000）。

解释 ：

important的样式属性和覆盖它的样式属性单独使用时(不在一个{}里)，IE 6.0认为!important优先级较高，否则当含!important的样式属性被同一个{}里的样式覆盖时，IE 6.0认为!important较低!
再举一个例子：

因为IE 6.0一直都不完全支持这个语法，而其他的浏览器都支持。因此我们就可以利用这一点来分别利用!important，我们可以针对IE和非IE浏览器设置不同的样式，只要在非IE浏览器样式的后面加上!important。

完。

总结内容参考以下：

w3school_CSS 选择器参考手册
阮一峰_CSS选择器笔记
css选择器优先级深入理解
CSS 的优先级机制

十分感谢你们的分享 n(*≧▽≦*)n

注：原文章首发于： CSS选择器、优先级以及!important知识总结 ，现迁移至此。

《script async src="//jsfiddle.net/hysunny/3gwbeu3v/embed/html,css,result/"》《/script》

css3 文字阴影

建议楼主多看看CSS手册。

语法：

text-shadow：none | 《shadow》 *

《shadow》 = 《length》{2,3} && 《color》?

默认值：none

适用于：所有元素

继承性：有

取值：

none：无阴影

《length》①：第1个长度值用来设置对象的阴影水平偏移值。可以为负值

《length》②：第2个长度值用来设置对象的阴影垂直偏移值。可以为负值

《length》③：如果提供了第3个长度值则用来设置对象的阴影模糊值。不允许负值

《color》：设置对象的阴影的颜色。

《!DOCTYPE html》
《html lang="zh-cn"》
《head》
《meta charset="utf-8" /》
《title》text-shadow_CSS参考手册_web前端开发参考手册系列《/title》
《style》
.test li{margin-top:10px;}
.test .mormal p{text-shadow:1px 1px rgba(0,0,0,.3);}
.test .blur p{text-shadow:1px 1px 1px rgba(0,0,0,.3);}
.test .group p{text-shadow:1px 1px 0 rgba(255,255,255,1),1px 1px 2px rgba(0,85,0,.8);}
《/style》
《/head》
《body》
《ul class="test"》
《li class="mormal"》
《strong》普通文字阴影《/strong》
《p》测试普通文字阴影效果《/p》
《/li》
《li class="blur"》
《strong》模糊文字阴影效果《/strong》
《p》测试模糊文字阴影效果《/p》
《/li》
《li class="group"》
《strong》多重模糊文字阴影效果《/strong》
《p》测试多重模糊文字阴影效果《/p》
《/li》
《/ul》
《/body》
《/html》

学html可以看哪些入门书籍

初学者入门书籍：

中文电子书

深入浅出html pdf中文版

魅丽的网页设计

Web程序设计(第5版)完整版

HTML & XHTML 权威指南(英文中文版)

Web编程入门经典：HTML、XHTML和CSS (第2版)

CSS商业网站布局之道（朱印宏著）

HTML与CSS入门经典（第7版）

Eric Meyer 谈CSS (卷1)

Eric Meyer 谈CSS (卷2)

无懈可击的Web设计

XHTML实例精解

XHTML技术内幕

HTML简明教程 中文PDF版

Dynamic HTML权威指南 第3版

XML基础教程入门、DOM、AJAX与FLASH（Sas Jacobs著）

网页视觉设计案例教程

英文原文电子书

Dive Into HTML5

HTML5.and.CSS3：Develop with Tomorrow’s Standards Today

HTML5 Step by Step

Beginning HTML with CSS and XHTML

Beginning CSS Web Development 从入门到精通

CSS Web Development从入门到精通

HTML,XHTML,and CSS - Visual Quickstart Guide 第六版

深入浅出HTML（英文版）

CSS（英文版）

完美HTML设计 - 使用CSS不用Table (第二版)

HTML, XHTML, and CSS Bible, 5th Edition

CSS禅意花园 (高级CSS开发)

O’Reilly CSS: The Definitive Guide 第三版(CSS权威指南)

Sams Teach Yourself HTML5 in 10 Minutes (5th Edition)

HTML5 and CSS3: Develop with Tomorrow’s Standards Today

Wrox Web Standards Programmer’s Reference

Spring into HTML and CSS

The Essential Guide to CSS and HTML Web Design

HTML & XHTML - The Complete Reference第四版

XHTML Moving toward XML

Mastering Integrated HTML and CSS

Build your Own WebSite - The Right Way Using HTML and CSS

Head First HTML with CSS & XHTML

The Best Practice Guide to xHTML and CSS

The CSS Anthology (第三版)

The CSS Anthology (第二版)

Sams Teach Yourself HTML 4 in 10 Minutes

Teach Yourself HTML in 10 Minutes 第四版

Ultimate HTML Reference

高级进阶电子书：

中文电子书

HTML5高级程序设计（完整版）

css3_for_web_designers

CSS精粹(第3版)

CSS Web设计高级教程第2版

大巧不工-WEB前端设计修炼之道

博客园精华集 Web标准之道

编写高质量代码-Web前端开发修炼之道（完整版）

变幻之美——DivCSS网页布局揭秘(案例实战篇)

Web导航设计

Web表单设计:点石成金的艺术

精通XHTML程序设计高级编程

彻底设计研究CSS

CSS时尚编程百例

英文原文电子书

Don’t Make Me Think!

Apress Pro CSS and HTML Design Patterns

CSS: Cascading Style Sheets for Web Design 第二版

The Book of CSS3: A Developer’s Guide to the Future of Web Design

Aessible XHTML and CSS Web Sites: Problem - Design - Solution

How to Do Everything With HTML

O’Reilly CSS Cookbook

A Book Apart CSS3 For Web Designers

Speed Up Your Site: Web Site

O’Reilly Designing Web Navigation

Beginning CSS: Cascading Style Sheets for Web Design

The Ultimate CSS Reference

Wrox CSS Instant Results

CSS Mastery: Advanced Web Standards Solutions

Creating Cool Web Sites with HTML, XHTML, and CSS

Beginning HTML with CSS and XHTML: Modern Guide and Reference

Aessible XHTML and CSS Web Sites

O’Reilly CSS The Missing Manual

Wiley Creating Web Sites Bible

Pro CSS for High Traffic Websites

HTML Manual of Style 4th

O’Reilly HTML5: Up and Running

Stunning CSS3: A project-based guide to the latest in CSS

The Definitive Guide to HTML5 Video

Canvas Pocket Reference: Scripted Graphics for HTML5

Apress.Pro.HTML5.Programming.Sep.2010

Pro CSS Techniques

W3C官方手册：

CSS完全参考手册3.0

xHTML完全参考手册 5合1 W3C官方权威手册

HTML 4.01 规范 - W3C官方HTML权威指南

HTML 4.0 参考手册 CHM

W3C HTML 3.2 规范

CSS 2 权威W3C官方参考手册 CHM

css手册2.0 3.0