做了一个简单的网页,从布局到加内容,遇到了很多小问题。很多标签和属性都不会用或者忘记了。所以以此记录一下。

一、如何将边框四角变圆?(或做一个圆形)

顾名思义,如果要更改边框的角需要用到边框(border)的属性。

利用radius属性进行更改,后面的值越大,角的圆度越大。

画的很辛苦。点个吧!!


二、段落文字下划线(and整段)

1、鼠标悬浮下划线

通常我们写鼠标悬浮下划线的时候都会使用:border-bottom:1px solid black;这样的方式。但是对于一整段并分上下行的用此方法就会出现问题。

这个时候我们可以使用属性标签:text-decoration: underline;

underline:下划线

            #jjj:hover{
text-decoration: underline;
}

2、段落永久下划线

            #jjj:visited{
text-decoration: underline;
}

也可以使用link的方式:

#jjj:link{
text-decoration: none;
}

效果是一样的。


三、CSS延迟效果(transition)

这个效果是鼠标悬浮慢慢的或快快的变成其他效果。非常使用,也很好看。

            #jjj:hover{
background-color: black;
transition: 1s;
}


四、英文字母全部大写

使用标签属性:text-transform: uppercase;

 


五、调整透明度 

对于一些需要调整透明度的,opacity用起来还是挺方便的。

            #jjj{
width: 200px;
height: 200px;
background-color: yellowgreen;
opacity: 0.6;
}

CSS网页制作常用标签的更多相关文章

  1. HTML|CSS之HTML常用标签

    知识内容: 1.标签 2.head内标签 3.body内常用标签 注:本人使用的HTML为HTML5 一.标签 1.标签格式 标签的语法: <标签名 属性1=“属性值1” 属性2=“属性值2”… ...

  2. WP主题制作常用标签代码

    WordPress模板结构 style.css : CSS文件index.php : 主页模板archive.php : Archive/Category模板404.php : Not Found 错 ...

  3. 项目实践2:项目中的CSS网页布局(常用)

    好家伙, 整个网页做下来,最主要的,自然是css的网页布局(菜鸟好用啊) 我需要一个大概这样的布局: 然后上代码: <!DOCTYPE html> <html> <hea ...

  4. 网页制作常用的CSS知识

    在制作网页中,我们会用到很多CSS的知识,在这里我简单的总结了一些. div    划分区块 ul,li 无序列表(配合划分区块) ol,li 有序列表 a 超链接标签 p 段落标签 h 标题标签 i ...

  5. html和css的一些常用标签使用

    HTML(HyperText Mark-up Language)超文本标签语言 <!DOCTYPE html> <!--声明这是一个html文档--> <html> ...

  6. DIV+CSS网页布局常用的一些基础知识

    CSS命名规范 一.文件命名规范 全局样式:global.css:框架布局:layout.css:字体样式:font.css:链接样式:link.css:打印样式:print.css: 二.常用类/I ...

  7. DIV+CSS网页布局常用的一些基础知识整理

    CSS命名规范 一.文件命名规范 全局样式:global.css: 框架布局:layout.css: 字体样式:font.css: 链接样式:link.css: 打印样式:print.css: 二.常 ...

  8. 平常写css网页制作时最实用的九条CSS技巧

    一.使用css缩写 使用缩写可以帮助减少你CSS文件的大小,更加容易阅读.css缩写的主要规则请参看<css基本语法>. 二.明确定义单位,除非值为0 忘记定义尺寸的单位是CSS新手普遍的 ...

  9. 9月5日网页基础知识 通用标签、属性(body属性、路径、格式控制) 通用标签(有序列表、无序列表、常用标签)(补)

    网页基础知识 一.HTML语言 HTML语言翻译汉语为超文本标记语言. 二.网页的分类 1.静态页面:在静态页面中修改网页内容实际上就是修改网页原代码,不能从后台操作,数据来只能来源于原于代码.静态网 ...

随机推荐

  1. [UWP] 对应用进行A/B测试

    [对A/B测试的看法] 开发者在Dev Center中设置几种应用变体,这几种变体有几个变量的值不一样,比如有变体A和变体B(当然还可以加上变体C,Dev Center最多支持5个变体),A和B的不同 ...

  2. linux安装Jenkins

    一.下载jenkins 最新地址在:https://jenkins.io 我下载的是:Jenkins 2.35.war,下载好直接放到tomcat的webapp目录里,启动tomcat就可以运行了 二 ...

  3. 3 django系列之Form表单在前端web界面渲染与入库保存

    author: 温柔易淡(Leo),欢迎技术交流与拍砖 preface 我们在前端写表单的时候,其实可以使用django自带的forms功能来实现,特别是在处理 修改已经存在数据 的场景特别好用,下面 ...

  4. thinkphp3.2.3中U()方法和redirect()方法区别

    今天博主看3.1的教程,学着3.2,就遇到了这个坑,怎么就是不跳转呢,很纳闷!! 在thinkphp3.1 中 U()方法是可以执行跳转的(看视频教程里面是可以的,博主没有测试过). 但是在think ...

  5. oracle中临时表是用来做什么的

    oracle中临时表是用来做什么的 某些情况下, 需要 多个非常大的表关联的情况下, 但是需要检索的, 是少量的数据的时候.可以先把 大表的数据, 检索出那一小部分, 然后插入到 临时表中, 最后再关 ...

  6. ADO.NET--收藏整理别人的教程

    本文所有内容均从前辈的博客中收集整理而来,仅供自己学习参考的时候快速访问用. ADO.NET入门教程(一) 初识ADO.NET ADO.NET入门教程(二)了解.NET数据提供程序 ADO.NET入门 ...

  7. QR 二维码总结

    @(Java ThirdParty)[QR] QR 二维码总结 根据Wiki中的介绍,QR Code(Quick Response Code),二维条形码,由日志设计应用于汽车制造工业中.条形码中包含 ...

  8. DEDEcms 在php5.4以上 后台登录空白解决办法

    本次环境php5.5 首先确定 dede data文件夹已经有写入权限 775 777都可以 然后再远程桌面或者FTP修改 include/userlogin.class.php 文件 注释掉下面六句 ...

  9. bootstrap中popover.js(弹出框)使用总结+案例

    bootstrap中popover.js(弹出框)使用总结+案例 *转载请注明出处: 作者:willingtolove: http://www.cnblogs.com/willingtolove/p/ ...

  10. RabbitMQ 简介

    1. MQ描述 MQ全程为Message Queue,消息队列(MQ)是一种应用程序对应用程序通信的方法.应用程序通过读写出入队列的消息来通信,而无需专用连接来链接它们.消息传递指的是程序之间通过在消 ...