12:.css3新特性

最新推荐文章于 2022-06-10 15:22:28 发布

白山茶ι

最新推荐文章于 2022-06-10 15:22:28 发布

阅读量502

点赞数 1

分类专栏： web入门教程文章标签： web css

本文链接：https://blog.csdn.net/Carol_x/article/details/102756106

版权

1：圆角边框

属性选择器根据元素的属性名或属性值来选择元素，使用一对方括号【】

在这里插入图片描述

<html>
<head>
<meta charset="UTF-8">
<title>属性选择器</title>
<style type="text/css">
[title]{
   
border-radius:30px;/*属性选择器*/
}
img[title="3"]{
   
border-radius:60px;
}
ul[type]{
   
color:red;
}
</style>
</head>
<body>
<img src="images/2.jpg"/>
<img src="images/2.jpg" title="2"/>
<img src="images/2.jpg" title="3"/>
<br/>
<input type = "button" value="确定"/>
<ul type="disc">
<li>北京</li>
<li>武汉</li>
</ul>
</body>
</html>

在这里插入图片描述
2.最后一个子元素list-child伪类选择器

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>新闻</title>
<style type="text/css">
* {
   
	margin: 0;
	padding: 0;
	box-sizing: border-box;/*消除默认内边距的膨胀效果*/
}

ul {
    /*块级元素*/
	margin: 0 auto;
	margin-top: 20px;
	width: 300px;/*定宽不定高*/
	list-style: none;
	border: 2px solid #1FC195; /*整个列表边框 */
}


ul li {
   
	font-size: 20px;
	line-height: 40px;
	border-bottom: 1px dashed #1FC195;/* 下边框为点划线 */

最低0.47元/天解锁文章

白山茶ι

关注

1
点赞
踩
4

收藏

觉得还不错? 一键收藏
0
评论
12:.css3新特性

1：圆角边框属性选择器根据元素的属性名或属性值来选择元素，使用一对方括号【】<html><head><meta charset="UTF-8"><title>属性选择器</title><style type="text/css">[title]{border-radius:30px;/*属性选择器*/}...
复制链接

扫一扫