如何解决使用html5是否可以使像Microsoft Word这样的“悬挂缩进”CTRL + T?
如何使用html5制作类似于Microsoft Word的“悬挂缩进” (CTRL+T)
?
.center-indent{
/*some styles here*/
}
是否有可能在这种情况下同时做出响应?还是我必须缩进每一行才能使其相似。
解决方法
是的,您可以为此使用padding
和text-indent
p {
padding-left: 5%;
text-indent: -5%;
}
.fixed-px {
padding-left: 20px;
text-indent: -20px;
}
@media (min-width: 992px) {
.fixed-px {
padding-left: 15px;
text-indent: -15px;
}
}
/* more media queries here if necessary */
<p>
Pharetra eros mi eros accumsan dui. Pellentesque ipsum iaculis. Mi neque in nonummy venenatis vestibulum. Class egestas adipiscing nisl tellus quam ut in amet. Nostra nunc leo lorem eget ipsum elit eget metus nam sed pede. Nam nibh risus sit dui nullam.
Consequat luctus tempus.
</p>
<p>
Pede tellus eu mattis morbi donec. Natoque class leo. Ac lacus vestibulum ac odio ac. Risus lorem mauris. Proin enim tortor at erat dui. Aliquam magna condimentum. Orci donec morbi. Id justo at malesuada erat nulla urna quam eu nec elit commodo mi voluptatum
gravida ante bibendum justo. Eleifend nec eget. Id massa quis eu vitae elit. Bibendum interdum semper. Donec libero duis. Phasellus malesuada adipiscing qui et eu. Justo egestas erat auctor sagittis sed nonummy amet dolor et in id. Ut blandit justo.
Donec fringilla cursus enim velit ullamcorper.
</p>
<p class="fixed-px">
Pharetra eros mi eros accumsan dui. Pellentesque ipsum iaculis. Mi neque in nonummy venenatis vestibulum. Class egestas adipiscing nisl tellus quam ut in amet. Nostra nunc leo lorem eget ipsum elit eget metus nam sed pede. Nam nibh risus sit dui nullam.
Consequat luctus tempus.
</p>
<p class="fixed-px">
Pede tellus eu mattis morbi donec. Natoque class leo. Ac lacus vestibulum ac odio ac. Risus lorem mauris. Proin enim tortor at erat dui. Aliquam magna condimentum. Orci donec morbi. Id justo at malesuada erat nulla urna quam eu nec elit commodo mi voluptatum
gravida ante bibendum justo. Eleifend nec eget. Id massa quis eu vitae elit. Bibendum interdum semper. Donec libero duis. Phasellus malesuada adipiscing qui et eu. Justo egestas erat auctor sagittis sed nonummy amet dolor et in id. Ut blandit justo.
Donec fringilla cursus enim velit ullamcorper.
</p>
如果您使用%
值,它将响应-或者您可以对每个断点使用media queries
和固定的px
值。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。