HTML+CSS的部分属性及使用

最新推荐文章于 2022-06-19 17:26:31 发布

Q_Quiet

最新推荐文章于 2022-06-19 17:26:31 发布

阅读量524

点赞数

分类专栏： html 文章标签： html css

本文链接：https://blog.csdn.net/q_quiet/article/details/89301916

版权

html 专栏收录该内容

3 篇文章 0 订阅

订阅专栏

样式表的三种引入

外部样式表
link rel=“stylesheet” type=“text/css” href=“mystyle.css”
内部样式表
style
内联样
p style=“color:red;margin:20px”
三种样式表的引入通常使用外部样式表和css一起

标签的三种用法

超链接
百度
超链接中会自带下划线
可以用text-decoration-line: none;来消除下划线；
作为锚点
用来发邮件打电话等联系

链接的四种状态

a🔗a对象在未被访问时的样式。
a:visited:a对象已经被访问过后的样式。
a:hover:鼠标在其上方悬浮时的样式。
a:active:链接被按下时候的样式。

选择器

id选择器和class选择器

class选择器

id选择器

两种列表

ul无序列表
开头以实心圆，空心圆等
可以用list-style-type: none;来消除前面的圆点；
ol有序列表
可以使用阿拉伯数字‘1,2,…’大写字母‘A,B…’小写字母‘a,b…’等表示顺序；
可以用start规定起始顺序的序号type规定序号类型；

列表原始状态的竖状列表，可以使用float:left;来改变为水平样式

盒子模型
margin为外边距
boder为边框
padding为内边距
content为内容的主体部分 hezi
可以设置边框的样式
border-top-style:单独设置上边界的样式
border-style:dotted solid;设置上下样式为dotted,左右样式为solid

boder-color：设置边框颜色
boder-width：设置边框宽度
boder-radius:设置边框的圆润程度

下拉菜单的实现

//.findone {
    position: fixed;
    right: 15px;
    z-index:2;
}
.dropfind{
    color: black;
    font-size: 20px;
}
.find {
    right:5px;
    text-align: center;
    background-color: rgb(238, 228, 228);
    display: none;
    position: absolute;
    border-radius: 5%;
    min-width: 135px;
}
.findone:hover .find {
    display: block;
}//

下拉菜单
背景
background-color:设置背景颜色
background-image:url(‘xx.jpg’);设置背景图片
background-repeat:repeat-y;沿y轴重复背景图片
background-repeat:repeat-x;沿x轴重复背景图片
background-repeat:no-repeat;不重复背景图片