Tôi có hình ảnh sau đây trong tập tin .svg tôi:Định tâm hình ảnh với SVG
<image xlink:href="developer.mozilla.png" x="50%" y="50%" height="62" width="71"/>
Tôi muốn nó hiển thị ở giữa trang, nhưng có vẻ như góc trên bên trái là ở giữa. Làm cách nào để tôi có thể hiển thị trung tâm của hình ảnh ở giữa trang?
Something như thế này nên làm việc:
<image xlink:href="developer.mozilla.png" x="50%" y="50%" height="62" width="71" transform="translate(-35.5,-31)"/>
Dưới đây là một cách ...
<svg width="100%" height="100%" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<svg x="50%" y="50%" width="258px" height="221px" overflow="visible">
<image x="-129px" y="-110.5px" width="258px" height="221px" xlink:href="http://images2.wikia.nocookie.net/__cb20110303182948/hogwartsrpg/images/9/95/KittenCareCat.png"/>
</svg>
</svg>
Cảm ơn. Đó là rất nhiều công việc, nhưng nó hoạt động. Tôi sẽ để nó mở ra một lúc và xem liệu có ai có thể nghĩ ra điều gì dễ dàng hơn không, nhưng nếu không, đó là của bạn. – SomeKittens
Mẫu này hoạt động tốt khi bạn có các đối tượng lồng nhau và các điểm pivot. Cảm ơn vì điều đó! –
Đây là thiên tài, cảm ơn bạn rất nhiều vì đã chia sẻ. Đã lưu tôi khi cố chuyển đổi vòng tròn màu thành hình bitmap tròn trên bố cục lỏng. – mmmeff
điều này không hoạt động nếu 'height' hoặc' width' không phải là pixel – depperm
@depperm true, cho đến khi biến đổi hỗ trợ các đơn vị (mà nó đã làm trong css) –