css圆角的写法！

2023-03-01 00:32:02html-css09

css圆角的写法！,第1张

方法一：CSS3 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" " http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html xmlns=" http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/htmlcharset=utf-8" /><meta http-equiv="Content-Language" content="utf-8" /><meta name="robots" content="all" /><meta name="author" content="Tencent-ISRD" /><meta name="Copyright" content="Tencent" /><title>Border-radius</title></head><body><div style="border-width: 1pxborder-style: solid-moz-border-radius: 11px-khtml-border-radius: 11px-webkit-border-radius: 11pxborder-radius: 11pxpadding:5px">在Firefox和Safari 3的浏览器里能看到圆角效果</div></body></html>方法二：CSS2 先做好四个圆角背景图，再定义四个角的类，如：.TL .TR .BL .BR。四个角使用绝对定位，定位在层的左上、右上、左下、右下位置

您好，您的问题实现起来并不复杂。我说一下思路吧。

1）按钮问题：例如小灯，你要准备两套图片，一套灰色的灯代表关闭，另一套黄色的灯代表打开。当点击小灯后，利用JS代码把灰灯图片替换成黄灯图片。OFF和ON按钮处理方法相同。当然，要先点击ON后小灯才能被点亮，这与现实生活中的风扇一样，OFF时小灯是不能被点亮的。

2）风扇旋转问题：CSS3有新功能：object.style.transform="rotate(10deg)" ，表示将这个元素旋转10度。要让风扇转起来，你要做两件事：1是准备一张风扇的图片；2当按下ON按钮后启动定时器SetInterva，每隔一定时间就用上述旋转命令转动风扇图片。时间越短转得越快。当选择不同的速度时，修改不同的的定时器定时参数。比如1档时间为100毫秒（旋转最快），2档200毫秒，3档300毫秒（旋转最慢）。具体数值要看最终效果而定。

CSS发展史

CSS（Cascading Style Sheets，层叠样式表）是一种将表示样式应用到标记的系统。CSS以设计、改变其HTML页面的样式而知名，并使用于Web和其他媒介，如XML文档中。1996年12月W3C推出了CSS规范的第一个版本，1998年W3C发布了CSS的第二个版本即CSS2.0,2001年5月W3C开始进行CSS3标准的制定，到目前为止该标准还没有最终定稿。

CSS1.0

选择器：要使用CSS对HTML页面中的元素实现一对一，一对多或者多对一的控制，就需要用到CSS选择器。选择器大致分为派生选择器、ID选择器和类选择器，用来定义希望应用样式的HTML元素或者标签。

样式属性：该属性主要包括Font字体、Text文本、Background背景、Position定位、Dimensions尺寸、Layout布局、Margin外边框、Border边框、Padding内边框、List列表、Table表格和Scrollbar滚动条等，用于定义网页的一些样式变化。

伪类属性：主要定义了针对描述对象a的link、hover、active、visited和针对节点的first-letter、first-child、first-line等几个伪类属性。

保存方式：用户可以直接存储在HTML网页中，也可以将CSS样式代码存储为独立的样式表文件。

CSS2.0

选择器：css2提供了更多强大的选择器，用来定位HTML节点或者标记

符号名称

含义

示例

用于匹配任何标记

*{color：red}