当我们选中网页上的文字时,通常的效果是蓝底白字,其实,底色和字体颜色是可以改变的。
我们可以使用伪元素来实现这种效果:
首字下沉,是否似曾相识呢?哦,是在以前学 word 软件文字排版的时候。在一些报纸上经常都会看见首字下沉的效果,其他文字围绕在它周围。
看上去还是这么回事。
通过锚点,我们可以滚动到网页特定的位置,原始的锚点跳转是没有过渡效果的。注意滚动条:
通过 CSS scroll-behavior 属性可以让滚动变得更加丝滑。
caret-color 属性可以让我们自定义 input 框闪烁的光标,是不是很神奇鸭
给透明背景图片加背景,感觉很厉害的样子。两行 CSS 样式九搞定咯:
我们可以修改滚动条的样式,滚动条变得更加炫酷。
如果你不想让用户选中页面上的文字,就可以用这个特性了。
很多情况下都需要应用到IE盒子模型的特性,让元素的宽度、高度包含border和padding。
分析问题:
文本框获取焦点时,浏览器给采用默认的处理方式,为其加上高亮外边框。
解决思路:
我们可能通过,在input获取焦点时,采用css将文本框的外边框去掉。为文本框添加如下样式即可。
outline:none
样式代码:
input:focus {outline:none}下面给出一个完成的示例代码:
<html><head>
<style>
form{background-color : #FF00F1Fheight:50pxpadding : 15px}
.inputStyle, .inputStyle:focus {outline:none}
</style>
</head>
<body>
<div id="dh2">
<form>
<input type="text" class="inputStyle"/>
<input type="text" />
</form>
</div>
</body>
</html>
left:100px去掉就好了,可以用float之类的做,然后width里面加一点宽度,float:left 或者right一般就能定位了。
用类似mouseover 的也能做。类似下面这种,希望对你有启发。
<a href="#" target="_blank" title=""><img src="1.jpg"
onmouseover="this.src='2.jpg'"
onmouseout="this.src='3.jpg'">
</img>
</a>