发表于: 2019-06-05 21:47:30

1 837


今天完成的事件。

遇到问题修改轮播图

问题解决,如果用媒体查询修改 有大概率改崩溃,发现复制代码的后先在浏览器打开打直接复制它的类。

然后进行修改就比较简单了,如果用媒体查询改很容易改崩溃。


看师兄的代码了解到after选择器,又学到一个新的属性。

定义是选定元素之后插入内容。

使用content属性来指定插入内容

我用来事实现下划线效果如下:

代码如下:


G-li::after {
content: "";
position: absolute;
border-bottom: 1px solid rebeccapurple;
left: -15%;
height: 100%;
width: 88%;
visibility: hidden;


}

.G-li:hover::after {
visibility: visible;

}

这里注意有个新的属性 visibility属性:

使元素看不可见到,属性值:

参考:https://www.runoob.com/cssref/pr-class-visibility.html。

遇到问题:A标签是链接用的在鼠标点击的时候它字体就会变成原本的蓝色和下划线。

问题解决:下面是关于超级链接a的样式控制
a:link {
color: #FF0000; /*连接默认的颜色变化*/
}
a:visited {
color: #0000FF; /*连接访问的颜色变化*/
}
a:hover {
color: #00FF00; /*鼠标经过的颜色变化*/
}
a:active {
color: #FFFF00; /*鼠标按下的颜色变化*/
}

效果如下:

你鼠标移动上去就不会出现下划线和字体颜色发生改变。

代码如下:

.B-129-font{
font-size: 14px;color: black;
margin:0 15px ;

}
.B-129-font:visited{
color: black;
}
a:hover{
text-decoration:none ;

}

明天接着完成:第二个页面。


返回列表 返回列表
评论

    分享到